Refactor Settings, FileTree, GitPanel, Shell, and CodeEditor components (#402)

2026-04-13 00:51:30 +00:00 · 2026-02-25 19:07:07 +03:00
parent 23801e9cc1
commit 5e3a7b69d7
149 changed files with 11627 additions and 8453 deletions
--- a/src/components/settings/view/tabs/api-settings/CredentialsSettingsTab.tsx
+++ b/src/components/settings/view/tabs/api-settings/CredentialsSettingsTab.tsx
@@ -0,0 +1,100 @@
+import { useTranslation } from 'react-i18next';
+import { useVersionCheck } from '../../../../../hooks/useVersionCheck';
+import { useCredentialsSettings } from '../../../hooks/useCredentialsSettings';
+import ApiKeysSection from './sections/ApiKeysSection';
+import GithubCredentialsSection from './sections/GithubCredentialsSection';
+import NewApiKeyAlert from './sections/NewApiKeyAlert';
+import VersionInfoSection from './sections/VersionInfoSection';
+
+export default function CredentialsSettingsTab() {
+  const { t } = useTranslation('settings');
+  const { updateAvailable, latestVersion, currentVersion, releaseInfo } = useVersionCheck('siteboon', 'claudecodeui');
+  const {
+    apiKeys,
+    githubCredentials,
+    loading,
+    showNewKeyForm,
+    setShowNewKeyForm,
+    newKeyName,
+    setNewKeyName,
+    showNewGithubForm,
+    setShowNewGithubForm,
+    newGithubName,
+    setNewGithubName,
+    newGithubToken,
+    setNewGithubToken,
+    newGithubDescription,
+    setNewGithubDescription,
+    showToken,
+    copiedKey,
+    newlyCreatedKey,
+    createApiKey,
+    deleteApiKey,
+    toggleApiKey,
+    createGithubCredential,
+    deleteGithubCredential,
+    toggleGithubCredential,
+    copyToClipboard,
+    dismissNewlyCreatedKey,
+    cancelNewApiKeyForm,
+    cancelNewGithubForm,
+    toggleNewGithubTokenVisibility,
+  } = useCredentialsSettings({
+    confirmDeleteApiKeyText: t('apiKeys.confirmDelete'),
+    confirmDeleteGithubCredentialText: t('apiKeys.github.confirmDelete'),
+  });
+
+  if (loading) {
+    return <div className="text-muted-foreground">{t('apiKeys.loading')}</div>;
+  }
+
+  return (
+    <div className="space-y-8">
+      {newlyCreatedKey && (
+        <NewApiKeyAlert
+          apiKey={newlyCreatedKey}
+          copiedKey={copiedKey}
+          onCopy={copyToClipboard}
+          onDismiss={dismissNewlyCreatedKey}
+        />
+      )}
+
+      <ApiKeysSection
+        apiKeys={apiKeys}
+        showNewKeyForm={showNewKeyForm}
+        newKeyName={newKeyName}
+        onShowNewKeyFormChange={setShowNewKeyForm}
+        onNewKeyNameChange={setNewKeyName}
+        onCreateApiKey={createApiKey}
+        onCancelCreateApiKey={cancelNewApiKeyForm}
+        onToggleApiKey={toggleApiKey}
+        onDeleteApiKey={deleteApiKey}
+      />
+
+      <GithubCredentialsSection
+        githubCredentials={githubCredentials}
+        showNewGithubForm={showNewGithubForm}
+        showNewTokenPlainText={Boolean(showToken.new)}
+        newGithubName={newGithubName}
+        newGithubToken={newGithubToken}
+        newGithubDescription={newGithubDescription}
+        onShowNewGithubFormChange={setShowNewGithubForm}
+        onNewGithubNameChange={setNewGithubName}
+        onNewGithubTokenChange={setNewGithubToken}
+        onNewGithubDescriptionChange={setNewGithubDescription}
+        onToggleNewTokenVisibility={toggleNewGithubTokenVisibility}
+        onCreateGithubCredential={createGithubCredential}
+        onCancelCreateGithubCredential={cancelNewGithubForm}
+        onToggleGithubCredential={toggleGithubCredential}
+        onDeleteGithubCredential={deleteGithubCredential}
+      />
+
+      <VersionInfoSection
+        currentVersion={currentVersion}
+        updateAvailable={updateAvailable}
+        latestVersion={latestVersion}
+        releaseInfo={releaseInfo}
+      />
+    </div>
+  );
+}