chore: sync

src/view/LanguageModel/index.tsx

@@ -6,6 +6,7 @@ import useInit from '@/hooks/useInit';
 import useData from '@/hooks/useData';
 import useChatModel from '@/hooks/useChatModel';
 import useColumns from '@/hooks/useColumns';
+import { TABLE_PAGINATION } from '@/hooks/useTable';
 import { chatModelPath } from '@/utils';
 import { modelColumns } from './config';
 import LanguageModelForm from './Form';
@@ -87,14 +88,7 @@ export default function LanguageModel() {
         columns={columns}
         scroll={{ x: 'auto' }}
         dataSource={opData}
-        pagination={{
-          hideOnSinglePage: true,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          defaultPageSize: 5,
-          pageSizeOptions: [5, 10, 15, 20],
-          showTotal: (total) => <span>Total {total} items</span>,
-        }}
+        pagination={TABLE_PAGINATION}
       />
       <Modal
         open={isVisible}

src/view/SyncMore/config.tsx

@@ -0,0 +1,22 @@
+// import { Switch, Tag, Tooltip } from 'antd';
+
+export const genCmd = (act: string) => act.replace(/\s+|\/+/g, '_').replace(/[^\d\w]/g, '').toLocaleLowerCase();
+
+export const recordColumns = () => [
+  {
+    title: 'URL',
+    dataIndex: 'url',
+    // fixed: 'left',
+    // width: 120,
+    key: 'url',
+  },
+  {
+    title: 'File Type',
+    dataIndex: 'file_type',
+    key: 'file_type',
+    // width: 200,
+  },
+  {
+    title: 'Action',
+  }
+];

src/view/SyncMore/index.scss

@@ -0,0 +1,28 @@
+.chat-prompts-tags {
+  .ant-tag {
+    margin: 2px;
+  }
+}
+
+.add-btn {
+  margin-bottom: 10px;
+}
+
+.chat-model-path {
+  font-size: 12px;
+  font-weight: bold;
+  color: #888;
+  margin-bottom: 5px;
+
+  span {
+    display: inline-block;
+    // background-color: #d8d8d8;
+    color: #4096ff;
+    padding: 0 8px;
+    height: 20px;
+    line-height: 20px;
+    border-radius: 4px;
+    cursor: pointer;
+    text-decoration: underline;
+  }
+}

src/view/SyncMore/index.tsx

@@ -0,0 +1,20 @@
+import { Table, Button } from 'antd';
+
+import { TABLE_PAGINATION } from '@/hooks/useTable';
+import './index.scss';
+
+export default function SyncMore() {
+  return (
+    <div>
+      <Button className="add-btn" type="primary">Add URL</Button>
+      <Table
+        key="id"
+        rowKey="act"
+        columns={[]}
+        scroll={{ x: 'auto' }}
+        dataSource={[]}
+        pagination={TABLE_PAGINATION}
+      />
+    </div>
+  )
+}

src/view/SyncPrompts/index.scss

@@ -8,6 +8,19 @@
   margin-bottom: 5px;
 }
 
+.chat-table-tip, .chat-table-btns {
+  display: flex;
+  justify-content: space-between;
+}
+
+.chat-table-btns {
+  margin-bottom: 5px;
+
+  .num {
+    margin-left: 10px;
+  }
+}
+
 .chat-model-path {
   font-size: 12px;
   font-weight: bold;

src/view/SyncPrompts/index.tsx

@@ -7,6 +7,7 @@ import { writeTextFile } from '@tauri-apps/api/fs';
 import useColumns from '@/hooks/useColumns';
 import useData from '@/hooks/useData';
 import useChatModel from '@/hooks/useChatModel';
+import useTable, { TABLE_PAGINATION } from '@/hooks/useTable';
 import { fmtDate, chatPromptsPath, GITHUB_PROMPTS_CSV_URL } from '@/utils';
 import { modelColumns, genCmd } from './config';
 import './index.scss';
@@ -14,15 +15,19 @@ import './index.scss';
 const promptsURL = 'https://github.com/f/awesome-chatgpt-prompts/blob/main/prompts.csv';
 
 export default function LanguageModel() {
+  const { rowSelection, selectedRowIDs } = useTable();
   const [loading, setLoading] = useState(false);
   const [lastUpdated, setLastUpdated] = useState();
   const { modelJson, modelSet } = useChatModel('sys_sync_prompts');
-  const { opData, opInit, opReplace, opSafeKey } = useData([]);
+  const { opData, opInit, opReplace, opReplaceItems, opSafeKey } = useData([]);
   const { columns, ...opInfo } = useColumns(modelColumns());
 
+  const selectedItems = rowSelection.selectedRowKeys || [];
+
   useEffect(() => {
     if (!modelJson?.sys_sync_prompts) return;
     opInit(modelJson?.sys_sync_prompts);
+    if (lastUpdated) return;
     (async () => {
       const fileData: Record<string, any> = await invoke('metadata', { path: await chatPromptsPath() });
       setLastUpdated(fileData.accessedAtMs);
@@ -57,25 +62,37 @@ export default function LanguageModel() {
     }
   }, [opInfo.opTime]);
 
+  const handleEnable = (isEnable: boolean) => {
+    const data = opReplaceItems(selectedRowIDs, { enable: isEnable })
+    modelSet(data);
+  };
+
   return (
     <div>
-      <Button type="primary" loading={loading} onClick={handleSync}>Sync</Button>
-      {lastUpdated && <span style={{ marginLeft: 10, color: '#999' }}>Last updated on {fmtDate(lastUpdated)}</span>}
-      <div className="chat-model-path">URL: <a href={promptsURL} target="_blank">{promptsURL}</a></div>
+      <div className="chat-table-btns">
+        <div>
+          {selectedItems.length > 0 && (
+            <>
+              <Button type="primary" onClick={() => handleEnable(true)}>Enable</Button>
+              <Button onClick={() => handleEnable(false)}>Disable</Button>
+              <span className="num">Selected {selectedItems.length} items</span>
+            </>
+          )}
+        </div>
+        <Button type="primary" loading={loading} onClick={handleSync}>Sync</Button>
+      </div>
+      <div className="chat-table-tip">
+        <span className="chat-model-path">URL: <a href={promptsURL} target="_blank" title={promptsURL}>f/awesome-chatgpt-prompts/prompts.csv</a></span>
+        {lastUpdated && <span style={{ marginLeft: 10, color: '#999' }}>Last updated on {fmtDate(lastUpdated)}</span>}
+      </div>
       <Table
         key={lastUpdated}
         rowKey="act"
         columns={columns}
         scroll={{ x: 'auto' }}
         dataSource={opData}
-        pagination={{
-          hideOnSinglePage: true,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          defaultPageSize: 5,
-          pageSizeOptions: [5, 10, 15, 20],
-          showTotal: (total) => <span>Total {total} items</span>,
-        }}
+        rowSelection={rowSelection}
+        pagination={TABLE_PAGINATION}
       />
     </div>
   )