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

feat: showing description on image page in frontend

Browse Source
This commit is contained in:
John Costa
2025-07-24 14:23:20 +01:00
parent 37f966e508
commit 0058cdce40
11 changed files with 18 additions and 649 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/components/search-card/SearchCard.tsx
View File

@@ -3,7 +3,6 @@ import type { UserImage } from "../../network";
import { SearchCardContact } from "./SearchCardContact";
import { SearchCardEvent } from "./SearchCardEvent";
import { SearchCardLocation } from "./SearchCardLocation";
import { SearchCardNote } from "./SearchCardNote";
const UnwrappedSearchCard = (props: { item: UserImage }) => {
const { item } = props;
@@ -13,8 +12,6 @@ const UnwrappedSearchCard = (props: { item: UserImage }) => {
return <SearchCardLocation item={item} />;
case "event":
return <SearchCardEvent item={item} />;
case "note":
return <SearchCardNote item={item} />;
case "contact":
return <SearchCardContact item={item} />;
default:

27
frontend/src/components/search-card/SearchCardNote.tsx
View File

@@ -1,27 +0,0 @@
import SolidjsMarkdown from "solidjs-markdown";
import { IconNote } from "@tabler/icons-solidjs";
import type { UserImage } from "../../network";
type Props = {
item: Extract<UserImage, { type: "note" }>;
};
export const SearchCardNote = ({ item }: Props) => {
const { data } = item;
return (
<div class="h-full inset-0 p-3 bg-green-50">
<div class="flex mb-1 items-center gap-1">
<IconNote size={14} class="text-neutral-500" />
<p class="text-xs text-neutral-500">Note</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">
<SolidjsMarkdown>{data.Content}</SolidjsMarkdown>
</p>
</div>
);
};

30
frontend/src/components/search-card/SearchCardReceipt.tsx
View File

@@ -1,30 +0,0 @@
import { Separator } from "@kobalte/core/separator";
import { IconReceipt } from "@tabler/icons-solidjs";
import type { Receipt } from "../../network/types";
type Props = {
item: Receipt;
};
export const SearchCardReceipt = ({ item }: Props) => {
const { data } = item;
return (
<div class="h-full inset-0 p-3 bg-yellow-50">
<div class="grid grid-cols-[auto_20px] gap-1 mb-1">
<p class="text-sm text-neutral-900 font-bold">
{data.orderNumber} - {data.vendor}
</p>
<IconReceipt size={20} class="text-neutral-500 mt-1" />
</div>
<p class="text-xs text-neutral-500">
{data.shippingAddress.address}
</p>
<Separator class="my-2" />
<p class="text-xs text-neutral-500 line-clamp-2 overflow-hidden">
{data.amount} {data.currency}
</p>
</div>
);
};

26
frontend/src/components/search-card/SearchCardWebsite.tsx
View File

@@ -1,26 +0,0 @@
import { Separator } from "@kobalte/core/separator";
import { IconLink } from "@tabler/icons-solidjs";
import type { Website } from "../../network/types";
type Props = {
item: Website;
};
export const SearchCardWebsite = ({ item }: Props) => {
const { data } = item;
return (
<div class="h-full inset-0 p-3 bg-blue-50">
<div class="grid grid-cols-[auto_20px] gap-1 mb-1">
<p class="text-sm text-neutral-900 font-bold">{data.title}</p>
<IconLink size={20} class="text-neutral-500 mt-1" />
</div>
<p class="text-xs text-neutral-500">{data.url}</p>
<Separator class="my-2" />
<p class="text-xs text-neutral-500 line-clamp-2 overflow-hidden">
{data.description}
</p>
</div>
);
};