soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Fix TypeScript typecheck errors
Some checks failed
linter / quality (push) Has been cancelled
Details
tests / ci (push) Has been cancelled
Details
tests / ui (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Codex Agent
2026-01-30 15:56:06 +01:00
parent 916b204688
commit b1f9f7cee0
42 changed files with 324 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
resources/js/guest/components/FiltersBar.tsx
View File

@@ -1,16 +1,17 @@
import React from 'react';
import { cn } from '@/lib/utils';
import { Sparkles, Flame, UserRound, Camera } from 'lucide-react';
import type { LucideIcon } from 'lucide-react';
import { useTranslation } from '../i18n/useTranslation';
export type GalleryFilter = 'latest' | 'popular' | 'mine' | 'photobooth';
type FilterConfig = Array<{ value: GalleryFilter; labelKey: string; icon: React.ReactNode }>;
type FilterConfig = Array<{ value: GalleryFilter; labelKey: string; icon: LucideIcon }>;
const baseFilters: FilterConfig = [
{ value: 'latest', labelKey: 'galleryPage.filters.latest', icon: <Sparkles className="h-4 w-4" aria-hidden /> },
{ value: 'popular', labelKey: 'galleryPage.filters.popular', icon: <Flame className="h-4 w-4" aria-hidden /> },
{ value: 'mine', labelKey: 'galleryPage.filters.mine', icon: <UserRound className="h-4 w-4" aria-hidden /> },
{ value: 'latest', labelKey: 'galleryPage.filters.latest', icon: Sparkles },
{ value: 'popular', labelKey: 'galleryPage.filters.popular', icon: Flame },
{ value: 'mine', labelKey: 'galleryPage.filters.mine', icon: UserRound },
];
export default function FiltersBar({
@@ -29,7 +30,7 @@ export default function FiltersBar({
const { t } = useTranslation();
const filters: FilterConfig = React.useMemo(
() => (showPhotobooth
? [...baseFilters, { value: 'photobooth', labelKey: 'galleryPage.filters.photobooth', icon: <Camera className="h-4 w-4" aria-hidden /> }]
? [...baseFilters, { value: 'photobooth', labelKey: 'galleryPage.filters.photobooth', icon: Camera }]
: baseFilters),
[showPhotobooth],
);
@@ -45,6 +46,7 @@ export default function FiltersBar({
<div className="inline-flex items-center rounded-full border border-border/70 bg-white/80 p-1 shadow-sm backdrop-blur dark:border-white/10 dark:bg-slate-950/70">
{filters.map((filter, index) => {
const isActive = value === filter.value;
const Icon = filter.icon;
return (
<div key={filter.value} className="flex items-center">
<button
@@ -57,7 +59,7 @@ export default function FiltersBar({
: 'text-muted-foreground hover:bg-pink-50 hover:text-pink-600 dark:text-white/70 dark:hover:bg-white/10 dark:hover:text-white',
)}
>
{React.cloneElement(filter.icon as React.ReactElement, { className: 'h-3.5 w-3.5' })}
<Icon className="h-3.5 w-3.5" aria-hidden />
<span className="whitespace-nowrap">{t(filter.labelKey)}</span>
</button>
{index < filters.length - 1 && (