my-project-public

repository

loading code, commits, and activity

repositories

loading repo index

#1	import { ArrowRight } from "lucide-react";
#2	import Categories from "@/components/shared/categories";
#3	import Link from "next/link";
#4	import { constants } from "@/components/shared/source-app";
#5	import Image from "next/image";
#6	interface MemoryCardProps {
#7	id: string;
#8	content: string;
#9	created_at: string;
#10	metadata?: Record<string, any>;
#11	categories?: string[];
#12	access_count?: number;
#13	app_name: string;
#14	state: string;
#15	}
#16
#17	export function MemoryCard({
#18	id,
#19	content,
#20	created_at,
#21	metadata,
#22	categories,
#23	access_count,
#24	app_name,
#25	state,
#26	}: MemoryCardProps) {
#27	return (
#28	<div className="rounded-lg border border-zinc-800 bg-zinc-900 overflow-hidden">
#29	<div className="p-4">
#30	<div className="border-l-2 border-primary pl-4 mb-4">
#31	<p
#32	className={`${state !== "active" ? "text-zinc-400" : "text-white"}`}
#33	>
#34	{content}
#35	</p>
#36	</div>
#37
#38	{metadata && Object.keys(metadata).length > 0 && (
#39	<div className="mb-4">
#40	<p className="text-xs text-zinc-500 uppercase mb-2">METADATA</p>
#41	<div className="bg-zinc-800 rounded p-3 text-zinc-400">
#42	<pre className="whitespace-pre-wrap">
#43	{JSON.stringify(metadata, null, 2)}
#44	</pre>
#45	</div>
#46	</div>
#47	)}
#48
#49	<div className="mb-2">
#50	<Categories
#51	categories={categories as any}
#52	isPaused={state !== "active"}
#53	/>
#54	</div>
#55
#56	<div className="flex justify-between items-center">
#57	<div className="flex items-center gap-2">
#58	<span className="text-zinc-400 text-sm">
#59	{access_count ? (
#60	<span className="relative top-1">
#61	Accessed {access_count} times
#62	</span>
#63	) : (
#64	new Date(created_at + "Z").toLocaleDateString("en-US", {
#65	year: "numeric",
#66	month: "short",
#67	day: "numeric",
#68	hour: "numeric",
#69	minute: "numeric",
#70	})
#71	)}
#72	</span>
#73
#74	{state !== "active" && (
#75	<span className="inline-block px-3 border border-yellow-600 text-yellow-600 font-semibold text-xs rounded-full bg-yellow-400/10 backdrop-blur-sm">
#76	{state === "paused" ? "Paused" : "Archived"}
#77	</span>
#78	)}
#79	</div>
#80
#81	{!app_name && (
#82	<Link
#83	href={`/memory/${id}`}
#84	className="hover:cursor-pointer bg-zinc-800 hover:bg-zinc-700 flex items-center px-3 py-1 text-sm rounded-lg text-white p-0 hover:text-white"
#85	>
#86	View Details
#87	<ArrowRight className="ml-2 h-4 w-4" />
#88	</Link>
#89	)}
#90	{app_name && (
#91	<div className="flex items-center gap-2">
#92	<div className="flex items-center gap-1 bg-zinc-700 px-3 py-1 rounded-lg">
#93	<span className="text-sm text-zinc-400">Created by:</span>
#94	<div className="w-5 h-5 rounded-full bg-zinc-700 flex items-center justify-center overflow-hidden">
#95	<Image
#96	src={
#97	constants[app_name as keyof typeof constants]
#98	?.iconImage \|\| ""
#99	}
#100	alt="OpenMemory"
#101	width={24}
#102	height={24}
#103	/>
#104	</div>
#105	<p className="text-sm text-zinc-100 font-semibold">
#106	{constants[app_name as keyof typeof constants]?.name}
#107	</p>
#108	</div>
#109	</div>
#110	)}
#111	</div>
#112	</div>
#113	</div>
#114	);
#115	}
#116

z6Mkq5mY3JWtxoxUobWcfNHm7AkRubgSWEZTkBVqZXJviFZ5/my-project-public