refactor: impl

src/components/md-commander/index.tsx

@@ -1,13 +1,13 @@
 import { customElement, noShadowDOM } from "solid-element";
-import { onMount, onCleanup, Show, createEffect } from "solid-js";
-import { useCommander, initializeCommands } from "./hooks";
+import { onMount, onCleanup, Show, createEffect, on } from "solid-js";
+import { useCommander } from "./hooks";
 import { CommanderInput } from "./CommanderInput";
 import { CommanderEntries } from "./CommanderEntries";
 import { TrackerView } from "./TrackerView";
 import { TabBar } from "./TabBar";
 import type { MdCommanderProps } from "./types";
 import { loadElementSrc, resolvePath } from "../utils/path";
-import { loadCommandTemplates } from "./utils/commandTemplates";
+import { initializeCommands, loadCommandTemplatesFromCSV } from "./stores/commandsStore";
 
 customElement<MdCommanderProps>(
   "md-commander",
@@ -15,13 +15,21 @@ customElement<MdCommanderProps>(
   (props, { element }) => {
     noShadowDOM();
     const { articlePath, rawSrc } = loadElementSrc(element as any);
-    const commander = useCommander(props.commands);
 
-    createEffect(async () => {
-      if (!rawSrc) return;
-      const commands = initializeCommands(props.commands);
-      await loadCommandTemplates(commands, resolvePath(articlePath, rawSrc));
-    });
+    // 初始化命令并注册到 store
+    const commands = initializeCommands(props.commands);
+    const commander = useCommander(commands);
+
+    // 加载 CSV 模板
+    createEffect(
+      on(() => props.commandTemplates, async (csvPaths) => {
+        if (!csvPaths || !rawSrc) return;
+        await loadCommandTemplatesFromCSV(csvPaths, resolvePath, articlePath);
+        // 更新 commander 中的命令（从 store 获取）
+        const { getCommands } = await import("./stores/commandsStore");
+        commander.setCommands(getCommands());
+      }),
+    );
 
     const handleKeyDown = (e: KeyboardEvent) => {
       if (commander.showCompletions() && commander.completions().length > 0) {