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>
This commit is contained in:
1 parent
f7183f93c7
commit
6542c06e02
6 files changed
+17
-11
No files matched your search
@@ -17,9 +17,6 @@ export default function LogInPage() {
|
||||
signUpUrl="/sign-up"
|
||||
forceRedirectUrl="/pets"
|
||||
appearance={{
|
||||
layout: {
|
||||
logoPlacement: "none",
|
||||
},
|
||||
variables: {
|
||||
colorPrimary: "#F97316",
|
||||
colorBackground: "#FAFAFA",
|
||||
|
||||
@@ -17,9 +17,6 @@ export default function SignUpPage() {
|
||||
signInUrl="/log-in"
|
||||
forceRedirectUrl="/onboarding/pet"
|
||||
appearance={{
|
||||
layout: {
|
||||
logoPlacement: "none",
|
||||
},
|
||||
variables: {
|
||||
colorPrimary: "#F97316",
|
||||
colorBackground: "#FAFAFA",
|
||||
|
||||
@@ -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>
|
||||
)}
|
||||
|
||||
@@ -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");
|
||||
|
||||
@@ -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 */}
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in new issue
Block a user