🐛 fix(editor): fix slash command codeblock not working (#11321)

Fixes LOBE-2454

- Upgrade @lobehub/editor to ^3.7.0 to get codeblock fix
- Use INSERT_CODEMIRROR_COMMAND directly instead of editorState.codeblock()
- Add proper focus handling after inserting codeblock
- Remove unused editorState dependency from useSlashItems
- Add proper type annotation for editorState

package.json

@@ -202,7 +202,7 @@
     "@lobehub/chat-plugin-sdk": "^1.32.4",
     "@lobehub/chat-plugins-gateway": "^1.9.0",
     "@lobehub/desktop-ipc-typings": "workspace:*",
-    "@lobehub/editor": "^3.6.0",
+    "@lobehub/editor": "^3.7.0",
     "@lobehub/icons": "^4.0.2",
     "@lobehub/market-sdk": "0.28.0",
     "@lobehub/tts": "^4.0.2",

src/features/PageEditor/EditorCanvas/useSlashItems.tsx

@@ -1,6 +1,7 @@
 import {
   type IEditor,
   INSERT_CHECK_LIST_COMMAND,
+  INSERT_CODEMIRROR_COMMAND,
   INSERT_HEADING_COMMAND,
   INSERT_HORIZONTAL_RULE_COMMAND,
   INSERT_IMAGE_COMMAND,
@@ -28,12 +29,11 @@ import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { openFileSelector } from '@/features/PageEditor/EditorCanvas/actions';
-import { usePageEditorStore } from '@/features/PageEditor/store';
 import { useFileStore } from '@/store/file';
 
 export const useSlashItems = (editor: IEditor | undefined): SlashOptions['items'] => {
   const { t } = useTranslation('editor');
-  const editorState = usePageEditorStore((s) => s.editorState);
+
   const uploadWithProgress = useFileStore((s) => s.uploadWithProgress);
 
   const handleImageUpload = async (file: File) => {
@@ -179,8 +179,11 @@ export const useSlashItems = (editor: IEditor | undefined): SlashOptions['items'
         icon: SquareDashedBottomCodeIcon,
         key: 'codeblock',
         label: t('typobar.codeblock'),
-        onSelect: () => {
-          editorState.codeblock();
+        onSelect: (editor) => {
+          editor.dispatchCommand(INSERT_CODEMIRROR_COMMAND, undefined);
+          queueMicrotask(() => {
+            editor.focus();
+          });
         },
       },
       {

src/features/PageEditor/store/initialState.ts

@@ -1,4 +1,5 @@
 import { type IEditor } from '@lobehub/editor';
+import { type EditorState } from '@lobehub/editor/react';
 
 export interface PublicState {
   autoSave?: boolean;
@@ -16,7 +17,7 @@ export interface State extends PublicState {
   currentEmoji: string | undefined;
   currentTitle: string;
   editor?: IEditor;
-  editorState?: any; // EditorState from useEditorState hook
+  editorState?: EditorState;
   isDirty: boolean; // Track if there are unsaved changes
   isLoadingContent: boolean; // Track if content is being loaded
   lastSavedContent: string; // Last saved content hash for comparison