33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
import { IconCalendar } from "@tabler/icons-solidjs";
|
|
import type { UserImage } from "../../network";
|
|
|
|
type Props = {
|
|
item: Extract<UserImage, { type: "event" }>;
|
|
};
|
|
|
|
export const SearchCardEvent = ({ item }: Props) => {
|
|
const { data } = item;
|
|
|
|
return (
|
|
<div class="inset-0 p-3 bg-purple-50">
|
|
<div class="flex mb-1 items-center gap-1">
|
|
<IconCalendar size={14} class="text-neutral-500" />
|
|
<p class="text-xs text-neutral-500">Event</p>
|
|
</div>
|
|
<p class="text-sm text-neutral-900 font-bold mb-1">
|
|
{data.Name.length > 0 ? data.Name : "Unknown 🐞"}
|
|
</p>
|
|
<p class="text-xs text-neutral-700">
|
|
Organized by {data.Organizer?.Name ?? "unknown"} on{" "}
|
|
{data.StartDateTime
|
|
? new Date(data.StartDateTime).toLocaleDateString("en-US", {
|
|
month: "long",
|
|
day: "numeric",
|
|
year: "numeric",
|
|
})
|
|
: "unknown date"}
|
|
</p>
|
|
</div>
|
|
);
|
|
};
|