tuiboard 0.7.2 → 0.8.0

package/.tuiboard/config.example.yaml

@@ -68,10 +68,17 @@ archive_column: Archive
 # own credentials — nothing is hosted, nothing leaves your machine. All-day
 # events are skipped; each calendar keeps its own color. Paths support `~`.
 #
+# To CREATE / EDIT / DELETE events (not just read), re-auth with:
+# calendar-setup google --write. Then press `n` / click an empty slot to create;
+# click an existing event to select it, `e` to edit, `d` to delete.
+# `default_calendar` (a calendar id) sets the default target for new events;
+# override per-event in the modal.
+#
 # calendars:
 #   google:
 #     enabled: true
 #     token: ~/.config/tuiboard/google_token.json
+#     # default_calendar: you@example.com   # default target for new events
 #     # color: "#e8a05c"            # fallback when a calendar has no color
 #   microsoft:
 #     enabled: true

package/CHANGELOG.md

@@ -5,6 +5,42 @@ All notable changes to **tuiboard** are documented here.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.8.0] - 2026-06-03
+
+### Added
+- **Create, edit & delete Google Calendar events from the Agenda** (opt-in
+  write). Re-authorize with `tuiboard calendar-setup google --write`, then:
+  - **Create** — press `n` (or click an empty Agenda slot) to open a new-event
+    modal: type a title (append `HH:MM-HH:MM` to set the time), pick the target
+    calendar, Enter to create. A `default_calendar` config sets the default
+    target (override per-event in the modal).
+  - **Edit / delete** — click an existing event on a writable calendar to select
+    it, then `e` (or Enter) to edit its title/time, `d` to delete (with confirm),
+    `Esc` to deselect. Edits stay on the same calendar. Read-only events can't be
+    selected.
+
+  Every change appears in the Agenda and on Google Calendar immediately.
+  Read-only setups are unaffected — the write UI only appears when the token
+  carries the write scope, and only Google events on owner/writer calendars are
+  selectable. Microsoft event write is not supported yet.
+- Expanded the README with a step-by-step Google Cloud OAuth client setup (the
+  bring-your-own-credentials flow), so first-time users have a clear path.
+
+## [0.7.3] - 2026-06-02
+
+### Fixed
+- Opening a modal no longer shifts the whole dashboard up by a row. The Agenda's
+  tall scrollbox was inflating the main row one line past the terminal (flex
+  basis `auto` takes the content height); a modal in its place removed that
+  overflow, which read as a jump. The main row now grows purely from the
+  available space (`flex-basis: 0`), so the layout is steady whatever's on
+  screen. Modals also render in the Agenda's exact slot, so there's no
+  horizontal reflow either.
+
+### Changed
+- Reclaimed a row: the board and agenda are one row taller, and the keyboard
+  cheat-sheet sits flush on the bottom line.
+
 ## [0.7.2] - 2026-06-02
 
 ### Changed
