chore: dashboard

src/view/awesome/index.tsx

@@ -34,9 +34,7 @@ export default function Awesome() {
       updateJson(data);
       opInfo.resetRecord();
     }
-  }, [opInfo.opType,
-
-    formRef]);
+  }, [opInfo.opType, formRef]);
 
   const hide = () => {
     setVisible(false);
@@ -54,18 +52,33 @@ export default function Awesome() {
 
   const handleOk = () => {
     formRef.current?.form?.validateFields().then(async (vals: Record<string, any>) => {
-      if (opInfo.opType === 'new') {
-        const data = opAdd(vals);
-        await updateJson(data);
-        opInit(data);
-        message.success('Data added successfully');
+      const idx = opData.findIndex((i) => i.url === vals.url);
+      if (idx === -1) {
+        if (opInfo.opType === 'new') {
+          const data = opAdd(vals);
+          await updateJson(data);
+          opInit(data);
+          message.success('Data added successfully');
+        }
+        if (opInfo.opType === 'edit') {
+          const data = opReplace(opInfo?.opRecord?.[opSafeKey], vals);
+          await updateJson(data);
+          message.success('Data updated successfully');
+        }
+        hide();
+      } else {
+        const data = opData[idx];
+        message.error(
+          <div style={{ width: 360 }}>
+            <div>
+              <b>
+                {data.title}: {data.url}
+              </b>
+            </div>
+            <div>This URL already exists, please edit it and try again.</div>
+          </div>,
+        );
       }
-      if (opInfo.opType === 'edit') {
-        const data = opReplace(opInfo?.opRecord?.[opSafeKey], vals);
-        await updateJson(data);
-        message.success('Data updated successfully');
-      }
-      hide();
     });
   };
 

src/view/dashboard/index.scss

@@ -5,6 +5,30 @@
   overflow-y: auto;
   padding: 15px;
 
+  &-no-data {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    flex-direction: column;
+    font-weight: bold;
+
+    .icon {
+      color: #989898;
+      font-size: 24px;
+    }
+
+    .txt {
+      font-size: 12px;
+
+      a {
+        color: #1677ff;
+        cursor: pointer;
+      }
+    }
+  }
+
   &.dark {
     background-color: #000;
   }

src/view/dashboard/index.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import clsx from 'clsx';
 import { Row, Col, Card } from 'antd';
+import { InboxOutlined } from '@ant-design/icons';
 import { os, invoke } from '@tauri-apps/api';
 
 import useInit from '@/hooks/useInit';
@@ -10,7 +11,7 @@ import './index.scss';
 
 export default function Dashboard() {
   const { json } = useJson<Record<string, any>[]>(CHAT_AWESOME_JSON);
-  const [list, setList] = useState<Array<[string, Record<string, any>[]]>>([]);
+  const [list, setList] = useState<Array<[string, Record<string, any>[]]>>();
   const [hasClass, setClass] = useState(false);
   const [theme, setTheme] = useState('');
 
@@ -23,6 +24,7 @@ export default function Dashboard() {
   });
 
   useEffect(() => {
+    if (!json) return;
     const categories = new Map();
 
     json?.forEach((i) => {
@@ -43,6 +45,23 @@ export default function Dashboard() {
     });
   };
 
+  if (!list) return null;
+  if (list?.length === 0) {
+    return (
+      <div className="dashboard-no-data">
+        <div className="icon">
+          <InboxOutlined style={{ fontSize: 80, marginBottom: 5 }} />
+          <br />
+          No data
+        </div>
+        <div className="txt">
+          Go to <a onClick={() => invoke('control_window')}>{'Control Center -> Awesome'}</a> to add
+          data
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className={clsx('dashboard', theme, { 'has-top-dom': hasClass })}>
       <div>

src/view/settings/General.tsx

@@ -6,6 +6,49 @@ import { platform } from '@tauri-apps/api/os';
 import useInit from '@/hooks/useInit';
 import { DISABLE_AUTO_COMPLETE } from '@/utils';
 
+export default function General() {
+  const [platformInfo, setPlatform] = useState('');
+
+  useInit(async () => {
+    setPlatform(await platform());
+  });
+
+  return (
+    <>
+      <Form.Item label="Stay On Top" name="stay_on_top" valuePropName="checked">
+        <Switch />
+      </Form.Item>
+      {platformInfo === 'darwin' && (
+        <Form.Item label="Titlebar" name="titlebar" valuePropName="checked">
+          <Switch />
+        </Form.Item>
+      )}
+      {platformInfo === 'darwin' && (
+        <Form.Item label="Hide Dock Icon" name="hide_dock_icon" valuePropName="checked">
+          <Switch />
+        </Form.Item>
+      )}
+      <Form.Item label="Theme" name="theme">
+        <Radio.Group>
+          <Radio value="Light">Light</Radio>
+          <Radio value="Dark">Dark</Radio>
+          {['darwin', 'windows'].includes(platformInfo) && <Radio value="System">System</Radio>}
+        </Radio.Group>
+      </Form.Item>
+      <Form.Item label={<AutoUpdateLabel />} name="auto_update">
+        <Radio.Group>
+          <Radio value="Prompt">Prompt</Radio>
+          <Radio value="Silent">Silent</Radio>
+          {/*<Radio value="Disable">Disable</Radio>*/}
+        </Radio.Group>
+      </Form.Item>
+      <Form.Item label={<GlobalShortcutLabel />} name="global_shortcut">
+        <Input placeholder="CmdOrCtrl+Shift+O" {...DISABLE_AUTO_COMPLETE} />
+      </Form.Item>
+    </>
+  );
+}
+
 const AutoUpdateLabel = () => {
   return (
     <span>
@@ -50,49 +93,3 @@ const GlobalShortcutLabel = () => {
     </div>
   );
 };
-
-export default function General() {
-  const [platformInfo, setPlatform] = useState('');
-
-  useInit(async () => {
-    setPlatform(await platform());
-  });
-
-  return (
-    <>
-      <Form.Item label="Dashboard" name="dashboard" valuePropName="checked">
-        <Switch />
-      </Form.Item>
-      <Form.Item label="Stay On Top" name="stay_on_top" valuePropName="checked">
-        <Switch />
-      </Form.Item>
-      {platformInfo === 'darwin' && (
-        <Form.Item label="Titlebar" name="titlebar" valuePropName="checked">
-          <Switch />
-        </Form.Item>
-      )}
-      {platformInfo === 'darwin' && (
-        <Form.Item label="Hide Dock Icon" name="hide_dock_icon" valuePropName="checked">
-          <Switch />
-        </Form.Item>
-      )}
-      <Form.Item label="Theme" name="theme">
-        <Radio.Group>
-          <Radio value="Light">Light</Radio>
-          <Radio value="Dark">Dark</Radio>
-          {['darwin', 'windows'].includes(platformInfo) && <Radio value="System">System</Radio>}
-        </Radio.Group>
-      </Form.Item>
-      <Form.Item label={<AutoUpdateLabel />} name="auto_update">
-        <Radio.Group>
-          <Radio value="Prompt">Prompt</Radio>
-          <Radio value="Silent">Silent</Radio>
-          {/*<Radio value="Disable">Disable</Radio>*/}
-        </Radio.Group>
-      </Form.Item>
-      <Form.Item label={<GlobalShortcutLabel />} name="global_shortcut">
-        <Input placeholder="CmdOrCtrl+Shift+O" {...DISABLE_AUTO_COMPLETE} />
-      </Form.Item>
-    </>
-  );
-}

src/view/settings/MainWindow.tsx

@@ -36,7 +36,7 @@ export default function General() {
       <Form.Item label={<PopupSearchLabel />} name="popup_search" valuePropName="checked">
         <Switch />
       </Form.Item>
-      <SwitchOrigin name="origin" />
+      <SwitchOrigin name="main" />
       <Form.Item label="User Agent (Main)" name="ua_window">
         <Input.TextArea
           autoSize={{ minRows: 4, maxRows: 4 }}

src/view/settings/TrayWindow.tsx

@@ -23,7 +23,7 @@ export default function General() {
       <Form.Item label="Enable SystemTray" name="tray" valuePropName="checked">
         <Switch />
       </Form.Item>
-      <SwitchOrigin name="tray_origin" />
+      <SwitchOrigin name="tray" />
       <Form.Item label={<UALabel />} name="ua_tray">
         <Input.TextArea
           autoSize={{ minRows: 4, maxRows: 4 }}