From f1b85bf2946cf5515c1073ac7fdb86871817e78d Mon Sep 17 00:00:00 2001
From: "groombook-cto[bot]"
 <269737991+groombook-cto[bot]@users.noreply.github.com>
Date: Sat, 28 Mar 2026 08:24:32 +0000
Subject: [PATCH] fix(portal): disable non-functional stub buttons in customer
 portal (#142)

All CI checks pass. Verified on groombook.dev.farh.net. Second approval from groombook-ceo[bot] per GRO-171.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 .../src/portal/sections/AccountSettings.tsx    | 18 +++++++++++++++---
 apps/web/src/portal/sections/Appointments.tsx  |  6 +++++-
 apps/web/src/portal/sections/Dashboard.tsx     | 18 +++++++++++++++---
 apps/web/src/portal/sections/PetProfiles.tsx   |  4 ++--
 4 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/apps/web/src/portal/sections/AccountSettings.tsx b/apps/web/src/portal/sections/AccountSettings.tsx
index 2377023..8b5e9a3 100644
--- a/apps/web/src/portal/sections/AccountSettings.tsx
+++ b/apps/web/src/portal/sections/AccountSettings.tsx
@@ -125,10 +125,18 @@ function ManagePets({ readOnly }: { readOnly: boolean }) {
           </div>
           {!readOnly && (
             <div className="flex gap-2">
-              <button className="px-3 py-1.5 border border-stone-200 rounded-lg text-xs text-stone-600 hover:bg-stone-50">
+              <button
+                disabled
+                title="Pet editing coming soon"
+                className="px-3 py-1.5 border border-stone-200 rounded-lg text-xs text-stone-400 cursor-not-allowed"
+              >
                 Edit
               </button>
-              <button className="p-1.5 border border-stone-200 rounded-lg text-stone-400 hover:text-amber-600 hover:border-amber-200">
+              <button
+                disabled
+                title="Pet archiving coming soon"
+                className="p-1.5 border border-stone-200 rounded-lg text-stone-300 cursor-not-allowed"
+              >
                 <Archive size={14} />
               </button>
             </div>
@@ -136,7 +144,11 @@ function ManagePets({ readOnly }: { readOnly: boolean }) {
         </div>
       ))}
       {!readOnly && (
-        <button className="w-full flex items-center justify-center gap-2 py-3 border-2 border-dashed border-stone-300 rounded-2xl text-sm text-stone-500 hover:border-(--color-accent) hover:text-(--color-accent-dark) transition-colors">
+        <button
+          disabled
+          title="Adding pets coming soon"
+          className="w-full flex items-center justify-center gap-2 py-3 border-2 border-dashed border-stone-300 rounded-2xl text-sm text-stone-400 cursor-not-allowed"
+        >
           <Plus size={16} />
           Add New Pet
         </button>
diff --git a/apps/web/src/portal/sections/Appointments.tsx b/apps/web/src/portal/sections/Appointments.tsx
index 04c2bc1..4277bfc 100644
--- a/apps/web/src/portal/sections/Appointments.tsx
+++ b/apps/web/src/portal/sections/Appointments.tsx
@@ -176,7 +176,11 @@ function AppointmentCard({
           )}
           {appt.status !== "completed" && appt.status !== "cancelled" && !readOnly && (
             <div className="flex gap-2 mt-3">
-              <button className="text-xs px-3 py-1.5 border border-stone-200 rounded-lg text-stone-600 hover:bg-stone-50">
+              <button
+                disabled
+                title="Rescheduling coming soon"
+                className="text-xs px-3 py-1.5 border border-stone-200 rounded-lg text-stone-400 cursor-not-allowed"
+              >
                 Reschedule
               </button>
               <CancelAppointmentButton appointment={appt} sessionId={sessionId} />
diff --git a/apps/web/src/portal/sections/Dashboard.tsx b/apps/web/src/portal/sections/Dashboard.tsx
index 2f82cc7..289d1c7 100644
--- a/apps/web/src/portal/sections/Dashboard.tsx
+++ b/apps/web/src/portal/sections/Dashboard.tsx
@@ -77,13 +77,25 @@ export function Dashboard({ onNavigate, readOnly }: Props) {
           </div>
           {!readOnly && (
             <div className="flex gap-2 mt-4">
-              <button className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-600 hover:bg-stone-50">
+              <button
+                disabled
+                title="Rescheduling coming soon"
+                className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-400 cursor-not-allowed"
+              >
                 Reschedule
               </button>
-              <button className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-600 hover:bg-stone-50">
+              <button
+                disabled
+                title="Cancellation coming soon"
+                className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-400 cursor-not-allowed"
+              >
                 Cancel
               </button>
-              <button className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-600 hover:bg-stone-50">
+              <button
+                disabled
+                title="Notes coming soon"
+                className="text-sm px-3 py-1.5 border border-stone-200 rounded-lg text-stone-400 cursor-not-allowed"
+              >
                 Add Notes
               </button>
             </div>
diff --git a/apps/web/src/portal/sections/PetProfiles.tsx b/apps/web/src/portal/sections/PetProfiles.tsx
index 3f10d20..5496534 100644
--- a/apps/web/src/portal/sections/PetProfiles.tsx
+++ b/apps/web/src/portal/sections/PetProfiles.tsx
@@ -54,8 +54,8 @@ export function PetProfiles({ readOnly }: Props) {
             <p className="text-stone-400 text-xs mt-0.5">Born {new Date(pet.dob).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" })}</p>
           </div>
           {!readOnly && (
-            <button className="p-2 hover:bg-stone-50 rounded-lg">
-              <Edit3 size={16} className="text-stone-400" />
+            <button disabled title="Pet editing coming soon" className="p-2 rounded-lg cursor-not-allowed">
+              <Edit3 size={16} className="text-stone-300" />
             </button>
           )}
         </div>