@@ -98,6 +134,8 @@ First public release on npm. This entry captures the full feature set at launch.
 
 Built with [OpenTUI](https://opentui.com) + SolidJS on Bun.
 
+[0.8.0]: https://github.com/NazzarenoGiannelli/tuiboard/releases/tag/v0.8.0
+[0.7.3]: https://github.com/NazzarenoGiannelli/tuiboard/releases/tag/v0.7.3
 [0.7.2]: https://github.com/NazzarenoGiannelli/tuiboard/releases/tag/v0.7.2
 [0.7.1]: https://github.com/NazzarenoGiannelli/tuiboard/releases/tag/v0.7.1
 [0.7.0]: https://github.com/NazzarenoGiannelli/tuiboard/releases/tag/v0.7.0

package/README.md

@@ -193,13 +193,37 @@ tuiboard calendar-setup google      # opens your browser (read-only scope)
 tuiboard calendar-setup microsoft   # device-code flow, no redirect
 ```
 
-**Google** needs a one-time OAuth client (free): Google Cloud Console → enable
-*Google Calendar API* → create an *OAuth client ID* (type **Desktop app**) →
-download the JSON to `~/.config/tuiboard/google_credentials.json`, then run the
-command above. **Microsoft** needs an Azure app registration (Public client,
-`Calendars.Read` delegated) whose client ID goes in
-`~/.config/tuiboard/azure_config.json` — running `calendar-setup microsoft` with
-no config writes a template that walks you through it.
+**Microsoft** needs an Azure app registration (Public client, `Calendars.Read`
+delegated) whose client ID goes in `~/.config/tuiboard/azure_config.json` —
+running `calendar-setup microsoft` with no config writes a template that walks
+you through it.
+
+#### Google: one-time OAuth client setup
+
+There's no hosted tuiboard app — **you create your own free OAuth client** in
+your own Google Cloud project, so nothing is shared and your data never passes
+through anyone else's servers. It takes about five minutes, once:
+
+1. Go to the [Google Cloud Console](https://console.cloud.google.com/) and
+   create a project (or pick an existing one) from the project dropdown.
+2. **APIs & Services → Library** → search **"Google Calendar API"** → **Enable**.
+3. **APIs & Services → OAuth consent screen**: if prompted, choose **External**,
+   give the app a name and your email, and save. You don't need to publish it or
+   submit for verification — as the project owner you're automatically a test
+   user of your own app, which is all tuiboard needs. (Add your Google address
+   under **Test users** if it asks.)
+4. **APIs & Services → Credentials → Create credentials → OAuth client ID**.
+   Application type: **Desktop app**. Create.
+5. **Download JSON** on the client you just made, and save it as
+   `~/.config/tuiboard/google_credentials.json`.
+6. Run `tuiboard calendar-setup google` (add `--write` to also create/edit/delete
+   — see below). Your browser opens; approve the access. You'll briefly see an
+   "unverified app" notice — that's expected for your own personal client; click
+   **Advanced → go to (your app)** to continue. The token is saved and the
+   command prints the YAML block to paste into your config.
+
+The `calendar-setup` command prints these exact steps too if it doesn't find the
+credentials file.
 
 After connecting, the command prints the exact YAML to paste into your config:
 
@@ -219,6 +243,46 @@ expired, or unconfigured calendar never breaks the board — it just shows no
 events. Set either provider's `enabled: false` (or drop the block) to turn it
 off; add a `color:` to override the fallback block color.
 
+### Creating, editing & deleting events (Google, opt-in)
+
+Reading is the default. To also **create, edit, and delete** Google Calendar
+events from the Agenda, re-authorize with the write scope:
+
+```bash
+tuiboard calendar-setup google --write
+```
+
+**Create** — in the Agenda zone, press **`n`** (or **click an empty time slot**)
+to open the new-event modal: type a title (append `HH:MM-HH:MM` to change the
+time), press Enter, pick the target calendar with `j`/`k`, Enter to create. Only
+calendars you can write to (owner/writer) show in the picker.
+
+**Edit / delete** — **click an existing event** in the Agenda to select it (only
+events on writable calendars can be selected; read-only ones just say so). Then:
+
+- **`e`** (or Enter) opens the edit modal, prefilled with the title and time —
+  change either (`Title HH:MM-HH:MM`) and Enter to save.
+- **`d`** deletes it (with a confirm).
+- **`Esc`** deselects.
+
+Edits stay on the same calendar (moving an event between calendars isn't
+supported). Every change appears in the Agenda right away and on Google Calendar.
+
+Set the calendar new events default to with `default_calendar` (a calendar id;
+unset → your primary). You can still override per-event in the modal:
+
+```yaml
+calendars:
+  google:
+    enabled: true
+    token: ~/.config/tuiboard/google_token.json
+    default_calendar: you@example.com   # optional; default target for new events
+```
+
+The write scope is opt-in: without `--write`, tuiboard stays read-only and the
+`n` shortcut / slot-click / event-selection do nothing. Microsoft event write
+isn't supported yet (read-only).
+
 ## Markdown board format
 
 `tuiboard` reads and writes **plain CommonMark** with the Obsidian

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tuiboard",
-  "version": "0.7.2",
+  "version": "0.8.0",
   "description": "Terminal kanban for markdown task boards, with optional Today/Tomorrow planner, 24h agenda + calendar overlay, and a live Claude Code agent view. Use only the panels you want.",
   "type": "module",
   "license": "MIT",

package/src/app.tsx

@@ -115,23 +115,35 @@ function App() {
         width: "100%",
         height: "100%",
         backgroundColor: T.bg,
-        padding: 1,
+        // No bottom padding: the keyboard cheat-sheet sits flush on the last
+        // row, which gives the board + agenda one extra row of height. Safe
+        // thanks to the flexBasis:0 main row — the content just fills the space.
+        paddingTop: 1,
+        paddingLeft: 1,
+        paddingRight: 1,
+        paddingBottom: 0,
       }}
     >
       <TopBar store={store} />
       <box style={{ height: 1 }} />
       {/*
-        rootView + ModalLayer are flex-row siblings. The modal panel is exactly
-        the Agenda's width, and the Dashboard hides the Agenda while a modal is
-        open — so the modal drops into the Agenda's slot with zero reflow of the
-        left side (board / planner / agents). When no modal is open ModalLayer
-        renders nothing and rootView gets the whole row.
+        The default Dashboard renders its modal inside the Agenda's slot, so the
+        layout stays put when a modal opens. The standalone `--view=` modes have
+        no Agenda slot, so they get the modal here as a right-hand panel.
+        (`view` is fixed at launch, never reactive.)
+
+        `flexBasis: 0` + `minHeight: 0` are load-bearing: without them the row's
+        flex-basis is `auto`, so the Agenda's tall scrollbox inflates the row to
+        its content height (1 row past the terminal). That overflow vanishes
+        when a modal (no scrollbox) takes the slot — which is exactly the 1-row
+        "shift" the whole bottom strip used to do. Basis 0 makes the row grow
+        purely from the available space, ignoring content, so it's stable.
       */}
-      <box style={{ flexDirection: "row", flexGrow: 1 }}>
+      <box style={{ flexDirection: "row", flexGrow: 1, flexBasis: 0, minHeight: 0 }}>
         <box style={{ flexDirection: "column", flexGrow: 1 }}>
           {rootViewFor(view, store)}
         </box>
-        <ModalLayer store={store} />
+        {view ? <ModalLayer store={store} /> : null}
       </box>
       <BottomBar store={store} />
     </box>

package/src/calendar/setup.ts

@@ -21,7 +21,9 @@ import { dirname, isAbsolute, join, resolve } from "node:path";
 import { loadConfig } from "~/config/loader";
 
 const TUIBOARD_DIR = join(homedir(), ".config", "tuiboard");
-const GOOGLE_SCOPE = "https://www.googleapis.com/auth/calendar.readonly";
+const GOOGLE_SCOPE_RO = "https://www.googleapis.com/auth/calendar.readonly";
+/** Added with `--write`: lets tuiboard CREATE events (and still read them). */
+const GOOGLE_SCOPE_EVENTS = "https://www.googleapis.com/auth/calendar.events";
 const MS_SCOPE = "Calendars.Read offline_access openid profile";
 
 function expandPath(p: string, root: string): string {
@@ -32,8 +34,10 @@ function expandPath(p: string, root: string): string {
 function openBrowser(url: string): void {
   try {
     if (process.platform === "win32") {
-      // `start` is a cmd builtin; the empty "" is the window title arg.
-      spawn("cmd", ["/c", "start", "", url], { detached: true, stdio: "ignore" }).unref();
+      // NOT `cmd /c start`: cmd treats the `&` in an OAuth URL as a command
+      // separator and truncates it (→ Google "invalid_request"). rundll32 gets
+      // the URL as a single literal argv, no shell parsing.
+      spawn("rundll32", ["url.dll,FileProtocolHandler", url], { detached: true, stdio: "ignore" }).unref();
     } else if (process.platform === "darwin") {
       spawn("open", [url], { detached: true, stdio: "ignore" }).unref();
     } else {
@@ -58,8 +62,10 @@ interface GoogleClientSecrets {
   token_uri?: string;
 }
 
-async function setupGoogle(credsPath: string, tokenPath: string): Promise<number> {
+async function setupGoogle(credsPath: string, tokenPath: string, write: boolean): Promise<number> {
+  const scopes = write ? [GOOGLE_SCOPE_RO, GOOGLE_SCOPE_EVENTS] : [GOOGLE_SCOPE_RO];
   console.log("\n── Google Calendar setup ──────────────────────────────────");
+  console.log(write ? "Mode: read + create events" : "Mode: read-only (add --write to create events)");
   if (!existsSync(credsPath)) {
     console.log(`OAuth client file not found:\n  ${credsPath}\n
 Create it:
@@ -88,7 +94,10 @@ Create it:
     console.log("client_id / client_secret missing from the OAuth client file.");
     return 1;
   }
