fix(compiler): dictionary path calculation (#1130)

Author: mathio

.changeset/wet-spoons-report.md

@@ -0,0 +1,6 @@
+---
+"@lingo.dev/_compiler": patch
+"lingo.dev": patch
+---
+
+dictionary path calculation

demo/next-app/next.config.ts

@@ -8,8 +8,6 @@ const nextConfig: NextConfig = {
 export default lingoCompiler.next({
   sourceLocale: "en",
   targetLocales: ["es", "ja", "fr", "ru", "de", "zh", "ar", "ko"],
-  models: {
-    "*:*": "groq:mistral-saba-24b",
-  },
+  models: "lingo.dev",
   useDirective: true,
 })(nextConfig);

demo/react-router-app/vite.config.ts

@@ -11,9 +11,7 @@ export default defineConfig(({ isSsrBuild }) =>
     sourceRoot: "app",
     targetLocales: ["es", "fr", "de"],
     useDirective: false,
-    models: {
-      "*:*": "groq:mistral-saba-24b",
-    },
+    models: "lingo.dev",
   })({
     plugins: [tailwindcss(), reactRouter(), tsconfigPaths()],
   }),

packages/compiler/src/_utils.spec.ts

@@ -1,8 +1,5 @@
 import { afterEach, describe, expect, it, vi } from "vitest";
 
-// Helper to build expected relative path
-const EXPECTED_RELATIVE_PATH = "../../lingo/dictionary.js";
-
 afterEach(() => {
   // Reset module registry and any mocks so each test gets a fresh copy
   vi.resetModules();
@@ -11,6 +8,33 @@ afterEach(() => {
 });
 
 describe("getDictionaryPath", () => {
+  it.each([
+    {
+      sourceRoot: "src",
+      lingoDir: "lingo",
+      relativeFilePath: "./components/Button.tsx",
+      expected: "./../lingo/dictionary.js",
+    },
+    {
+      sourceRoot: "src/app/content",
+      lingoDir: "i18n",
+      relativeFilePath: "../../components/Button.tsx",
+      expected: "./../app/content/i18n/dictionary.js",
+    },
+  ])(
+    "returns correct path for file $relativeFilePath in $sourceRoot",
+    async ({ sourceRoot, lingoDir, relativeFilePath, expected }) => {
+      const { getDictionaryPath } = await import("./_utils");
+
+      const result = getDictionaryPath({
+        sourceRoot,
+        lingoDir,
+        relativeFilePath,
+      });
+      expect(result).toBe(expected);
+    },
+  );
+
   it("returns POSIX-style relative path on POSIX", async () => {
     // Import fresh copy with the real Node "path" module (POSIX on *nix, win32 on Windows)
     const { getDictionaryPath } = await import("./_utils");
@@ -21,7 +45,7 @@ describe("getDictionaryPath", () => {
       relativeFilePath: "/project/src/components/Button.tsx",
     });
 
-    expect(result).toBe(EXPECTED_RELATIVE_PATH);
+    expect(result).toBe("./../lingo/dictionary.js");
     // Ensure no back-slashes slip through
     expect(result).not.toMatch(/\\/);
   });
@@ -41,7 +65,7 @@ describe("getDictionaryPath", () => {
       relativeFilePath: "C:\\project\\src\\components\\Button.tsx",
     });
 
-    expect(result).toBe(EXPECTED_RELATIVE_PATH);
+    expect(result).toBe("./../lingo/dictionary.js");
     expect(result).not.toMatch(/\\/);
   });
 });

packages/compiler/src/_utils.ts

@@ -8,15 +8,15 @@ export type GetDictionaryPathParams = {
   relativeFilePath: string;
 };
 export const getDictionaryPath = (params: GetDictionaryPathParams) => {
-  const absolute = path.resolve(
+  const toFile = path.resolve(
     params.sourceRoot,
     params.lingoDir,
     LCP_DICTIONARY_FILE_NAME,
   );
-
-  // let Node figure the relative path first
-  const rel = path.relative(params.relativeFilePath, absolute);
-
-  // then normalise the separator once
-  return rel.split(path.sep).join(path.posix.sep);
+  const fromDir = path.dirname(
+    path.resolve(params.sourceRoot, params.relativeFilePath),
+  );
+  const relativePath = path.relative(fromDir, toFile);
+  const normalizedPath = relativePath.split(path.sep).join(path.posix.sep);
+  return `./${normalizedPath}`;
 };