feat(ui): tabbed git provider settings with search auto-reveal
This commit is contained in:
@@ -29,6 +29,8 @@ import { cn } from '@/lib/utils';
|
||||
import { useI18n } from '@/lib/i18n';
|
||||
import { SettingsPageLayout } from '@/components/sections/shared/SettingsPageLayout';
|
||||
import { SettingsSection } from '@/components/sections/shared/SettingsSection';
|
||||
import { SortableTabsStrip, type SortableTabsStripItem } from '@/components/ui/sortable-tabs-strip';
|
||||
import { providerTabForSettingsItem, type GitProviderTabId } from './providerTabs';
|
||||
|
||||
const ICON_MAP: Record<string, IconName> = {
|
||||
branch: 'git-branch',
|
||||
@@ -47,7 +49,11 @@ const COLOR_MAP: Record<string, string> = {
|
||||
type: 'var(--syntax-type)',
|
||||
};
|
||||
|
||||
export const GitPage: React.FC = () => {
|
||||
export interface GitPageProps {
|
||||
revealItemId?: string | null;
|
||||
}
|
||||
|
||||
export const GitPage: React.FC<GitPageProps> = (props) => {
|
||||
const { t } = useI18n();
|
||||
const {
|
||||
profiles,
|
||||
@@ -79,6 +85,44 @@ export const GitPage: React.FC = () => {
|
||||
const [deleteDialogProfile, setDeleteDialogProfile] = React.useState<GitIdentityProfile | null>(null);
|
||||
const [isDeletePending, setIsDeletePending] = React.useState(false);
|
||||
|
||||
const [activeProviderTab, setActiveProviderTab] = React.useState<GitProviderTabId>('github');
|
||||
|
||||
const providerTabs = React.useMemo<SortableTabsStripItem[]>(() => [
|
||||
{
|
||||
id: 'github',
|
||||
label: t('settings.git.tabs.github'),
|
||||
icon: <Icon name="github-fill" className="h-3.5 w-3.5" />,
|
||||
},
|
||||
{
|
||||
id: 'gitlab',
|
||||
label: t('settings.git.tabs.gitlab'),
|
||||
icon: <Icon name="gitlab" className="h-3.5 w-3.5" />,
|
||||
},
|
||||
{
|
||||
id: 'gitea',
|
||||
label: t('settings.git.tabs.gitea'),
|
||||
icon: <Icon name="gitea" className="h-3.5 w-3.5" />,
|
||||
},
|
||||
], [t]);
|
||||
|
||||
const revealItemId = props.revealItemId;
|
||||
const lastHandledRevealRef = React.useRef<string | null>(null);
|
||||
|
||||
React.useLayoutEffect(() => {
|
||||
if (revealItemId == null) {
|
||||
lastHandledRevealRef.current = null;
|
||||
return;
|
||||
}
|
||||
if (lastHandledRevealRef.current === revealItemId) {
|
||||
return;
|
||||
}
|
||||
lastHandledRevealRef.current = revealItemId;
|
||||
const tab = providerTabForSettingsItem(revealItemId);
|
||||
if (tab) {
|
||||
setActiveProviderTab(tab);
|
||||
}
|
||||
}, [revealItemId]);
|
||||
|
||||
React.useEffect(() => {
|
||||
loadProfiles();
|
||||
loadGlobalIdentity();
|
||||
@@ -123,9 +167,26 @@ export const GitPage: React.FC = () => {
|
||||
title={t('settings.page.git.title')}
|
||||
showSaveStatus
|
||||
>
|
||||
<GitHubSettings />
|
||||
<GitLabSettings />
|
||||
<GiteaSettings />
|
||||
<div className="flex h-8 min-w-0">
|
||||
<SortableTabsStrip
|
||||
items={providerTabs}
|
||||
activeId={activeProviderTab}
|
||||
onSelect={(tabId) => setActiveProviderTab(tabId as GitProviderTabId)}
|
||||
layoutMode="fit"
|
||||
variant="active-pill"
|
||||
activePillButtonClassName="h-7"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" aria-label={t('settings.git.tabs.github')} hidden={activeProviderTab !== 'github'}>
|
||||
<GitHubSettings />
|
||||
</div>
|
||||
<div role="tabpanel" aria-label={t('settings.git.tabs.gitlab')} hidden={activeProviderTab !== 'gitlab'}>
|
||||
<GitLabSettings />
|
||||
</div>
|
||||
<div role="tabpanel" aria-label={t('settings.git.tabs.gitea')} hidden={activeProviderTab !== 'gitea'}>
|
||||
<GiteaSettings />
|
||||
</div>
|
||||
|
||||
<SettingsSection
|
||||
title={t('settings.gitIdentities.page.section.title')}
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
import { describe, expect, test } from 'bun:test';
|
||||
|
||||
import { providerTabForSettingsItem } from './providerTabs';
|
||||
|
||||
describe('providerTabForSettingsItem', () => {
|
||||
test('maps GitHub settings ids to the github tab', () => {
|
||||
expect(providerTabForSettingsItem('git.github-account')).toBe('github');
|
||||
expect(providerTabForSettingsItem('git.github-api-base-url')).toBe('github');
|
||||
expect(providerTabForSettingsItem('git.github-detect-urls')).toBe('github');
|
||||
});
|
||||
|
||||
test('maps GitLab settings ids to the gitlab tab', () => {
|
||||
expect(providerTabForSettingsItem('git.gitlab-account')).toBe('gitlab');
|
||||
expect(providerTabForSettingsItem('git.gitlab-api-base-url')).toBe('gitlab');
|
||||
expect(providerTabForSettingsItem('git.gitlab-detect-urls')).toBe('gitlab');
|
||||
});
|
||||
|
||||
test('maps Gitea settings ids to the gitea tab', () => {
|
||||
expect(providerTabForSettingsItem('git.gitea-account')).toBe('gitea');
|
||||
expect(providerTabForSettingsItem('git.gitea-api-base-url')).toBe('gitea');
|
||||
expect(providerTabForSettingsItem('git.gitea-detect-urls')).toBe('gitea');
|
||||
});
|
||||
|
||||
test('returns null for settings ids below the tabs', () => {
|
||||
expect(providerTabForSettingsItem('git.identities')).toBeNull();
|
||||
expect(providerTabForSettingsItem('git.gitmoji')).toBeNull();
|
||||
expect(providerTabForSettingsItem('git.changes-view')).toBeNull();
|
||||
expect(providerTabForSettingsItem('git.gitignored-files')).toBeNull();
|
||||
});
|
||||
|
||||
test('returns null for empty or missing ids', () => {
|
||||
expect(providerTabForSettingsItem(null)).toBeNull();
|
||||
expect(providerTabForSettingsItem(undefined)).toBeNull();
|
||||
expect(providerTabForSettingsItem('')).toBeNull();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,9 @@
|
||||
export type GitProviderTabId = 'github' | 'gitlab' | 'gitea';
|
||||
|
||||
export const providerTabForSettingsItem = (settingsItemId: string | null | undefined): GitProviderTabId | null => {
|
||||
if (!settingsItemId) return null;
|
||||
if (settingsItemId.startsWith('git.github-')) return 'github';
|
||||
if (settingsItemId.startsWith('git.gitlab-')) return 'gitlab';
|
||||
if (settingsItemId.startsWith('git.gitea-')) return 'gitea';
|
||||
return null;
|
||||
};
|
||||
@@ -667,7 +667,7 @@ export const SettingsView: React.FC<SettingsViewProps> = ({ onClose, forceMobile
|
||||
case 'snippets':
|
||||
return <SnippetsPage />;
|
||||
case 'git':
|
||||
return <GitPage />;
|
||||
return <GitPage revealItemId={pendingSearchItemId} />;
|
||||
case 'integrations':
|
||||
return (
|
||||
<IntegrationsPage
|
||||
@@ -690,7 +690,7 @@ export const SettingsView: React.FC<SettingsViewProps> = ({ onClose, forceMobile
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
}, [openChamberSectionBySlug, openPage, openThirdPartyProviderSetup, renderUnavailable, runtimeCtx, t]);
|
||||
}, [openChamberSectionBySlug, openPage, openThirdPartyProviderSetup, pendingSearchItemId, renderUnavailable, runtimeCtx, t]);
|
||||
|
||||
// Mobile: if opened via deep-link / palette to a non-home page, jump into it once.
|
||||
React.useEffect(() => {
|
||||
|
||||
@@ -619,6 +619,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': 'Agent auswählen',
|
||||
'settings.commands.agentSelector.notSelected': 'Nicht ausgewählt',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': 'Agent auswählen...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'Identitäten',
|
||||
'settings.gitIdentities.page.empty.title': 'Keine Identitäten konfiguriert',
|
||||
'settings.gitIdentities.page.empty.description': 'Erstellen Sie eine, um Git-Autoreneinstellungen pro Projekt zu verwalten',
|
||||
|
||||
@@ -671,6 +671,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': 'Select agent',
|
||||
'settings.commands.agentSelector.notSelected': 'Not selected',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': 'Select agent...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'Identities',
|
||||
'settings.gitIdentities.page.empty.title': 'No identities configured',
|
||||
'settings.gitIdentities.page.empty.description': 'Create one to manage Git author settings per project',
|
||||
|
||||
@@ -639,6 +639,9 @@ export const settingsDict = {
|
||||
"settings.commands.agentSelector.title": "Seleccionar agente",
|
||||
"settings.commands.agentSelector.notSelected": "No seleccionado",
|
||||
"settings.commands.agentSelector.selectAgentPlaceholder": "Seleccionar agente...",
|
||||
"settings.git.tabs.gitea": "Gitea",
|
||||
"settings.git.tabs.github": "GitHub",
|
||||
"settings.git.tabs.gitlab": "GitLab",
|
||||
"settings.gitIdentities.page.section.title": "Identidades",
|
||||
"settings.gitIdentities.page.empty.title": "No hay identidades configuradas",
|
||||
"settings.gitIdentities.page.empty.description": "Crea una para gestionar la configuración del autor de Git por proyecto",
|
||||
|
||||
@@ -557,6 +557,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': 'Sélectionnez un agent',
|
||||
'settings.commands.agentSelector.notSelected': 'Non sélectionné',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': 'Sélectionnez un agent...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'Identités',
|
||||
'settings.gitIdentities.page.empty.title': 'Aucune identité configurée',
|
||||
'settings.gitIdentities.page.empty.description': 'Créez-en un pour gérer les paramètres d\'auteur Git par projet',
|
||||
|
||||
@@ -672,6 +672,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': 'Agent を選択',
|
||||
'settings.commands.agentSelector.notSelected': '選択されていません',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': 'Agent を選択...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'ID',
|
||||
'settings.gitIdentities.page.empty.title': 'Identity が設定されていません',
|
||||
'settings.gitIdentities.page.empty.description': 'プロジェクトごとの Git 作成者設定を管理するために作成してください',
|
||||
|
||||
@@ -639,6 +639,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': '에이전트 선택',
|
||||
'settings.commands.agentSelector.notSelected': '선택 안 됨',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': '에이전트 선택...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'Git 자격 증명',
|
||||
'settings.gitIdentities.page.empty.title': '설정된 Git 자격 증명이 없습니다',
|
||||
'settings.gitIdentities.page.empty.description': '프로젝트별 Git author를 관리하려면 하나를 생성하세요',
|
||||
|
||||
@@ -285,6 +285,9 @@ export const settingsDict = {
|
||||
'settings.gitIdentities.page.discoveredCredentials.title': 'Znaleziono w ~/.git-credentials',
|
||||
'settings.gitIdentities.page.empty.description': 'Utwórz profil, aby zarządzać ustawieniami autora Git dla każdego projektu',
|
||||
'settings.gitIdentities.page.empty.title': 'Brak skonfigurowanych tożsamości',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': 'Tożsamości',
|
||||
'settings.gitIdentities.page.toast.defaultUnset': 'Domyślna tożsamość została usunięta',
|
||||
'settings.gitIdentities.page.toast.defaultUpdated': 'Domyślna tożsamość została zaktualizowana',
|
||||
|
||||
@@ -639,6 +639,9 @@ export const settingsDict = {
|
||||
"settings.commands.agentSelector.title": "Selecionar agente",
|
||||
"settings.commands.agentSelector.notSelected": "Não selecionado",
|
||||
"settings.commands.agentSelector.selectAgentPlaceholder": "Selecionar agente...",
|
||||
"settings.git.tabs.gitea": "Gitea",
|
||||
"settings.git.tabs.github": "GitHub",
|
||||
"settings.git.tabs.gitlab": "GitLab",
|
||||
"settings.gitIdentities.page.section.title": "Identidades",
|
||||
"settings.gitIdentities.page.empty.title": "Não há identidades configuradas",
|
||||
"settings.gitIdentities.page.empty.description": "Crie uma para gerenciar as configurações de autor Git por projeto",
|
||||
|
||||
@@ -639,6 +639,9 @@ export const settingsDict = {
|
||||
"settings.commands.agentSelector.title": "Виберіть агента",
|
||||
"settings.commands.agentSelector.notSelected": "Не вибрано",
|
||||
"settings.commands.agentSelector.selectAgentPlaceholder": "Виберіть агента...",
|
||||
"settings.git.tabs.gitea": "Gitea",
|
||||
"settings.git.tabs.github": "GitHub",
|
||||
"settings.git.tabs.gitlab": "GitLab",
|
||||
"settings.gitIdentities.page.section.title": "Ідентичності",
|
||||
"settings.gitIdentities.page.empty.title": "Ідентичності не налаштовано",
|
||||
"settings.gitIdentities.page.empty.description": "Створіть профіль, щоб керувати автором Git для кожного проєкту",
|
||||
|
||||
@@ -639,6 +639,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': '选择智能体',
|
||||
'settings.commands.agentSelector.notSelected': '未选择',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': '选择智能体...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': '身份',
|
||||
'settings.gitIdentities.page.empty.title': '未配置身份',
|
||||
'settings.gitIdentities.page.empty.description': '创建一个以按项目管理 Git 作者设置',
|
||||
|
||||
@@ -636,6 +636,9 @@ export const settingsDict = {
|
||||
'settings.commands.agentSelector.title': '選擇 agent',
|
||||
'settings.commands.agentSelector.notSelected': '未選擇',
|
||||
'settings.commands.agentSelector.selectAgentPlaceholder': '選擇 agent...',
|
||||
'settings.git.tabs.gitea': 'Gitea',
|
||||
'settings.git.tabs.github': 'GitHub',
|
||||
'settings.git.tabs.gitlab': 'GitLab',
|
||||
'settings.gitIdentities.page.section.title': '身分',
|
||||
'settings.gitIdentities.page.empty.title': '未設定身分',
|
||||
'settings.gitIdentities.page.empty.description': '建立一個以按專案管理 Git 作者設定',
|
||||
|
||||
Reference in New Issue
Block a user