fix(sidebar): simplify organization profile controls

Author: waleedlatif1

apps/sim/app/o/[organizationId]/components/organization-sidebar/components/organization-footer/organization-footer.test.tsx

@@ -10,15 +10,6 @@ const { mockNavigate, mockPush, context } = vi.hoisted(() => ({
   mockPush: vi.fn(),
   context: {
     organization: { id: 'org-1' },
-    viewer: { isAdmin: true },
-    settingsFeatures: {
-      billingEnabled: true,
-      hasEnterprisePlan: false,
-      hosted: true,
-      selfHosted: {},
-    },
-    connectedAccountsAvailable: true,
-    searchAccess: { memberScoped: true },
   },
 }))
 
@@ -52,9 +43,6 @@ vi.mock('next/link', () => ({
   ),
 }))
 vi.mock('@/lib/auth/sign-out', () => ({ signOutAndRedirect: vi.fn() }))
-vi.mock('@/lib/auth/auth-client', () => ({
-  useSession: () => ({ data: { user: { id: 'user-1' } } }),
-}))
 vi.mock('@/lib/desktop', () => ({ getDesktopUpdates: () => null }))
 vi.mock('@/hooks/use-desktop-update-state', () => ({
   useDesktopUpdateState: () => ({ status: 'idle' }),
@@ -69,8 +57,6 @@ vi.mock('@/app/workspace/[workspaceId]/w/components/sidebar/components', () => (
   SidebarTooltip: ({ children }: { children: React.ReactNode }) => children,
 }))
 vi.mock('@/components/icons', () => ({
-  CodeIcon: () => <svg />,
-  McpIcon: () => <svg />,
   SlackIcon: () => <svg />,
 }))
 
@@ -83,8 +69,6 @@ let root: Root
 beforeEach(() => {
   vi.stubGlobal('IS_REACT_ACT_ENVIRONMENT', true)
   vi.clearAllMocks()
-  context.viewer.isAdmin = true
-  context.settingsFeatures.billingEnabled = true
   useSettingsDirtyStore.getState().reset()
   container = document.createElement('div')
   document.body.appendChild(container)
@@ -126,46 +110,14 @@ async function selectSettings() {
 }
 
 describe('OrganizationFooter settings navigation', () => {
-  it('preserves unsaved settings when opening a shortcut', async () => {
-    useSettingsDirtyStore.getState().setDirty(true)
+  it('keeps only Settings and Sign out in the organization profile menu', async () => {
     await openProfileMenu()
-    const members = document.querySelector<HTMLAnchorElement>('a[href="/o/org-1/settings/members"]')
-    if (!members) throw new Error('Members shortcut is missing')
-    await act(async () => members.click())
-    expect(mockPush).not.toHaveBeenCalled()
-    act(() => useSettingsDirtyStore.getState().confirmLeave())
-    expect(mockPush).toHaveBeenCalledWith('/o/org-1/settings/members')
+    expect(
+      [...document.querySelectorAll('[role="menuitem"]')].map((item) => item.textContent)
+    ).toEqual(['Settings', 'Sign out'])
+    expect(document.querySelector('[role="separator"]')).toBeNull()
   })
 
-  it.each([
-    { isAdmin: true, billingEnabled: true, showBilling: true },
-    { isAdmin: false, billingEnabled: true, showBilling: false },
-    { isAdmin: true, billingEnabled: false, showBilling: false },
-  ])(
-    'matches settings visibility for $isAdmin admin, $billingEnabled billing',
-    async ({ isAdmin, billingEnabled, showBilling }) => {
-      context.viewer.isAdmin = isAdmin
-      context.settingsFeatures.billingEnabled = billingEnabled
-      await openProfileMenu()
-      expect(
-        [...document.querySelectorAll('[role="menuitem"]')].map((item) => item.textContent)
-      ).toEqual([
-        'Settings',
-        ...(showBilling ? ['Subscription'] : []),
-        'Members',
-        'Recently deleted',
-        'Sign out',
-      ])
-      expect(document.querySelector('[role="separator"]')).toBeNull()
-      const members = document.querySelector<HTMLAnchorElement>(
-        'a[href="/o/org-1/settings/members"]'
-      )
-      if (!members) throw new Error('Members shortcut is missing')
-      await act(async () => members.click())
-      expect(mockPush).toHaveBeenCalledWith('/o/org-1/settings/members')
-    }
-  )
-
   it('navigates immediately when settings are clean', async () => {
     await selectSettings()
     expect(mockPush).toHaveBeenCalledWith('/o/org-1/settings/general')

apps/sim/app/o/[organizationId]/components/organization-sidebar/components/organization-footer/organization-footer.tsx

@@ -4,7 +4,6 @@ import type { ComponentProps } from 'react'
 import { useRouter } from 'next/navigation'
 import { organizationRoutes } from '@/lib/navigation/paths'
 import { useOrganizationContext } from '@/app/o/[organizationId]/providers/organization-provider'
-import { organizationSettingsNavigation } from '@/app/o/[organizationId]/settings/navigation'
 import { SidebarFooter } from '@/app/workspace/[workspaceId]/w/components/sidebar/components/sidebar-footer/sidebar-footer'
 
 interface OrganizationFooterProps
@@ -14,26 +13,16 @@ interface OrganizationFooterProps
   > {}
 
 export function OrganizationFooter(props: OrganizationFooterProps) {
-  const { organization, viewer, settingsFeatures, connectedAccountsAvailable, searchAccess } =
-    useOrganizationContext()
+  const { organization } = useOrganizationContext()
   const router = useRouter()
   const accountSettingsHref = organizationRoutes(organization.id).settingsSection('general')
-  const navigationLinks = organizationSettingsNavigation(viewer.isAdmin, settingsFeatures, {
-    connectedAccounts: connectedAccountsAvailable,
-    search: searchAccess.memberScoped,
-  })
-    .filter(({ id }) => id === 'billing' || id === 'members' || id === 'recently-deleted')
-    .map(({ id, label, icon }) => {
-      const href = organizationRoutes(organization.id).settingsSection(id)
-      return { label, icon, href, onNavigate: () => router.push(href) }
-    })
 
   return (
     <SidebarFooter
       {...props}
       accountSettingsHref={accountSettingsHref}
       onOpenAccountSettings={() => router.push(accountSettingsHref)}
-      navigationLinks={navigationLinks}
+      navigationLinks={[]}
     />
   )
 }

apps/sim/app/o/[organizationId]/components/organization-sidebar/components/organization-header/organization-header.tsx

@@ -135,7 +135,7 @@ export function OrganizationHeader({
                     aria-label='Change organization logo'
                     aria-busy={isUploadingLogo}
                     textValue='Change organization logo'
-                    className='h-auto shrink-0 p-1'
+                    className='h-auto shrink-0 p-0 hover-hover:opacity-70 focus-visible:opacity-70'
                     disabled={isUploadingLogo}
                     onSelect={(event) => {
                       event.preventDefault()