From 3ffaa1ef7f130af3f2564333a7bb4cc0bfa5ed84 Mon Sep 17 00:00:00 2001 From: Faisal Amir Date: Mon, 16 Sep 2024 11:17:36 +0700 Subject: [PATCH] chore: temporary disabled starter screen (#3663) * chore: temporary disabeld starter screen * chore: create useStarter screen * chore: fix typo * chore: update config starter screen * chore: update comment code * chore: renmove some commented code --- web/hooks/useStarterScreen.ts | 78 +++++++++++++++++++++++++++++++++++ web/screens/Thread/index.tsx | 73 ++------------------------------ 2 files changed, 82 insertions(+), 69 deletions(-) create mode 100644 web/hooks/useStarterScreen.ts diff --git a/web/hooks/useStarterScreen.ts b/web/hooks/useStarterScreen.ts new file mode 100644 index 000000000..fbd6ef578 --- /dev/null +++ b/web/hooks/useStarterScreen.ts @@ -0,0 +1,78 @@ +import { useState, useEffect } from 'react' + +import { useAtomValue } from 'jotai' + +import { localEngines } from '@/utils/modelEngine' + +import { extensionManager } from '@/extension' +import { downloadedModelsAtom } from '@/helpers/atoms/Model.atom' +import { threadsAtom } from '@/helpers/atoms/Thread.atom' + +export function useStarterScreen() { + const downloadedModels = useAtomValue(downloadedModelsAtom) + const threads = useAtomValue(threadsAtom) + + const isDownloadALocalModel = downloadedModels.some((x) => + localEngines.includes(x.engine) + ) + + const [extensionHasSettings, setExtensionHasSettings] = useState< + { name?: string; setting: string; apiKey: string; provider: string }[] + >([]) + + useEffect(() => { + const getAllSettings = async () => { + const extensionsMenu: { + name?: string + setting: string + apiKey: string + provider: string + }[] = [] + const extensions = extensionManager.getAll() + + for (const extension of extensions) { + if (typeof extension.getSettings === 'function') { + const settings = await extension.getSettings() + + if ( + (settings && settings.length > 0) || + (await extension.installationState()) !== 'NotRequired' + ) { + extensionsMenu.push({ + name: extension.productName, + setting: extension.name, + apiKey: + 'apiKey' in extension && typeof extension.apiKey === 'string' + ? extension.apiKey + : '', + provider: + 'provider' in extension && + typeof extension.provider === 'string' + ? extension.provider + : '', + }) + } + } + } + setExtensionHasSettings(extensionsMenu) + } + getAllSettings() + }, []) + + const isAnyRemoteModelConfigured = extensionHasSettings.some( + (x) => x.apiKey.length > 1 + ) + + let isShowStarterScreen + + isShowStarterScreen = + !isAnyRemoteModelConfigured && !isDownloadALocalModel && !threads.length + + // Remove this part when we rework on starter screen + isShowStarterScreen = false + + return { + extensionHasSettings, + isShowStarterScreen, + } +} diff --git a/web/screens/Thread/index.tsx b/web/screens/Thread/index.tsx index 4fda61e2c..b576c905c 100644 --- a/web/screens/Thread/index.tsx +++ b/web/screens/Thread/index.tsx @@ -1,11 +1,7 @@ -import { useEffect, useState } from 'react' - -import { useAtomValue } from 'jotai' +import { useStarterScreen } from '@/hooks/useStarterScreen' import ThreadLeftPanel from '@/screens/Thread/ThreadLeftPanel' -import { localEngines } from '@/utils/modelEngine' - import ThreadCenterPanel from './ThreadCenterPanel' import OnDeviceStarterScreen from './ThreadCenterPanel/ChatBody/OnDeviceStarterScreen' import ModalCleanThread from './ThreadLeftPanel/ModalCleanThread' @@ -13,73 +9,12 @@ import ModalDeleteThread from './ThreadLeftPanel/ModalDeleteThread' import ModalEditTitleThread from './ThreadLeftPanel/ModalEditTitleThread' import ThreadRightPanel from './ThreadRightPanel' -import { extensionManager } from '@/extension' -import { downloadedModelsAtom } from '@/helpers/atoms/Model.atom' -import { threadsAtom } from '@/helpers/atoms/Thread.atom' - const ThreadScreen = () => { - const downloadedModels = useAtomValue(downloadedModelsAtom) - const threads = useAtomValue(threadsAtom) - - const isDownloadALocalModel = downloadedModels.some((x) => - localEngines.includes(x.engine) - ) - - const [extensionHasSettings, setExtensionHasSettings] = useState< - { name?: string; setting: string; apiKey: string; provider: string }[] - >([]) - - useEffect(() => { - const getAllSettings = async () => { - const extensionsMenu: { - name?: string - setting: string - apiKey: string - provider: string - }[] = [] - const extensions = extensionManager.getAll() - - for (const extension of extensions) { - if (typeof extension.getSettings === 'function') { - const settings = await extension.getSettings() - - if ( - (settings && settings.length > 0) || - (await extension.installationState()) !== 'NotRequired' - ) { - extensionsMenu.push({ - name: extension.productName, - setting: extension.name, - apiKey: - 'apiKey' in extension && typeof extension.apiKey === 'string' - ? extension.apiKey - : '', - provider: - 'provider' in extension && - typeof extension.provider === 'string' - ? extension.provider - : '', - }) - } - } - } - setExtensionHasSettings(extensionsMenu) - } - getAllSettings() - }, []) - - const isAnyRemoteModelConfigured = extensionHasSettings.some( - (x) => x.apiKey.length > 1 - ) - + const { extensionHasSettings, isShowStarterScreen } = useStarterScreen() return (
- {!isAnyRemoteModelConfigured && - !isDownloadALocalModel && - !threads.length ? ( - <> - - + {isShowStarterScreen ? ( + ) : ( <>