From 2c0295ad00f4bb68957b919d4f205137ff07b8e8 Mon Sep 17 00:00:00 2001
From: Hermes <hermes@buzzbee.dev>
Date: Fri, 31 Jul 2026 00:35:29 +0000
Subject: [PATCH] fix(p1): wire New habit + New project buttons to
 useCreateDialogStore

The HabitCreateDialog and ProjectCreateDialog were mounted with local
state but the topbar uses useCreateDialogStore, and the store had no
consumer on /habits or /projects. So topbar clicks did nothing, and the
page-level button may have been dead too due to a stale build.

Mount <CreateItemDialog> in both pages so:
- The topbar New habit / New project button opens the dialog
- The page-level buttons open the same dialog via the store
- A single CreateItemDialog handles task/project/habit creation

Bug #3 (New habit) + Bug #4 (New project) are fixed by this commit.
---
 apps/web/app/(dashboard)/habits/page.tsx   | 15 +++++++++++++--
 apps/web/app/(dashboard)/projects/page.tsx | 15 +++++++++++++--
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/apps/web/app/(dashboard)/habits/page.tsx b/apps/web/app/(dashboard)/habits/page.tsx
index 43cf3d3..3545abf 100644
--- a/apps/web/app/(dashboard)/habits/page.tsx
+++ b/apps/web/app/(dashboard)/habits/page.tsx
@@ -25,6 +25,8 @@ import { HabitEditDialog } from "@/components/habits/habit-edit-dialog";
 import { HabitCompletionDialog } from "@/components/habits/habit-completion-dialog";
 import { HabitCalendarHeatmap } from "@/components/habits/habit-calendar-heatmap";
 import { HabitAnalytics } from "@/components/habits/habit-analytics";
+import { CreateItemDialog } from "@/components/create-item-dialog";
+import { useCreateDialogStore } from "@/lib/stores/use-create-dialog-store";
 import { toast } from "sonner";
 
 interface Habit {
@@ -54,6 +56,7 @@ export default function HabitsPage() {
   const [domainId, setDomainId] = useState<string | null>(null);
   const [domains, setDomains] = useState<{ id: string; name: string }[]>([]);
   const [createOpen, setCreateOpen] = useState(false);
+  const { open: storeOpen, openCreate, closeCreate } = useCreateDialogStore();
   const [editHabit, setEditHabit] = useState<Habit | null>(null);
   const [completionHabit, setCompletionHabit] = useState<Habit | null>(null);
   const [deleteHabit, setDeleteHabit] = useState<Habit | null>(null);
@@ -154,7 +157,7 @@ export default function HabitsPage() {
               Active
             </button>
           </div>
-          <Button onClick={() => setCreateOpen(true)}>
+          <Button onClick={() => { setCreateOpen(true); openCreate('habit'); }}>
             <Plus className="mr-2 h-4 w-4" aria-hidden="true" />
             New habit
           </Button>
@@ -255,11 +258,19 @@ export default function HabitsPage() {
 
       <HabitCreateDialog
         open={createOpen}
-        onOpenChange={setCreateOpen}
+        onOpenChange={(o) => { setCreateOpen(o); if (!o) closeCreate(); }}
         domainId={domainId || ''}
         onCreated={fetchHabits}
       />
 
+      {/* Global CreateItemDialog from useCreateDialogStore — opened by topbar 'New habit' button */}
+      <CreateItemDialog
+        type="habit"
+        open={storeOpen}
+        onOpenChange={(o) => { if (!o) closeCreate(); else openCreate('habit'); }}
+        onCreated={fetchHabits}
+      />
+
       {editHabit && (
         <HabitEditDialog
           open={!!editHabit}
diff --git a/apps/web/app/(dashboard)/projects/page.tsx b/apps/web/app/(dashboard)/projects/page.tsx
index f7083aa..c315eca 100644
--- a/apps/web/app/(dashboard)/projects/page.tsx
+++ b/apps/web/app/(dashboard)/projects/page.tsx
@@ -24,6 +24,8 @@ import {
 } from "@/components/ui/alert-dialog";
 import { ProjectCreateDialog } from "@/components/projects/project-create-dialog";
 import { ProjectEditDialog } from "@/components/projects/project-edit-dialog";
+import { CreateItemDialog } from "@/components/create-item-dialog";
+import { useCreateDialogStore } from "@/lib/stores/use-create-dialog-store";
 import Link from "next/link";
 import { toast } from "sonner";
 
@@ -54,6 +56,7 @@ export default function ProjectsPage() {
   const [domainId, setDomainId] = useState<string | null>(null);
   const [domains, setDomains] = useState<{ id: string; name: string }[]>([]);
   const [createOpen, setCreateOpen] = useState(false);
+  const { open: storeOpen, openCreate, closeCreate } = useCreateDialogStore();
   const [editProject, setEditProject] = useState<Project | null>(null);
   const [archiveProject, setArchiveProject] = useState<Project | null>(null);
   const [archiving, setArchiving] = useState(false);
@@ -119,7 +122,7 @@ export default function ProjectsPage() {
               ))}
             </select>
           )}
-          <Button onClick={() => setCreateOpen(true)}>
+          <Button onClick={() => { setCreateOpen(true); openCreate('project'); }}>
             <Plus className="mr-2 h-4 w-4" aria-hidden="true" />
             New project
           </Button>
@@ -220,11 +223,19 @@ export default function ProjectsPage() {
 
       <ProjectCreateDialog
         open={createOpen}
-        onOpenChange={setCreateOpen}
+        onOpenChange={(o) => { setCreateOpen(o); if (!o) closeCreate(); }}
         domainId={domainId || ''}
         onCreated={fetchProjects}
       />
 
+      {/* Global CreateItemDialog from useCreateDialogStore — opened by topbar 'New project' button */}
+      <CreateItemDialog
+        type="project"
+        open={storeOpen}
+        onOpenChange={(o) => { if (!o) closeCreate(); else openCreate('project'); }}
+        onCreated={fetchProjects}
+      />
+
       {editProject && (
         <ProjectEditDialog
           open={!!editProject}