Require file extensions on non-package imports (#468)

Author: bfollington

typescript/packages/jumble/eslint.config.js

@@ -2,6 +2,7 @@ import js from "@eslint/js";
 import globals from "globals";
 import reactHooks from "eslint-plugin-react-hooks";
 import reactRefresh from "eslint-plugin-react-refresh";
+import importPlugin from "eslint-plugin-import";
 import tseslint from "typescript-eslint";
 
 export default tseslint.config(
@@ -16,6 +17,7 @@ export default tseslint.config(
     plugins: {
       "react-hooks": reactHooks,
       "react-refresh": reactRefresh,
+      "import": importPlugin
     },
     rules: {
       "@typescript-eslint/no-explicit-any": "off",
@@ -24,6 +26,13 @@ export default tseslint.config(
         "warn",
         { allowConstantExport: true },
       ],
+      "import/extensions": [
+        "error",
+        "always",
+        {
+          "ignorePackages": true,
+        }
+      ],
     },
   },
 );

typescript/packages/jumble/package.json

@@ -51,6 +51,7 @@
     "cmdk": "^1.0.4",
     "csstype": "^3.1.3",
     "emoji-picker-react": "^4.12.0",
+    "eslint-plugin-import": "^2.31.0",
     "json5": "^2.2.3",
     "merkle-reference": "^2.0.1",
     "react": "^18.3.1",

typescript/packages/jumble/src/views/CharmList.tsx

@@ -1,8 +1,8 @@
-import { useCell } from "@/hooks/use-cell";
+import { useCell } from "@/hooks/use-cell.ts";
 import { NavLink } from "react-router-dom";
 import { NAME, UI } from "@commontools/builder";
 import { useCharmManager } from "@/contexts/CharmManagerContext.tsx";
-import { Charm, CharmManager } from "@commontools/charm";
+import { Charm } from "@commontools/charm";
 import { charmId } from "@/utils/charms.ts";
 import { useEffect, useRef, useState } from "react";
 import { Card } from "@/components/Card.tsx";
@@ -11,7 +11,7 @@ import { render } from "@commontools/html";
 import { Cell } from "@commontools/runner";
 import ShapeLogo from "@/assets/ShapeLogo.svg";
 import { MdOutlineStar } from "react-icons/md";
-import { useSyncedStatus } from "@/hooks/use-synced-status";
+import { useSyncedStatus } from "@/hooks/use-synced-status.ts";
 
 export interface CommonDataEvent extends CustomEvent {
   detail: {