Skip to content

Conversation

@waleedlatif1
Copy link
Collaborator

Summary

  • settings components and behavior consolidation, small behavioral and UI inconsistencies on some pages

Type of Change

  • New feature

Testing

Tested manually

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

@vercel
Copy link

vercel bot commented Nov 22, 2025

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

1 Skipped Deployment
Project Deployment Preview Comments Updated (UTC)
docs Skipped Skipped Nov 22, 2025 3:41am

@greptile-apps
Copy link
Contributor

greptile-apps bot commented Nov 22, 2025

Greptile Overview

Greptile Summary

This PR consolidates settings components across the modal interface to address UI and behavioral inconsistencies throughout the application. The changes establish consistent error handling patterns by standardizing error message styling (moving to 11px font size with hardcoded hex colors), replacing Alert components with simpler paragraph-based error displays, and ensuring semantic HTML usage. The consolidation includes improvements to team management functionality with new error handling props, refactored workspace selection interfaces using Popovers instead of collapsible sections, and enhanced member invitation workflows. A new useAdminWorkspaces hook is introduced to support multi-workspace admin operations, allowing users to manage permissions across workspaces they administrate. API error handling is improved with more specific error messages for single vs batch email invitations. These changes create a unified visual and behavioral experience across all settings modal components while maintaining existing functionality.

Important Files Changed

Filename Score Overview
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/api-keys/api-keys.tsx 5/5 Changed error message from div to semantic p element with 11px font size for consistency
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/no-organization-view/no-organization-view.tsx 4/5 Replaced Alert component with paragraph error display for visual consistency
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/creator-profile/creator-profile.tsx 5/5 Standardized error message styling with hardcoded colors and 11px font size
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/files/files.tsx 5/5 Updated error message to use semantic p element with reduced font size
apps/sim/app/api/organizations/[id]/invitations/route.ts 5/5 Enhanced error handling with specific messages for single vs batch email invitations
apps/sim/hooks/queries/organization.ts 5/5 Consolidated error handling to check both error.error and error.message properties
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/mcp/components/add-server-form.tsx 5/5 Minor semantic improvement changing error div to p element with 11px font
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/mcp/mcp.tsx 4/5 Refactored from Alert component to inline error text display with import cleanup
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/account/account.tsx 4/5 Replaced semantic Tailwind tokens with hardcoded hex colors for precise error styling
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/remove-member-dialog/remove-member-dialog.tsx 4/5 Added error handling props and display functionality for member removal operations
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/team-seats/team-seats.tsx 5/5 Added error prop and display for team seat management operations
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/team-management.tsx 4/5 Major refactoring with React Query integration and consolidated error handling patterns
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/team-usage/team-usage.tsx 5/5 Replaced Alert component with simple div-based error display for consistency
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/member-invitation-card/member-invitation-card.tsx 4/5 Major UI refactoring from collapsible interface to popover-based workspace selection
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/custom-tools/custom-tools.tsx 5/5 Moved error display from fixed alert to contextual content area with import cleanup
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/sso/sso.tsx 4/5 Consolidated error styling and repositioned error display before submit button
apps/sim/hooks/queries/workspace.ts 4/5 Added new useAdminWorkspaces hook with complex multi-workspace permission checking

Confidence score: 4/5

  • This PR consolidates settings components with comprehensive changes that improve consistency and user experience across the settings modal
  • Score reflects the large scope of changes involving multiple components and the introduction of complex new functionality like useAdminWorkspaces hook
  • Pay close attention to apps/sim/hooks/queries/workspace.ts for the complex admin workspace fetching logic and apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/team-management.tsx for major refactoring changes

Sequence Diagram

sequenceDiagram
    participant User
    participant SettingsModal
    participant Component
    participant ReactQuery
    participant API
    participant Database

    User->>SettingsModal: "Open settings modal"
    SettingsModal->>Component: "Load component (Account/API Keys/Team/etc.)"
    
    Component->>ReactQuery: "useQuery for initial data"
    ReactQuery->>API: "GET /api/[resource]"
    API->>Database: "Query data"
    Database-->>API: "Return data"
    API-->>ReactQuery: "Return response"
    ReactQuery-->>Component: "Provide cached data"
    Component-->>User: "Display current settings"
    
    User->>Component: "Modify setting (name, email, etc.)"
    Component->>Component: "Update local state"
    
    User->>Component: "Save changes"
    Component->>ReactQuery: "useMutation.mutateAsync()"
    ReactQuery->>API: "PUT/PATCH/POST /api/[resource]"
    API->>Database: "Update/Insert data"
    Database-->>API: "Confirm changes"
    API-->>ReactQuery: "Return updated data"
    ReactQuery->>ReactQuery: "Invalidate related queries"
    ReactQuery-->>Component: "Return success"
    Component-->>User: "Show success feedback"
    
    ReactQuery->>API: "Refetch invalidated data"
    API->>Database: "Query updated data"
    Database-->>API: "Return fresh data"
    API-->>ReactQuery: "Return response"
    ReactQuery-->>Component: "Update with fresh data"
    Component-->>User: "Display updated settings"
Loading

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

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

Additional Comments (1)

  1. apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/team-management/components/member-invitation-card/member-invitation-card.tsx, line 64 (link)

    style: Type should be more specific than any[] for better type safety

    Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

17 files reviewed, 6 comments

Edit Code Review Agent Settings | Greptile

@waleedlatif1 waleedlatif1 merged commit 33ac828 into staging Nov 22, 2025
9 checks passed
@waleedlatif1 waleedlatif1 deleted the fix/templates branch November 22, 2025 03:49
MagellaX pushed a commit to MagellaX/sim that referenced this pull request Nov 23, 2025
…dioai#2100)

* fix(settings): settings components and behavior consolidation

* ack PR comments
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.

2 participants