-  const authUri = secrets.auth_uri || "https://accounts.google.com/o/oauth2/auth";
+  // Force the current v2 authorization endpoint. Desktop client_secret files
+  // still ship the legacy `/o/oauth2/auth` in `auth_uri`, which returns
+  // "Error 400: invalid_request (GeneralOAuthFlow)" for loopback + multi-scope.
+  const authUri = "https://accounts.google.com/o/oauth2/v2/auth";
   const tokenUri = secrets.token_uri || "https://oauth2.googleapis.com/token";
 
   // Loopback server captures the ?code= redirect.
@@ -96,15 +105,22 @@ Create it:
   const result = new Promise<{ code?: string; error?: string }>((r) => (resolveResult = r));
   const server = Bun.serve({
     port: 0,
+    // Bind the IPv4 loopback explicitly. On Windows `localhost` resolves to
+    // IPv6 `::1` first; if the server is IPv4-only the redirect is refused.
+    // We also use 127.0.0.1 in the redirect URI so the two always match.
+    hostname: "127.0.0.1",
     fetch(req) {
       const u = new URL(req.url);
       const code = u.searchParams.get("code") ?? undefined;
       const error = u.searchParams.get("error") ?? undefined;
       if (code || error) {
-        resolveResult({ code, error });
         const msg = error
           ? `Authorization failed: ${error}`
           : "tuiboard is now connected to Google Calendar. You can close this tab.";
+        // Resolve AFTER the response is handed back so the success page has a
+        // moment to flush; resolving synchronously lets the caller stop the
+        // server before the bytes reach the browser (→ ERR_CONNECTION_REFUSED).
+        setTimeout(() => resolveResult({ code, error }), 300);
         return new Response(`<!doctype html><meta charset=utf-8><body style="font:16px system-ui;padding:3rem">${msg}</body>`, {
           headers: { "content-type": "text/html" },
         });
@@ -112,24 +128,24 @@ Create it:
       return new Response("waiting for Google…", { headers: { "content-type": "text/plain" } });
     },
   });
-  const redirectUri = `http://localhost:${server.port}`;
+  const redirectUri = `http://127.0.0.1:${server.port}`;
   const authUrl =
     `${authUri}?` +
     new URLSearchParams({
       client_id: clientId,
       redirect_uri: redirectUri,
       response_type: "code",
-      scope: GOOGLE_SCOPE,
+      scope: scopes.join(" "),
       access_type: "offline",
       prompt: "consent",
     }).toString();
 
-  console.log("Opening your browser to authorize Google Calendar (read-only)…");
+  console.log(`Opening your browser to authorize Google Calendar (${write ? "read + write" : "read-only"})…`);
   console.log(`If it doesn't open, visit:\n  ${authUrl}\n`);
   openBrowser(authUrl);
 
   const { code, error } = await result;
-  server.stop(true);
+  server.stop(); // graceful: lets the success page finish sending
   if (error || !code) {
     console.log(`\nSetup cancelled${error ? `: ${error}` : ""}.`);
     return 1;
@@ -165,7 +181,7 @@ Create it:
     token_uri: tokenUri,
     client_id: clientId,
     client_secret: clientSecret,
-    scopes: [GOOGLE_SCOPE],
+    scopes,
     expiry: data.expires_in ? new Date(Date.now() + data.expires_in * 1000).toISOString() : undefined,
   });
   console.log(`\n✓ Google Calendar connected. Token saved:\n  ${tokenPath}\n`);
