脚本管理增加可预览检查

back/services/notify.ts

@@ -801,7 +801,7 @@ export default class NotificationService {
       webhookContentType,
     } = this.params;
 
-    if (!webhookUrl.includes('$title') && !webhookBody.includes('$title')) {
+    if (!webhookUrl?.includes('$title') && !webhookBody?.includes('$title')) {
       throw new Error('Url 或者 Body 中必须包含 $title');
     }
 

src/locales/en-US.json

@@ -186,6 +186,7 @@
   "秒后重试": "Retry after seconds",
   "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。": "Open the two-factor authentication application on your device to view your authentication code and verify your identity.",
   "请选择脚本文件": "Please select a script file",
+  "当前文件不支持预览": "The current file does not support preview",
   "清空日志": "Clear Logs",
   "设置": "Settings",
   "退出": "Exit",

src/locales/zh-CN.json

@@ -186,6 +186,7 @@
   "秒后重试": "秒后重试",
   "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。": "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。",
   "请选择脚本文件": "请选择脚本文件",
+  "当前文件不支持预览": "当前文件不支持预览",
   "清空日志": "清空日志",
   "设置": "设置",
   "退出": "退出",

src/pages/script/index.tsx

@@ -46,6 +46,7 @@ import RenameModal from './renameModal';
 import { langs } from '@uiw/codemirror-extensions-langs';
 import { useHotkeys } from 'react-hotkeys-hook';
 import prettyBytes from 'pretty-bytes';
+import { canPreviewInMonaco } from '@/utils/monaco';
 const { Text } = Typography;
 
 const Script = () => {
@@ -67,6 +68,10 @@ const Script = () => {
   const [currentNode, setCurrentNode] = useState<any>();
   const [expandedKeys, setExpandedKeys] = useState<string[]>([]);
 
+  const handleIsEditing = (filename: string, value: boolean) => {
+    setIsEditing(value && canPreviewInMonaco(filename));
+  };
+
   const getScripts = (needLoading: boolean = true) => {
     needLoading && setLoading(true);
     request
@@ -128,6 +133,11 @@ const Script = () => {
       return;
     }
 
+    if (!canPreviewInMonaco(node.title)) {
+      setValue(intl.get('当前文件不支持预览'));
+      return;
+    }
+
     const newMode = getEditorMode(value);
     setMode(isPhone && newMode === 'typescript' ? 'javascript' : newMode);
     setValue(intl.get('加载中...'));
@@ -149,14 +159,14 @@ const Script = () => {
           content: <>{intl.get('当前修改未保存，确定离开吗')}</>,
           onOk() {
             onSelect(keys[0], e.node);
-            setIsEditing(false);
+            handleIsEditing(e.node.title, false);
           },
           onCancel() {
             console.log('Cancel');
           },
         });
       } else {
-        setIsEditing(false);
+        handleIsEditing(e.node.title, false);
         onSelect(keys[0], e.node);
       }
     },
@@ -196,18 +206,18 @@ const Script = () => {
     if (node.type === 'file') {
       setSelect(node.key);
       setCurrentNode(node);
-      setIsEditing(true);
+      handleIsEditing(node.title, true);
     }
   };
 
   const editFile = () => {
     setTimeout(() => {
-      setIsEditing(true);
+      handleIsEditing(currentNode.title, true);
     }, 300);
   };
 
   const cancelEdit = () => {
-    setIsEditing(false);
+    handleIsEditing(currentNode.title, false);
     setValue(intl.get('加载中...'));
     getDetail(currentNode);
   };
@@ -240,7 +250,7 @@ const Script = () => {
               if (code === 200) {
                 message.success(`保存成功`);
                 setValue(content);
-                setIsEditing(false);
+                handleIsEditing(currentNode.title, false);
               }
               resolve(null);
             })
@@ -342,7 +352,7 @@ const Script = () => {
       }
       setData(newData);
       onSelect(_file.title, _file);
-      setIsEditing(true);
+      handleIsEditing(_file.title, true);
     }
     setIsAddFileModalVisible(false);
   };
@@ -472,7 +482,9 @@ const Script = () => {
             label: intl.get('编辑'),
             key: 'edit',
             icon: <EditOutlined />,
-            disabled: !select,
+            disabled:
+              !select ||
+              (currentNode && !canPreviewInMonaco(currentNode?.title)),
           },
           {
             label: intl.get('重命名'),
@@ -554,7 +566,10 @@ const Script = () => {
               </Tooltip>,
               <Tooltip title={intl.get('编辑')}>
                 <Button
-                  disabled={!select}
+                  disabled={
+                    !select ||
+                    (currentNode && !canPreviewInMonaco(currentNode?.title))
+                  }
                   type="primary"
                   onClick={editFile}
                   icon={<EditOutlined />}

src/utils/monaco/index.ts

@@ -0,0 +1,7 @@
+import * as monaco from 'monaco-editor';
+
+export function canPreviewInMonaco(fileName: string): boolean {
+  const supportedLanguages = monaco.languages.getLanguages();
+  const ext = fileName.slice(fileName.lastIndexOf('.')).toLowerCase();
+  return supportedLanguages.some((lang) => lang.extensions?.includes(ext));
+}