Skip to content

improvement(ux): polish knowledge connector modal controls#4730

Merged
waleedlatif1 merged 1 commit into
stagingfrom
codex/kb-add-modal-density
May 23, 2026
Merged

improvement(ux): polish knowledge connector modal controls#4730
waleedlatif1 merged 1 commit into
stagingfrom
codex/kb-add-modal-density

Conversation

@waleedlatif1
Copy link
Copy Markdown
Collaborator

Summary

  • align connector modal combobox/input sizing with workflow sub-block controls
  • restore the subtler metadata tag treatment
  • use direct connector icons in the source picker, matching platform/sub-block list precedent

Tests

  • cd apps/sim && bun run lint:check
  • cd apps/sim && bun run type-check

@vercel
Copy link
Copy Markdown

vercel Bot commented May 23, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped May 23, 2026 12:40am

Request Review

@cursor
Copy link
Copy Markdown

cursor Bot commented May 23, 2026

PR Summary

Low Risk
Low risk UI-only changes to connector add/edit modals and selector fields; no backend logic or data handling is modified.

Overview
Polishes the knowledge connector add/edit flows to better match the rest of the app’s control sizing and visual hierarchy.

The add-connector modal adjusts layout/scroll sizing between type selection vs configuration, updates the source picker cards to use the standard Button styling with direct connector icons, and tweaks search/empty-state typography.

Connector configuration controls drop explicit Combobox sizing, simplify account placeholders, make required-field asterisks neutral, and restyle the metadata tag list to a subtler checkbox-row treatment (including field type display).

Reviewed by Cursor Bugbot for commit 2cb0571. Configure here.

@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps Bot commented May 23, 2026

Greptile Summary

This PR polishes the knowledge connector modal UI to align sizing, spacing, and icon treatment with workflow sub-block controls. All functional connector flows remain intact.

  • Combobox sizing: size='sm' removed from all Combobox instances across add-connector-modal, edit-connector-modal, and connector-selector-field, letting them inherit the default size used by sub-block controls.
  • Source picker: ConnectorTypeCard migrated from a raw <button> with a boxed icon wrapper to a <Button variant='ghost'> with a direct inline icon, matching platform list precedents; modal height becomes content-driven on the select-type step (max-h-[520px]).
  • Metadata tags: outer container box removed and per-row hover background dropped for the "subtler" treatment described in the PR; the min-w-0 flex-1 truncate truncation guard is preserved on display names (fix from the previous review cycle).

Confidence Score: 5/5

All changes are scoped to visual styling and component variant choices; no data flow, state logic, or API paths are modified.

The diff touches only className strings, a size prop removal, and a button-to-Button swap. All connector creation and editing logic is untouched, lint and type-check pass per the test plan, and the previously flagged truncation regression has been resolved.

No files require special attention.

Important Files Changed

Filename Overview
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/add-connector-modal/add-connector-modal.tsx Visual polish: conditional modal height per step, search box alignment, tag list flattened (container wrapper removed, hover state intentionally dropped for subtler feel), required-asterisk color removed, ConnectorTypeCard migrated from raw button to Button component with direct icon rendering, Combobox size='sm' removed throughout configure step.
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connector-selector-field/connector-selector-field.tsx Removes size='sm' from both Combobox usages to match default sub-block sizing; updates loading skeleton text from text-caption to font-medium text-sm to align with combobox default text weight.
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/edit-connector-modal/edit-connector-modal.tsx Mirrors add-connector-modal changes: removes text-[var(--text-error)] from required-field asterisk and drops size='sm' from the dropdown Combobox.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[AddConnectorModal opens] --> B{step}
    B -->|select-type| C[max-h-520px modal\npt-2 pb-3 body]
    B -->|configure| D[h-80vh max-h-560px modal\npb-3 body]

    C --> E[Search bar h-8 rounded-md]
    E --> F[ConnectorTypeCard list\nmax-h-390px scrollable]
    F --> G{filteredEntries?}
    G -->|empty| H[Empty state text-caption]
    G -->|results| I[Button variant=ghost\n+ direct Icon + name + description]
    I --> J[onClick: setStep configure]

    D --> K[Account Combobox\nno size=sm\nplaceholder: Select X account]
    D --> L[Dynamic fields loop]
    L --> M{field.type}
    M -->|text/number| N[Input]
    M -->|dropdown| O[Combobox\nno size=sm]
    M -->|selector| P[ConnectorSelectorField\nno size=sm]
    D --> Q{tagDefinitions?}
    Q -->|yes| R[Flat checkbox rows\nno hover bg\nno outer container]
    D --> S[Sync Frequency ButtonGroup]
    D --> T[ModalFooter - Create connector]
Loading

Reviews (2): Last reviewed commit: "polish(kb-connectors): align connector m..." | Re-trigger Greptile

@waleedlatif1 waleedlatif1 force-pushed the codex/kb-add-modal-density branch from f7a018a to a109088 Compare May 23, 2026 00:38
@waleedlatif1 waleedlatif1 force-pushed the codex/kb-add-modal-density branch from a109088 to 2cb0571 Compare May 23, 2026 00:40
@waleedlatif1 waleedlatif1 changed the title Polish knowledge connector modal controls improvement(ux): polish knowledge connector modal controls May 23, 2026
@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@greptile

@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@cursor review

Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 2cb0571. Configure here.

@waleedlatif1 waleedlatif1 merged commit a14d374 into staging May 23, 2026
14 checks passed
@waleedlatif1 waleedlatif1 deleted the codex/kb-add-modal-density branch May 23, 2026 00:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant