diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx index 7982ff3..c2f4c0d 100644 --- a/apps/web/src/App.tsx +++ b/apps/web/src/App.tsx @@ -33,14 +33,6 @@ export default function App() { } /> - - - - } - /> } /> - - - - } - /> >([]); + const [branchesLoading, setBranchesLoading] = useState(false); + const [branchesError, setBranchesError] = useState(null); const [error, setError] = useState(null); const isEditMode = mode === 'edit'; + const fetchBranches = useCallback(async (repository: string, installationId: string) => { + setBranchesLoading(true); + setBranches([]); + setBranchesError(null); + + try { + const result = await listBranches(repository, installationId || undefined); + setBranches(result); + + if (result.length === 0) { + setBranches([{ name: 'main' }, { name: 'master' }]); + setBranchesError('Could not fetch branches, showing common defaults'); + } + } catch { + setBranches([{ name: 'main' }, { name: 'master' }, { name: 'develop' }]); + setBranchesError('Unable to fetch branches. Common branch names provided.'); + } finally { + setBranchesLoading(false); + } + }, []); + const handleChange = (field: keyof ProjectFormValues, value: string) => { setValues((current) => ({ ...current, [field]: value })); }; + const handleRepositoryChange = (value: string) => { + setBranches([]); + setBranchesError(null); + handleChange('repository', value); + }; + + const handleRepoSelect = useCallback( + (repo: { fullName: string; defaultBranch: string } | null) => { + if (!repo) { + setBranches([]); + setBranchesError(null); + return; + } + + setValues((current) => ({ ...current, defaultBranch: repo.defaultBranch })); + void fetchBranches(repo.fullName, values.installationId); + }, + [fetchBranches, values.installationId] + ); + + const handleInstallationChange = (installationId: string) => { + handleChange('installationId', installationId); + + if (isEditMode) { + return; + } + + const normalizedRepository = normalizeRepository(values.repository); + if (!normalizedRepository || !normalizedRepository.includes('/')) { + setBranches([]); + setBranchesError(null); + return; + } + + void fetchBranches(normalizedRepository, installationId); + }; + const handleSubmit = async (event: FormEvent) => { event.preventDefault(); setError(null); @@ -79,11 +154,21 @@ export function ProjectForm({ name: values.name.trim(), description: values.description.trim(), installationId: values.installationId, - repository: values.repository.trim(), + repository: normalizeRepository(values.repository), defaultBranch: values.defaultBranch.trim(), }); }; + const selectStyle = { + width: '100%', + borderRadius: 'var(--sam-radius-md)', + border: '1px solid var(--sam-color-border-default)', + background: 'var(--sam-color-bg-surface)', + color: 'var(--sam-color-fg-primary)', + padding: '0.625rem 0.75rem', + minHeight: '2.75rem', + }; + return (
-