Sidebar app

A panel in the left sidemenu — lists, navigation, quick actions.

Sidebar

Create in Cowork

Cowork Studio

Tasks

Ship landing

Review PR #42

Write digest

+ Add task

your editor

The smallest possible Cowork app: one .jsx file rendered as a sidemenu panel, registered under `sidemenu` in .cowork/project.json. State persists per view through cowork.state.

Use this shape when the app is glanceable — something you want visible beside your work all day, without ever opening a tab. In Cowork: Create → App → Sidebar app.

Create it

This template is built into Cowork Studio's Create dialog. Open Manage Workspace, pick the matching tab, click its Add button and choose Sidebar app — name it, and the files land in your workspace ready to edit.

Code

// Cowork/my-app/my-app-sidemenu.jsx
import { useState } from 'react'

export default function Panel() {
  const [items, setItems] = useState(() => (window.cowork.state.get() || []))
  const save = (next) => { setItems(next); window.cowork.state.set(next) }
  return (
    <div className="h-screen overflow-y-auto bg-background p-3">
      <h2 className="text-sm font-semibold">My App</h2>
      {items.map((it, i) => <div key={i}>{it}</div>)}
    </div>
  )
}

← Introduction Sidebar + workbench app →