feat(workspaces): pin workspaces and widen the switcher to six rows (#6397)

* feat(workspaces): pin workspaces and widen the switcher to six rows

Show up to six workspaces in the switcher instead of three, keeping the
search input from six onward so it appears exactly when the list fills.

Pin workspaces to the top of the switcher via the existing row context
menu. Pins are per-user and global, so they live on the user's settings
row rather than in `pinned_item`, which scopes every row to one
workspace. They ride along on the /api/workspaces payload the switcher
already loads, so the server prefetch hydrates them and pinned-first
ordering never re-sorts after hydration.

Drop the seat/workspace-migration disclosure copy from both invitation
accept surfaces. The accept-time disclosure tokens are unchanged, so the
server still verifies the outcome hasn't shifted since the page loaded.

* fix(workspaces): serialize pin writes so a rapid toggle cannot be undone

Each write carries the whole pin list, so two overlapping requests that the
network delivered out of order left the earlier click as the stored state.
Chain them instead, and hold reconciliation until the last queued write
settles — refetching between two writes rendered the server's intermediate
state and bounced the row out of the pinned group and back.

* refactor(workspaces): store workspace pins in pinned_item, not user settings

Workspace pins were a jsonb array on the settings row, replaced wholesale on
every toggle. That shape is what forced the write serialization in 53ee94f:
two overlapping toggles each sent the entire list, so the one that landed last
won regardless of which the user clicked last.

pinned_item is the canonical pinning table and its resource_type is plain text
precisely so kinds can be added without a migration, so `workspace` joins it as
a sixth kind. A pin is now one row: pinning inserts, unpinning deletes, and two
toggles touch different rows and cannot overwrite each other. The serialization,
the outstanding-write counter, the settings column, and its migration all go
away, and deleting a workspace now cascades its pins.

Reads stay on the /api/workspaces payload — the switcher needs the pins *of*
every workspace, not the pins *inside* one — so the sidebar prefetch still
hydrates them and pinned-first ordering is correct on first paint.

* fix(workspaces): serialize same-workspace pin toggles and tolerate replays

Splitting pins into rows removed the lost-update race between *different*
workspaces but not the one on a single row: pin then unpin the same workspace
and the DELETE could overtake its INSERT, delete nothing, and leave the
workspace pinned. A mutation scope serializes them; TanStack runs onMutate
before the scope gate, so the optimistic update is still immediate.

Both duplicate-click replays now resolve to their end state rather than
erroring — a repeat pin answers 409, a repeat unpin 404, and each means the
row is already how the caller wants it. Rollback undoes its own toggle instead
of restoring a snapshot, so a sibling toggle's optimistic state survives.

Also: cap the switcher to the height Radix measured, since six rows can push
the footer actions off a short viewport with nothing able to scroll to them;
drop a dead pinned-item invalidation and a redundant ref; return the pin set
from the hook to match usePinnedIds; and exclude workspace pins from the
unscoped pinned-items listing, where they would read as a resource inside
themselves.

* fix(workspaces): hold pin reconciliation until nothing is still queued

The mutation scope serializes the writes, so an earlier toggle settles while a
later one is still waiting its turn. Invalidating there refetched the server's
intermediate state and bounced the row out of the pinned group and back before
the last write had even left the client.

* fix(workspaces): count outstanding pin toggles off the mutation cache

`hooks/queries/workspace.ts` has no 'use client' directive because server code
imports `workspaceKeys` during SSR, so the `useRef` counter added in 3dc924d
broke the production build — caught by CI, not by typecheck or tests.

`isMutating` answers the same question without a hook: `onSettled` runs before
the mutation leaves `pending`, so it counts itself, and anything above one means
a later toggle is still queued behind the scope.

Author: waleedlatif1

apps/sim/app/api/invitations/[id]/route.ts

@@ -63,19 +63,16 @@ export const GET = withRouteHandler(
       }
 
       /**
-       * Disclosure-only: a preview failure must never block viewing or
-       * accepting the invitation itself — but it also must not read as
-       * "nothing moves", so failures are flagged for the client to show a
-       * generic migration notice. Expired-but-still-pending rows get no
-       * preview — acceptance deterministically rejects them.
+       * Supplies the disclosure token acceptance is checked against, so a preview
+       * failure must never block viewing or accepting the invitation itself — the
+       * accept path simply runs without the guard. Expired-but-still-pending rows
+       * get no preview; acceptance deterministically rejects them.
        */
       let joinPreview = null
-      let joinPreviewUnavailable = false
       if (isInvitee && inv.status === 'pending' && !isInvitationExpired(inv)) {
         try {
           joinPreview = await getInvitationJoinPreview(session.user.id, inv)
         } catch (previewError) {
-          joinPreviewUnavailable = true
           logger.warn('Failed to compute invitation join preview', {
             invitationId: id,
             error: previewError,
@@ -85,7 +82,6 @@ export const GET = withRouteHandler(
 
       return NextResponse.json({
         joinPreview,
-        joinPreviewUnavailable,
         invitation: {
           id: inv.id,
           kind: inv.kind,

apps/sim/app/api/pinned-items/route.ts

@@ -2,7 +2,7 @@ import { db, pinnedItem } from '@sim/db'
 import { createLogger } from '@sim/logger'
 import { getPostgresErrorCode } from '@sim/utils/errors'
 import { generateId } from '@sim/utils/id'
-import { and, eq } from 'drizzle-orm'
+import { and, eq, ne } from 'drizzle-orm'
 import { type NextRequest, NextResponse } from 'next/server'
 import {
   createPinnedItemContract,
@@ -59,7 +59,15 @@ export const GET = withRouteHandler(async (request: NextRequest) => {
       and(
         eq(pinnedItem.userId, session.user.id),
         eq(pinnedItem.workspaceId, workspaceId),
-        resourceType ? eq(pinnedItem.resourceType, resourceType) : undefined
+        /**
+         * A `workspace` pin stores `workspaceId === resourceId`, so it would otherwise
+         * appear in this workspace's unscoped listing as a resource *inside* itself.
+         * It is read from the workspace-list payload instead, so it is excluded here
+         * rather than left for a future unscoped caller to mistake for a real resource.
+         */
+        resourceType
+          ? eq(pinnedItem.resourceType, resourceType)
+          : ne(pinnedItem.resourceType, 'workspace')
       )
     )
 

apps/sim/app/api/workspaces/route.ts

@@ -53,11 +53,16 @@ export const GET = withRouteHandler(async (request: Request) => {
     activeOrganizationId,
     scope,
   })
-  const { lastActiveWorkspaceId, creationPolicy } = payload
+  const { lastActiveWorkspaceId, pinnedWorkspaceIds, creationPolicy } = payload
 
   if (scope === 'active' && payload.workspaces.length === 0) {
     if (!creationPolicy.canCreate) {
-      return NextResponse.json({ workspaces: [], lastActiveWorkspaceId, creationPolicy })
+      return NextResponse.json({
+        workspaces: [],
+        lastActiveWorkspaceId,
+        pinnedWorkspaceIds,
+        creationPolicy,
+      })
     }
 
     let defaultWorkspace: Awaited<ReturnType<typeof createDefaultWorkspace>>
@@ -100,6 +105,7 @@ export const GET = withRouteHandler(async (request: Request) => {
     return NextResponse.json({
       workspaces: [defaultWorkspace],
       lastActiveWorkspaceId,
+      pinnedWorkspaceIds,
       creationPolicy: refreshedCreationPolicy,
     })
   }

apps/sim/app/invite/[id]/invite.tsx

@@ -2,7 +2,6 @@
 
 import { useEffect, useState } from 'react'
 import { createLogger } from '@sim/logger'
-import { isOrgAdminRole } from '@sim/platform-authz/workspace'
 import { getErrorMessage } from '@sim/utils/errors'
 import { formatQuotedNameList } from '@sim/utils/string'
 import { useQueryClient } from '@tanstack/react-query'
@@ -11,11 +10,6 @@ import { ApiClientError } from '@/lib/api/client/errors'
 import { requestJson } from '@/lib/api/client/request'
 import { acceptInvitationContract } from '@/lib/api/contracts/invitations'
 import { client, useSession } from '@/lib/auth/auth-client'
-import {
-  buildMembershipNotice,
-  buildWorkspaceMigrationNotice,
-  MAX_LISTED_WORKSPACE_NAMES,
-} from '@/lib/invitations/disclosure-copy'
 import { InviteLayout, InviteStatusCard } from '@/app/invite/components'
 import { useInvitationDetails } from '@/hooks/queries/invitations'
 import { organizationKeys } from '@/hooks/queries/organization'
@@ -25,6 +19,9 @@ import { workspaceKeys } from '@/hooks/queries/workspace'
 
 const logger = createLogger('InviteById')
 
+/** Workspace names listed in the invitation title before collapsing into an "and N more" tail. */
+const MAX_LISTED_WORKSPACE_NAMES = 3
+
 function runBestEffortCacheRefresh(cache: string, refresh: () => Promise<unknown>): void {
   void Promise.resolve()
     .then(refresh)
@@ -233,7 +230,6 @@ export default function Invite() {
   })
   const invitation = invitationQuery.data?.invitation ?? null
   const joinPreview = invitationQuery.data?.joinPreview ?? null
-  const joinPreviewUnavailable = invitationQuery.data?.joinPreviewUnavailable === true
   const isLoading = Boolean(session?.user) && invitationQuery.isPending
 
   const fetchError = invitationQuery.error
@@ -491,53 +487,13 @@ export default function Invite() {
   }
 
   const isOrg = invitation?.kind === 'organization'
-  /**
-   * Prefer the preview's organization (the one acceptance will really join)
-   * over the invitation's stamped name — a granted workspace may have moved
-   * organizations since the invite was sent.
-   */
-  const organizationLabel =
-    joinPreview?.organizationName || invitation?.organizationName || 'the organization'
-  /**
-   * When the server could not compute the preview, fall back to a generic
-   * migration notice for membership invites — a missing preview must never
-   * read as "nothing moves".
-   */
-  const migrationNotice = buildWorkspaceMigrationNotice({
-    joinPreview,
-    joinPreviewUnavailable,
-    membershipIntent: invitation?.membershipIntent,
-    organizationLabel,
-  })
-  /**
-   * Only disclosed when the invitation actually carries organization standing —
-   * a personal-workspace invite has no seat or membership to explain.
-   */
-  const membershipNotice = buildMembershipNotice({
-    joinPreview,
-    membershipIntent: invitation?.membershipIntent,
-    isOrganizationAdminRole: Boolean(invitation?.role && isOrgAdminRole(invitation.role)),
-    organizationLabel,
-    /**
-     * A personal-workspace invite has no organization id and no organization
-     * name yet — acceptance creates one by converting the billed owner's Pro to
-     * Team — so a `will-join` outcome is the authoritative signal that a
-     * membership and seat are involved. Gating on the ids alone silenced the
-     * disclosure for exactly the case that creates the membership.
-     */
-    isOrganizationScoped: Boolean(
-      invitation?.organizationId ||
-        joinPreview?.organizationName ||
-        joinPreview?.outcome === 'will-join'
-    ),
-  })
 
   return (
     <InviteLayout>
       <InviteStatusCard
         type='invitation'
         title={isOrg ? 'Organization Invitation' : 'Workspace Invitation'}
-        description={`You've been invited to join ${displayName}.${membershipNotice}${migrationNotice}`}
+        description={`You've been invited to join ${displayName}.`}
         icon={isOrg ? 'users' : 'mail'}
         actions={[
           {

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/components/pending-invitations/view-invitations-modal.tsx

@@ -2,14 +2,9 @@
 
 import { Chip, ChipModal, ChipModalBody, ChipModalFooter, ChipModalHeader, toast } from '@sim/emcn'
 import { createLogger } from '@sim/logger'
-import { isOrgAdminRole } from '@sim/platform-authz/workspace'
 import { getErrorMessage } from '@sim/utils/errors'
 import { useRouter } from 'next/navigation'
 import type { MyInvitation } from '@/lib/api/contracts/invitations'
-import {
-  buildMembershipNotice,
-  buildWorkspaceMigrationNotice,
-} from '@/lib/invitations/disclosure-copy'
 import { getInvitationErrorMessage } from '@/lib/invitations/error-messages'
 import {
   useAcceptMyInvitation,
@@ -43,37 +38,6 @@ function invitationSubLabel(inv: MyInvitation): string {
   return detail ? `${invitedBy} · ${detail}` : invitedBy
 }
 
-/**
- * What accepting will do to the invitee's own account: the seat/membership
- * consequence and any workspaces that will move into the organization. Built
- * from the same copy as the emailed `/invite` page so the two accept surfaces
- * can never disclose different outcomes.
- */
-function invitationDisclosure(inv: MyInvitation): string {
-  const organizationLabel =
-    inv.joinPreview?.organizationName ?? inv.organizationName ?? 'the organization'
-  const membership = buildMembershipNotice({
-    joinPreview: inv.joinPreview,
-    membershipIntent: inv.membershipIntent,
-    isOrganizationAdminRole: isOrgAdminRole(inv.role),
-    organizationLabel,
-    /** A `will-join` outcome also covers a personal-workspace invite, which has
-     * no organization id or name until acceptance creates one. */
-    isOrganizationScoped: Boolean(
-      inv.organizationId ||
-        inv.joinPreview?.organizationName ||
-        inv.joinPreview?.outcome === 'will-join'
-    ),
-  })
-  const migration = buildWorkspaceMigrationNotice({
-    joinPreview: inv.joinPreview,
-    joinPreviewUnavailable: inv.joinPreview === null,
-    membershipIntent: inv.membershipIntent,
-    organizationLabel,
-  })
-  return `${membership}${migration}`.trim()
-}
-
 interface ViewInvitationsModalProps {
   open: boolean
   onOpenChange: (open: boolean) => void
@@ -133,38 +97,32 @@ export function ViewInvitationsModal({ open, onOpenChange }: ViewInvitationsModa
         {!invitations || invitations.length === 0 ? (
           <p className='px-2 text-[var(--text-muted)] text-sm'>No pending invitations.</p>
         ) : (
-          invitations.map((inv) => {
-            const disclosure = invitationDisclosure(inv)
-            return (
-              <div key={inv.id} className='flex items-start gap-2 px-2'>
-                <div className='min-w-0 flex-1'>
-                  <p className='truncate text-[var(--text-body)] text-sm'>{invitationLabel(inv)}</p>
-                  <p className='truncate text-[var(--text-muted)] text-caption'>
-                    {invitationSubLabel(inv)}
-                  </p>
-                  {disclosure ? (
-                    <p className='mt-1 text-[var(--text-muted)] text-caption'>{disclosure}</p>
-                  ) : null}
-                </div>
-                <Chip
-                  variant='primary'
-                  disabled={isBusy}
-                  onClick={() => void handleAccept(inv)}
-                  className='flex-shrink-0'
-                >
-                  Accept
-                </Chip>
-                <Chip
-                  disabled={isBusy}
-                  onClick={() => void handleDecline(inv)}
-                  aria-label={`Decline invitation to ${invitationLabel(inv)}`}
-                  className='flex-shrink-0'
-                >
-                  Decline
-                </Chip>
+          invitations.map((inv) => (
+            <div key={inv.id} className='flex items-center gap-2 px-2'>
+              <div className='min-w-0 flex-1'>
+                <p className='truncate text-[var(--text-body)] text-sm'>{invitationLabel(inv)}</p>
+                <p className='truncate text-[var(--text-muted)] text-caption'>
+                  {invitationSubLabel(inv)}
+                </p>
               </div>
-            )
-          })
+              <Chip
+                variant='primary'
+                disabled={isBusy}
+                onClick={() => void handleAccept(inv)}
+                className='flex-shrink-0'
+              >
+                Accept
+              </Chip>
+              <Chip
+                disabled={isBusy}
+                onClick={() => void handleDecline(inv)}
+                aria-label={`Decline invitation to ${invitationLabel(inv)}`}
+                className='flex-shrink-0'
+              >
+                Decline
+              </Chip>
+            </div>
+          ))
         )}
       </ChipModalBody>
       <ChipModalFooter

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/workspace-header.test.tsx

@@ -61,17 +61,22 @@ import { WorkspaceHeader } from '@/app/workspace/[workspaceId]/w/components/side
 const ACTIVE_BG = 'bg-[var(--surface-active)]'
 
 /**
- * Above `WORKSPACE_SEARCH_THRESHOLD` (3), so the searchable/keyboard list renders.
+ * At `WORKSPACE_SEARCH_THRESHOLD` (6), so the searchable/keyboard list renders.
  * The current workspace is deliberately NOT first: the highlight is seeded to row 0 on
  * open, so a current workspace sitting at row 0 would mask the double-mark this guards.
  */
 const WORKSPACES = [
   { id: 'ws-rvt', name: 'RVT' },
   { id: 'ws-emir', name: "Emir's Workspace" },
   { id: 'ws-acme', name: 'Acme' },
+  { id: 'ws-initech', name: 'Initech' },
+  { id: 'ws-umbrella', name: 'Umbrella' },
   { id: 'ws-globex', name: 'Globex' },
 ] as unknown as Parameters<typeof WorkspaceHeader>[0]['workspaces']
 
+/** Pinning reorders the list; these assertions are about the highlight, not the order. */
+const NO_PINS: ReadonlySet<string> = new Set()
+
 let container: HTMLDivElement
 let root: Root
 
@@ -86,6 +91,8 @@ function render() {
         activeWorkspace={{ name: "Emir's Workspace" }}
         workspaceId='ws-emir'
         workspaces={WORKSPACES}
+        pinnedWorkspaceIds={NO_PINS}
+        onToggleWorkspacePin={() => {}}
         isWorkspacesLoading={false}
         isCreatingWorkspace={false}
         isWorkspaceMenuOpen