From 734268cb752cb376d095b91e12b43195138971ba Mon Sep 17 00:00:00 2001
From: ginnoir <ginnoir@users.noreply.github.com>
Date: Wed, 6 May 2026 14:41:10 -0500
Subject: [PATCH] Wire ShareButton into list/note/calendar pages; fix nav and
 calendar select labels

- Add ShareButton to list detail, note editor, and calendar event panel
- Add Settings gear icon to AppNav (core page not in module registry)
- Fix calendar event dialog showing raw UUID: pass explicit children to
  SelectValue so labels display before SelectContent mounts

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/components/app-nav.tsx                    |  8 ++++++
 .../calendar/components/calendar-shell.tsx    | 26 ++++++++++++++-----
 src/modules/lists/components/list-detail.tsx  |  2 ++
 src/modules/notes/components/note-editor.tsx  |  4 +++
 4 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/src/components/app-nav.tsx b/src/components/app-nav.tsx
index df2fbae..55f2e84 100644
--- a/src/components/app-nav.tsx
+++ b/src/components/app-nav.tsx
@@ -1,4 +1,5 @@
 import Link from "next/link";
+import { Settings } from "lucide-react";
 import { getRegistry } from "@/modules/_core/registry";
 
 export function AppNav() {
@@ -19,6 +20,13 @@ export function AppNav() {
           {item.label}
         </Link>
       ))}
+      <Link
+        href="/settings"
+        className="ml-auto text-muted-foreground hover:text-foreground transition-colors"
+        aria-label="Settings"
+      >
+        <Settings className="size-4" />
+      </Link>
     </nav>
   );
 }
diff --git a/src/modules/calendar/components/calendar-shell.tsx b/src/modules/calendar/components/calendar-shell.tsx
index 4fc049c..b62c790 100644
--- a/src/modules/calendar/components/calendar-shell.tsx
+++ b/src/modules/calendar/components/calendar-shell.tsx
@@ -11,6 +11,7 @@ import { useMemo, useState, useTransition } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import { ShareButton } from "@/components/share-button";
 import {
   Select,
   SelectContent,
@@ -307,7 +308,9 @@ export function CalendarShell({
                   }
                 >
                   <SelectTrigger aria-label={`${calendar.name} visibility`}>
-                    <SelectValue />
+                    <SelectValue>
+                      {calendar.visibility === "household" ? "Household" : "Private"}
+                    </SelectValue>
                   </SelectTrigger>
                   <SelectContent>
                     <SelectItem value="household">Household</SelectItem>
@@ -353,7 +356,9 @@ export function CalendarShell({
                 }
               >
                 <SelectTrigger aria-label="Calendar visibility">
-                  <SelectValue />
+                  <SelectValue>
+                    {calendarVisibility === "household" ? "Household" : "Private"}
+                  </SelectValue>
                 </SelectTrigger>
                 <SelectContent>
                   <SelectItem value="household">Household</SelectItem>
@@ -431,7 +436,9 @@ export function CalendarShell({
                 }
               >
                 <SelectTrigger id="event-calendar">
-                  <SelectValue />
+                  <SelectValue>
+                    {calendarRows.find((c) => c.id === selectedEvent.calendarId)?.name ?? "Select a calendar"}
+                  </SelectValue>
                 </SelectTrigger>
                 <SelectContent>
                   {calendarRows.map((calendar) => (
@@ -483,16 +490,21 @@ export function CalendarShell({
                 }
               />
               <div className="flex items-center justify-between gap-2 pt-2">
-                <div>
+                <div className="flex gap-2">
                   {selectedEvent.id && (
                     <Button variant="destructive" onClick={removeSelectedEvent}>
                       Delete event
                     </Button>
                   )}
                 </div>
-                <Button onClick={saveSelectedEvent} disabled={!selectedEvent.title || isPending}>
-                  Save event
-                </Button>
+                <div className="flex gap-2">
+                  {selectedEvent.id && (
+                    <ShareButton entityType="calendar.event" entityId={selectedEvent.id} />
+                  )}
+                  <Button onClick={saveSelectedEvent} disabled={!selectedEvent.title || isPending}>
+                    Save event
+                  </Button>
+                </div>
               </div>
             </div>
           </div>
diff --git a/src/modules/lists/components/list-detail.tsx b/src/modules/lists/components/list-detail.tsx
index 5d35e25..6f7bcbc 100644
--- a/src/modules/lists/components/list-detail.tsx
+++ b/src/modules/lists/components/list-detail.tsx
@@ -5,6 +5,7 @@ import { Archive, GripVertical, Plus, Trash2 } from "lucide-react";
 import { useEffect, useRef, useState, useTransition } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
+import { ShareButton } from "@/components/share-button";
 import type { ListDetailDto, ListItemDto } from "../server/queries";
 import { getList } from "../server/queries";
 import {
@@ -109,6 +110,7 @@ export function ListDetail({ initialList }: { initialList: ListDetailDto }) {
             {list.type} / {list.openCount} open / {list.doneCount} done
           </div>
         </div>
+        <ShareButton entityType="lists.list" entityId={list.id} canWrite={true} />
         <Button variant="outline" onClick={archiveCurrentList} disabled={isPending}>
           <Archive />
           Archive list
diff --git a/src/modules/notes/components/note-editor.tsx b/src/modules/notes/components/note-editor.tsx
index 4f99c1e..ac01f2b 100644
--- a/src/modules/notes/components/note-editor.tsx
+++ b/src/modules/notes/components/note-editor.tsx
@@ -6,6 +6,7 @@ import { useState, useTransition } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import { ShareButton } from "@/components/share-button";
 import type { NoteDto } from "../server/queries";
 import { createNote, deleteNote, setNotePinned, updateNote } from "../server/actions";
 import { MarkdownPreview } from "./markdown-preview";
@@ -76,6 +77,9 @@ export function NoteEditor({ note }: { note?: NoteDto }) {
               {pinned ? "Unpin note" : "Pin note"}
             </Button>
           ) : null}
+          {currentNote ? (
+            <ShareButton entityType="notes.note" entityId={currentNote.id} />
+          ) : null}
           {currentNote ? (
             <Button variant="destructive" onClick={removeNote} disabled={isPending}>
               <Trash2 />