From 6542c06e02125abf4e49c8f6791c3526a14df09f Mon Sep 17 00:00:00 2001
From: neodk2004 <barac.daniel@gmail.com>
Date: Tue, 23 Jun 2026 05:58:57 +0200
Subject: [PATCH] fix: auto-set first pet on login, resize detail view, fix
 Clerk types

- Sidebar + MobileNav: auto-call setActivePet(pets[0]) when activePetId
  is null so Follow/reaction buttons work immediately after onboarding
- PostCard detail mode: reduce image max-h from 70dvh to 50dvh so the
  footer (paw + comment buttons) stays visible within the dialog
- ProfileTabs dialog: reduce max-h from 90dvh to 85dvh
- Auth pages: remove layout.logoPlacement and colorText (not in Clerk
  Variables type, caused Docker build failure)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/app/(auth)/log-in/[[...sign-in]]/page.tsx  | 3 ---
 src/app/(auth)/sign-up/[[...sign-up]]/page.tsx | 3 ---
 src/components/feed/PostCard.tsx               | 4 ++--
 src/components/layout/MobileNav.tsx            | 8 +++++++-
 src/components/layout/Sidebar.tsx              | 8 +++++++-
 src/components/profile/ProfileTabs.tsx         | 2 +-
 6 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/app/(auth)/log-in/[[...sign-in]]/page.tsx b/src/app/(auth)/log-in/[[...sign-in]]/page.tsx
index bf5ba23..c12b517 100644
--- a/src/app/(auth)/log-in/[[...sign-in]]/page.tsx
+++ b/src/app/(auth)/log-in/[[...sign-in]]/page.tsx
@@ -17,9 +17,6 @@ export default function LogInPage() {
       signUpUrl="/sign-up"
       forceRedirectUrl="/pets"
       appearance={{
-        layout: {
-          logoPlacement: "none",
-        },
         variables: {
           colorPrimary: "#F97316",
           colorBackground: "#FAFAFA",
diff --git a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx
index 6c2b357..3dff02d 100644
--- a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx
+++ b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx
@@ -17,9 +17,6 @@ export default function SignUpPage() {
       signInUrl="/log-in"
       forceRedirectUrl="/onboarding/pet"
       appearance={{
-        layout: {
-          logoPlacement: "none",
-        },
         variables: {
           colorPrimary: "#F97316",
           colorBackground: "#FAFAFA",
diff --git a/src/components/feed/PostCard.tsx b/src/components/feed/PostCard.tsx
index f52a3f3..0291bdf 100644
--- a/src/components/feed/PostCard.tsx
+++ b/src/components/feed/PostCard.tsx
@@ -335,7 +335,7 @@ export function PostCard({ post, onDeleted, variant = "feed" }: PostCardProps) {
                       <img
                         src={getMediaUrl(img.storageKey) ?? ""}
                         alt={currentCaption ?? `${pet.name}'s post`}
-                        className={variant === "detail" ? "w-full object-contain bg-black max-h-[70dvh]" : "w-full object-cover max-h-[560px]"}
+                        className={variant === "detail" ? "w-full object-contain bg-black max-h-[50dvh]" : "w-full object-cover max-h-[560px]"}
                       />
                     </CarouselItem>
                   ))}
@@ -372,7 +372,7 @@ export function PostCard({ post, onDeleted, variant = "feed" }: PostCardProps) {
               <img
                 src={getMediaUrl(images[0].storageKey) ?? ""}
                 alt={currentCaption ?? `${pet.name}'s post`}
-                className={variant === "detail" ? "max-w-full max-h-[70dvh] object-contain" : "w-full object-cover max-h-[560px]"}
+                className={variant === "detail" ? "max-w-full max-h-[50dvh] object-contain" : "w-full object-cover max-h-[560px]"}
               />
             </div>
           )}
diff --git a/src/components/layout/MobileNav.tsx b/src/components/layout/MobileNav.tsx
index 8b6923f..328662b 100644
--- a/src/components/layout/MobileNav.tsx
+++ b/src/components/layout/MobileNav.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import Link from "next/link";
 import { usePathname, useRouter } from "next/navigation";
 import {
@@ -60,6 +60,12 @@ export function MobileNav({ pets }: MobileNavProps) {
   const activePet = pets.find((p) => p.id === activePetId) ?? pets[0];
   const [postTypeSheetOpen, setPostTypeSheetOpen] = useState(false);
 
+  useEffect(() => {
+    if (!activePetId && pets.length > 0) {
+      setActivePet(pets[0].id);
+    }
+  }, [activePetId, pets, setActivePet]);
+
   // D-05: Home → /feed; also highlight when on / (which redirects to /feed)
   const isHomePage = pathname === "/feed" || pathname === "/";
   const isPetsPage = pathname.startsWith("/pets");
diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx
index 3d4e199..95683b8 100644
--- a/src/components/layout/Sidebar.tsx
+++ b/src/components/layout/Sidebar.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import Link from "next/link";
 import { usePathname, useRouter } from "next/navigation";
 import {
@@ -79,6 +79,12 @@ export function Sidebar({ pets }: SidebarProps) {
   const activePet = pets.find((p) => p.id === activePetId) ?? pets[0];
   const [postTypeSheetOpen, setPostTypeSheetOpen] = useState(false);
 
+  useEffect(() => {
+    if (!activePetId && pets.length > 0) {
+      setActivePet(pets[0].id);
+    }
+  }, [activePetId, pets, setActivePet]);
+
   return (
     <nav className="hidden lg:flex flex-col w-[240px] h-screen sticky top-0 bg-card border-r border shrink-0 overflow-y-auto">
       {/* Wordmark */}
diff --git a/src/components/profile/ProfileTabs.tsx b/src/components/profile/ProfileTabs.tsx
index 2175302..643440c 100644
--- a/src/components/profile/ProfileTabs.tsx
+++ b/src/components/profile/ProfileTabs.tsx
@@ -121,7 +121,7 @@ export function ProfileTabs({ petId }: ProfileTabsProps) {
       <Dialog open={!!selectedPost} onOpenChange={(open) => { if (!open) setSelectedPost(null); }}>
         <DialogContent
           showCloseButton={false}
-          className="max-w-[560px] w-full p-0 overflow-y-auto max-h-[90dvh] rounded-xl"
+          className="max-w-[560px] w-full p-0 overflow-y-auto max-h-[85dvh] rounded-xl"
         >
           {selectedPost && (
             <PostCard