@@ -279,8 +295,9 @@ function usage(): void {
   console.log(`tuiboard calendar-setup — connect a calendar to the Agenda overlay
 
 Usage:
-  tuiboard calendar-setup google      Browser OAuth for Google Calendar
-  tuiboard calendar-setup microsoft   Device-code flow for Microsoft 365
+  tuiboard calendar-setup google           Browser OAuth, read-only
+  tuiboard calendar-setup google --write   Browser OAuth, read + create events
+  tuiboard calendar-setup microsoft        Device-code flow for Microsoft 365
 
 Tokens are written to the paths in your tuiboard config (calendars.google.token
 / calendars.microsoft.tokenCache), or ~/.config/tuiboard/ if no calendars block
@@ -289,7 +306,8 @@ prints the exact YAML.`);
 }
 
 export async function runCalendarSetup(argv: string[]): Promise<number> {
-  const provider = (argv[0] ?? "").toLowerCase();
+  const write = argv.includes("--write");
+  const provider = (argv.find((a) => !a.startsWith("--")) ?? "").toLowerCase();
   const cfg = loadConfig();
   const root = cfg.root;
 
@@ -299,7 +317,7 @@ export async function runCalendarSetup(argv: string[]): Promise<number> {
       ? expandPath(g.credentials, root)
       : join(TUIBOARD_DIR, "google_credentials.json");
     const tokenPath = g?.token ? expandPath(g.token, root) : join(TUIBOARD_DIR, "google_token.json");
-    const rc = await setupGoogle(credsPath, tokenPath);
+    const rc = await setupGoogle(credsPath, tokenPath, write);
     if (rc === 0 && !g) {
       console.log(`Add this to your tuiboard config (${cfg.loaded ? "config found" : "create ~/.config/tuiboard/config.yaml"}):
 

package/src/config/loader.ts

@@ -83,6 +83,9 @@ export interface GoogleCalendarConfig {
   credentials?: string;
   /** Fallback color when a calendar has none of its own. */
   color?: string;
+  /** Calendar id new events are created on by default (override in the modal).
+   *  Unset → the account's primary calendar. Requires `--write` setup. */
+  defaultCalendar?: string;
 }
 
 export interface MicrosoftCalendarConfig {
@@ -152,6 +155,7 @@ interface RawConfig {
       token?: string;
       credentials?: string;
       color?: string;
+      default_calendar?: string;
     };
     microsoft?: {
       enabled?: boolean;
@@ -191,6 +195,7 @@ function normalizeCalendars(
       token: expandPath(g.token, root),
       credentials: g.credentials ? expandPath(g.credentials, root) : undefined,
       color: g.color,
+      defaultCalendar: g.default_calendar,
     };
   }
   const m = raw.microsoft;

package/src/input/handleKey.ts

@@ -14,6 +14,7 @@
  */
 
 import { isHiddenColumn } from "~/config/loader";
+import { googleTokenCanWrite } from "~/store/calendar";
 import { isTask } from "~/parser/markdown";
 import {
   isoToday,
@@ -59,6 +60,14 @@ export function handleKey(
       }
       return;
     }
+    if (ui.modal.kind === "confirm-delete-event") {
+      if (key.name === "y" || key.name === "enter" || key.name === "return") {
+        void store.confirmDeleteEvent();
+      } else if (key.name === "n") {
+        store.closeModal();
+      }
+      return;
+    }
     if ((ui.modal.kind === "help" ||
          ui.modal.kind === "detail" ||
          ui.modal.kind === "agent-detail") &&
@@ -66,6 +75,17 @@ export function handleKey(
       store.closeModal();
       return;
     }
+    // New-event modal: step 1 typing goes to the <input>; step 2 (no input
+    // focused) is the calendar picker, driven here.
+    if (ui.modal.kind === "event") {
+      const p = ui.eventPicker;
+      if (p && p.step === 2) {
+        if (key.name === "j" || key.name === "down") { store.setEventSel(p.sel + 1); return; }
+        if (key.name === "k" || key.name === "up") { store.setEventSel(p.sel - 1); return; }
+        if (key.name === "enter" || key.name === "return") { void store.confirmEventPicker(); return; }
+      }
+      return;
+    }
     return;
   }
 
@@ -85,6 +105,11 @@ export function handleKey(
       store.flashBanner("info", wasMode ? "Arm mode off" : "Disarmed");
       return;
     }
+    if (ui.selectedCalEvent) {
+      store.clearCalSelection();
+      store.flashBanner("info", "Event deselected");
+      return;
+    }
     if (ui.grabbing) {
       store.exitGrab();
       store.flashBanner("info", "Grab released");
@@ -294,6 +319,34 @@ function handleTimelineZone(
   );
   const target = entries[ui.row];
 
+  // A selected (clicked) calendar event takes over e/d/Enter for edit/delete.
+  // Any other key drops the selection and is then handled normally below.
+  const selCal = ui.selectedCalEvent;
+  if (selCal) {
+    if (key.name === "e" || key.name === "enter" || key.name === "return") {
+      store.openEventEditModal();
+      return;
+    }
+    if (key.name === "d") {
+      openLater({ kind: "confirm-delete-event" });
+      return;
+    }
+    store.clearCalSelection();
+  }
+
+  // `n` (Agenda zone) = create a Google Calendar event at the now-rounded slot.
+  // Mirrors `n` = new task in the board. Gated on Google write being connected.
+  if ((key.name === "n" || key.name === "N") && !key.ctrl) {
+    const g = store.config.calendars?.google;
+    if (g && googleTokenCanWrite(g.token)) {
+      const { startMin, endMin } = nextNowBlock();
+      store.openEventModal(store.agendaDate(), startMin, endMin);
+    } else {
+      store.flashBanner("warn", "Connect Google write first: tuiboard calendar-setup google --write");
+    }
+    return;
+  }
+
   // Armed-block adjustments take priority over navigation. While a block
   // is armed, j/k nudge its start time and +/- nudge its end.
   const armedRef = ui.armedTimelineRef;