custom models path

frontend/src/pages/Configs.tsx

@@ -35,7 +35,6 @@ import { useNavigate } from 'react-router';
 import { RunButton } from '../components/RunButton';
 import { updateConfig } from '../apis';
 import { ConvertModel, FileExists } from '../../wailsjs/go/backend_golang/App';
-import manifest from '../../../manifest.json';
 import { getStrategy, refreshLocalModels } from '../utils';
 import { useTranslation } from 'react-i18next';
 import { WindowShow } from '../../wailsjs/runtime/runtime';
@@ -836,7 +835,7 @@ export const Configs: FC = observer(() => {
                   </div>
                 } />
                 <ToolTipButton text={t('Convert')} desc={t('Convert model with these configs')} onClick={async () => {
-                  const modelPath = `${manifest.localModelDir}/${selectedConfig.modelParameters.modelName}`;
+                  const modelPath = `${commonStore.settings.customModelsPath}/${selectedConfig.modelParameters.modelName}`;
                   if (await FileExists(modelPath)) {
                     const strategy = getStrategy(selectedConfig);
                     const newModelPath = modelPath + '-' + strategy.replace(/[:> *+]/g, '-');

frontend/src/pages/Models.tsx

@@ -18,7 +18,6 @@ import { observer } from 'mobx-react-lite';
 import commonStore from '../stores/commonStore';
 import { BrowserOpenURL } from '../../wailsjs/runtime';
 import { AddToDownloadList, OpenFileFolder } from '../../wailsjs/go/backend_golang/App';
-import manifest from '../../../manifest.json';
 import { Page } from '../components/Page';
 import { bytesToGb, refreshModels, saveConfigs, toastWithButton } from '../utils';
 import { useTranslation } from 'react-i18next';
@@ -143,7 +142,7 @@ const columns: TableColumnDefinition<ModelSourceItem>[] = [
             {
               item.isLocal &&
               <ToolTipButton desc={t('Open Folder')} icon={<Folder20Regular />} onClick={() => {
-                OpenFileFolder(`./${manifest.localModelDir}/${item.name}`);
+                OpenFileFolder(`${commonStore.settings.customModelsPath}/${item.name}`);
               }} />
             }
             {item.downloadUrl && !item.isLocal &&
@@ -152,7 +151,7 @@ const columns: TableColumnDefinition<ModelSourceItem>[] = [
                     navigate({ pathname: '/downloads' });
                   },
                   { autoClose: 3000 });
-                AddToDownloadList(`./${manifest.localModelDir}/${item.name}`, item.downloadUrl!);
+                AddToDownloadList(`${commonStore.settings.customModelsPath}/${item.name}`, item.downloadUrl!);
               }} />}
             {item.url && <ToolTipButton desc={t('Open Url')} icon={<Open20Regular />} onClick={() => {
               BrowserOpenURL(item.url!);

frontend/src/pages/Settings.tsx

@@ -1,6 +1,15 @@
-import React, { FC } from 'react';
+import React, { FC, useEffect, useRef } from 'react';
 import { Page } from '../components/Page';
-import { Dropdown, Option, Switch } from '@fluentui/react-components';
+import {
+  Accordion,
+  AccordionHeader,
+  AccordionItem,
+  AccordionPanel,
+  Dropdown,
+  Input,
+  Option,
+  Switch
+} from '@fluentui/react-components';
 import { Labeled } from '../components/Labeled';
 import commonStore from '../stores/commonStore';
 import { observer } from 'mobx-react-lite';
@@ -15,16 +24,24 @@ export const Languages = {
 export type Language = keyof typeof Languages;
 
 export type SettingsType = {
-  language: Language,
+  language: Language
   darkMode: boolean
   autoUpdatesCheck: boolean
   giteeUpdatesSource: boolean
   cnMirror: boolean
   host: string
+  customModelsPath: string
+  customPythonPath: string
 }
 
 export const Settings: FC = observer(() => {
   const { t, i18n } = useTranslation();
+  const advancedHeaderRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (advancedHeaderRef.current)
+      (advancedHeaderRef.current.firstElementChild as HTMLElement).style.padding = '0';
+  }, []);
 
   return (
     <Page title={t('Settings')} content={
@@ -96,6 +113,33 @@ export const Settings: FC = observer(() => {
               });
             }} />
         } />
+        <Accordion collapsible>
+          <AccordionItem value="1">
+            <AccordionHeader ref={advancedHeaderRef} size="large">{t('Advanced')}</AccordionHeader>
+            <AccordionPanel>
+              <div className="flex flex-col gap-2 overflow-hidden">
+                <Labeled label={t('Custom Models Path')}
+                  content={
+                    <Input className="grow" placeholder="./models" value={commonStore.settings.customModelsPath}
+                      onChange={(e, data) => {
+                        commonStore.setSettings({
+                          customModelsPath: data.value
+                        });
+                      }} />
+                  } />
+                <Labeled label={t('Custom Python Path')}
+                  content={
+                    <Input className="grow" placeholder="./py310/python" value={commonStore.settings.customPythonPath}
+                      onChange={(e, data) => {
+                        commonStore.setSettings({
+                          customPythonPath: data.value
+                        });
+                      }} />
+                  } />
+              </div>
+            </AccordionPanel>
+          </AccordionItem>
+        </Accordion>
       </div>
     } />
   );