JohnCosta27/Haystack
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

feat(cards): adjusting for backend data types

Browse Source
This commit is contained in:
John Costa
2025-03-31 17:49:17 +00:00
parent c817654f3e
commit c609b45d99
4 changed files with 43 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/components/search-card/SearchCardEvent.tsx
View File

@@ -1,10 +1,10 @@
import { Separator } from "@kobalte/core/separator";
import { IconCalendar } from "@tabler/icons-solidjs";
import type { Event } from "../../network/types";
import type { UserImage } from "../../network";
type Props = {
item: Event;
item: Extract<UserImage, { type: "event" }>;
};
export const SearchCardEvent = ({ item }: Props) => {
@@ -13,12 +13,12 @@ export const SearchCardEvent = ({ item }: Props) => {
return (
<div class="absolute inset-0 p-3 bg-purple-50">
<div class="grid grid-cols-[auto_20px] gap-1 mb-1">
<p class="text-sm text-neutral-900 font-bold">{data.title}</p>
<p class="text-sm text-neutral-900 font-bold">{data.Name}</p>
<IconCalendar size={20} class="text-neutral-500 mt-1" />
</div>
<p class="text-xs text-neutral-500">
Organized by {data.organizer.name} on{" "}
{new Date(data.dateTime.start).toLocaleDateString("en-US", {
Organized by TODO on{" "}
{new Date(data.StartDateTime).toLocaleDateString("en-US", {
month: "long",
day: "numeric",
year: "numeric",
@@ -26,7 +26,7 @@ export const SearchCardEvent = ({ item }: Props) => {
</p>
<Separator class="my-2" />
<p class="text-xs text-neutral-500 line-clamp-2 overflow-hidden">
{data.description}
{data.Description}
</p>
</div>
);

10
frontend/src/components/search-card/SearchCardLocation.tsx
View File

@@ -1,10 +1,10 @@
import { Separator } from "@kobalte/core/separator";
import { IconMapPin } from "@tabler/icons-solidjs";
import type { Location } from "../../network/types";
import type { UserImage } from "../../network";
type Props = {
item: Location;
item: Extract<UserImage, { type: "location" }>;
};
export const SearchCardLocation = ({ item }: Props) => {
@@ -13,13 +13,13 @@ export const SearchCardLocation = ({ item }: Props) => {
return (
<div class="absolute inset-0 p-3 bg-red-50">
<div class="grid grid-cols-[auto_20px] gap-1 mb-1">
<p class="text-sm text-neutral-900 font-bold">{data.name}</p>
<p class="text-sm text-neutral-900 font-bold">{data.Name}</p>
<IconMapPin size={20} class="text-neutral-500 mt-1" />
</div>
<p class="text-xs text-neutral-500">{data.address}</p>
<p class="text-xs text-neutral-500">{data.Address}</p>
<Separator class="my-2" />
<p class="text-xs text-neutral-500 line-clamp-2 overflow-hidden">
{data.description}
{data.Description}
</p>
</div>
);