refactor(react): restructure sources list and sources-add container#191
Open
mrzmyr wants to merge 5 commits intoRhysSullivan:mainfrom
Open
refactor(react): restructure sources list and sources-add container#191mrzmyr wants to merge 5 commits intoRhysSullivan:mainfrom
mrzmyr wants to merge 5 commits intoRhysSullivan:mainfrom
Conversation
Introduces four shared UI primitives that the upcoming source-form refactor relies on, keeping the refactor PR focused on wiring rather than new atoms: - <FilterTabs> — compact tab selector used by the shared auth section. - <FloatActions> — sticky bottom action bar for save/cancel on long forms (Claude / ElevenLabs-style editing UX). - <IOSSpinner> — iOS-style blade spinner for subtle inline loading states, paired with a new keyframe in globals.css. - <Textarea> — adds an optional maxRows prop so source-form preview/error panels can cap their height without bespoke wrappers. No consumers updated in this PR; follow-up PRs adopt them.
Introduces a shared auth block that every source plugin's Add/Edit form can reuse instead of rolling its own None / Bearer / Header / Basic UI. The section handles field-level validation via <FieldLabel> / <FieldError> and exposes a <FilterTabs>-based picker for the auth method. Also refreshes secret-header-auth.tsx to render errors inline on the field through <FieldGroup> / <FieldLabel> / <FieldError>, matching the new primitive's error style. No plugin consumers updated in this PR; follow-up PRs adopt it.
Replaces the hand-rolled auth/URL/headers UI with <AuthenticationSection>, wraps the save/cancel row in <FloatActions>, and uses <IOSSpinner> + <Textarea maxRows> for probe status and previews. The biggest single form in the source-form suite — isolated here so reviewers can focus on it without context-switching between plugins.
…epassword forms Adopts <AuthenticationSection> + <FloatActions> + <IOSSpinner> + <Textarea maxRows> across the remaining source-form surfaces: - openapi: Add/Edit forms pick up the shared auth block; sdk/preview exposes a new PreviewOperation class and sdk/index re-exports it so the Add form can render search + an opacity-50 operation list. - graphql: Add/Edit forms adopt the shared primitives. - google-discovery: Add form rewritten to match the standard shape; the API probe (api/group, sdk/plugin) now also returns a list of operations (path + method + description) so the form can display them inline. - onepassword: settings form picks up the shared <Field> components for consistency with the other plugin forms.
- pages/sources.tsx: restructures the list to use CardStack entries with title cards, moves connected sources to the top, and drops the old built-in section header (built-ins live exclusively in the sidebar now). - pages/sources-add.tsx: wraps the add-source container in a relative positioning wrapper so FloatActions can render as a sticky bottom bar inside the form without escaping the layout.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
5 of 5 — source-forms refactor split from #169. Stacks on #190.
pages/sources.tsx: restructures the list to use<CardStack>entries with title cards, moves connected sources to the top, and drops the old built-in section header (built-ins live exclusively in the sidebar now).pages/sources-add.tsx: wraps the add-source container in a relative positioning wrapper so<FloatActions>can render as a sticky bottom bar inside the form without escaping the layout.Stack
feat(react): add UI primitives for source formsfeat(react): add <AuthenticationSection> primitiverefactor(mcp): adopt shared primitives in Add/Edit source formsrefactor(sources): standardize openapi, graphql, google-discovery, onepassword formsrefactor(react): restructure sources list and sources-add container