Files
cms-server/client/cms/src/components/events/event-grid.container.tsx
2026-02-07 17:05:54 +08:00

60 lines
1.9 KiB
TypeScript

import type { EventInfo } from './types';
import PlaceholderImage from '@/assets/event-placeholder.png';
import { useGetEvents } from '@/hooks/data/useGetEvents';
import { Button } from '../ui/button';
import { DialogTrigger } from '../ui/dialog';
import { EventGridSkeleton } from './event-grid.skeleton';
import { EventGridView } from './event-grid.view';
import { EventJoinContainer } from './event-join.dialog.container';
import { KycDialogContainer } from './kyc/kyc.dialog.container';
function JoinButton() {
return (
<Button className="w-full"></Button>
);
}
export function EventGridContainer() {
const { data, isLoading } = useGetEvents();
return (
isLoading
? <EventGridSkeleton />
: (
<EventGridView
events={data.pages.flatMap(page => page.data ?? []).map(it => ({
type: it.type! as EventInfo['type'],
eventId: it.event_id!,
isJoined: it.is_joined!,
requireKyc: it.enable_kyc!,
coverImage: it.thumbnail! || PlaceholderImage,
eventName: it.name!,
description: it.description!,
startTime: new Date(it.start_time!),
endTime: new Date(it.end_time!),
} satisfies EventInfo))}
footer={eventInfo => (eventInfo.isJoined
? <Button className="w-full" disabled></Button>
: (
eventInfo.requireKyc
? (
<KycDialogContainer event={eventInfo}>
<DialogTrigger asChild>
<JoinButton />
</DialogTrigger>
</KycDialogContainer>
)
: (
<EventJoinContainer event={eventInfo}>
<DialogTrigger asChild>
<JoinButton />
</DialogTrigger>
</EventJoinContainer>
)
)
)}
/>
)
);
}