Features
Workspaces

Workspaces

Workspaces are the top-level organizational unit in Sunday. They contain multiple boards and help teams organize their work.

Overview

Workspace: "Marketing"
├── Board: "Q1 Campaigns"
├── Board: "Content Calendar"
└── Board: "Brand Assets"

Workspace: "Engineering"
├── Board: "Sprint Backlog"
├── Board: "Bug Tracker"
└── Board: "Roadmap"

Creating a Workspace

Via UI

  1. Click the + button in the sidebar
  2. Enter workspace name
  3. Choose an icon and color
  4. Click Create

Via API

POST /api/workspaces
Content-Type: application/json
 
{
  "name": "My Workspace",
  "icon": "📁",
  "color": "#3B82F6"
}

Workspace Properties

PropertyTypeDescription
idstringUnique identifier
namestringWorkspace name
iconstringEmoji or icon
colorstringHex color code
ownerIdstringUser who created it

Managing Workspaces

Update Workspace

PATCH /api/workspaces/[id]
Content-Type: application/json
 
{
  "name": "Updated Name",
  "icon": "🚀",
  "color": "#10B981"
}

Delete Workspace

DELETE /api/workspaces/[id]

⚠️ Warning: Deleting a workspace also deletes all boards and tasks within it.

Store Actions

import { useAppStore } from '@/lib/store'
 
// Get all workspaces
const workspaces = useAppStore((s) => s.workspaces)
 
// Add workspace
const addWorkspace = useAppStore((s) => s.addWorkspace)
addWorkspace({
  name: 'New Workspace',
  icon: '📁',
  color: '#3B82F6'
})
 
// Update workspace
const updateWorkspace = useAppStore((s) => s.updateWorkspace)
updateWorkspace(workspaceId, { name: 'Updated Name' })
 
// Delete workspace
const deleteWorkspace = useAppStore((s) => s.deleteWorkspace)
deleteWorkspace(workspaceId)

Workspace Selector

The sidebar displays all workspaces with expandable board lists:

function WorkspaceSidebar() {
  const workspaces = useAppStore((s) => s.workspaces)
  const boards = useAppStore((s) => s.boards)
  
  return (
    <div>
      {workspaces.map(workspace => (
        <div key={workspace.id}>
          <div className="flex items-center gap-2">
            <span>{workspace.icon}</span>
            <span>{workspace.name}</span>
          </div>
          <ul>
            {boards
              .filter(b => b.workspaceId === workspace.id)
              .map(board => (
                <li key={board.id}>{board.name}</li>
              ))
            }
          </ul>
        </div>
      ))}
    </div>
  )
}
AuthenticationBoards