* Extract out ShareHover components * Refactor hover/category state * Rename photo query options types * Restore category count slice of app state * Streamline entity hover headers * Standardize swr keys * Suppress hover counts to years * Refine entity hover design * Make image hovers opt out
61 lines
1.5 KiB
TypeScript
61 lines
1.5 KiB
TypeScript
'use client';
|
|
|
|
import { Photo, PhotoDateRange } from '@/photo';
|
|
import PhotoHeader from '@/photo/PhotoHeader';
|
|
import PhotoRecipe from './PhotoRecipe';
|
|
import { useAppState } from '@/app/AppState';
|
|
import { descriptionForRecipePhotos, getRecipePropsFromPhotos } from '.';
|
|
import { AI_TEXT_GENERATION_ENABLED } from '@/app/config';
|
|
import { useAppText } from '@/i18n/state/client';
|
|
|
|
export default function RecipeHeader({
|
|
recipe,
|
|
photos,
|
|
selectedPhoto,
|
|
indexNumber,
|
|
count,
|
|
dateRange,
|
|
}: {
|
|
recipe: string
|
|
photos: Photo[]
|
|
selectedPhoto?: Photo
|
|
indexNumber?: number
|
|
count?: number
|
|
dateRange?: PhotoDateRange
|
|
}) {
|
|
const { recipeModalProps, setRecipeModalProps } = useAppState();
|
|
|
|
const appText = useAppText();
|
|
|
|
const recipeProps = getRecipePropsFromPhotos(photos, selectedPhoto);
|
|
|
|
return (
|
|
<PhotoHeader
|
|
recipe={recipe}
|
|
entity={<PhotoRecipe
|
|
recipe={recipe}
|
|
contrast="high"
|
|
showHover={false}
|
|
isShowingRecipeOverlay={Boolean(recipeModalProps)}
|
|
toggleRecipeOverlay={recipeProps
|
|
? () => setRecipeModalProps?.(recipeProps)
|
|
: undefined}
|
|
/>}
|
|
entityDescription={descriptionForRecipePhotos(
|
|
photos,
|
|
appText,
|
|
undefined,
|
|
count,
|
|
dateRange,
|
|
)}
|
|
photos={photos}
|
|
selectedPhoto={selectedPhoto}
|
|
indexNumber={indexNumber}
|
|
count={count}
|
|
dateRange={dateRange}
|
|
hasAiTextGeneration={AI_TEXT_GENERATION_ENABLED}
|
|
includeShareButton
|
|
/>
|
|
);
|
|
}
|