eric/gitlab-instance-0a899031_salon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

's'

Browse Source
This commit is contained in:
eric
2026-03-16 20:08:21 -05:00
parent e30d4ad950
commit c93eb7b2ee
11 changed files with 314 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app/components/SessionCard.tsx
View File

@@ -1,8 +1,8 @@
"use client";
import { useEffect, useState } from "react";
import Image from "next/image";
import Link from "next/link";
import { RefreshCw, Coffee } from "lucide-react";
import SessionCoverImage from "./SessionCoverImage";
import AddressLink from "./AddressLink";
import { getSessionsWithDates, ACTIVITY_TYPES, SESSION_TAGS, RECENT_JOINERS } from "@/config/home.config";
@@ -31,23 +31,17 @@ interface SessionItem {
export default function SessionCard({
session,
index,
stats,
}: {
session: SessionItem;
index: number;
stats: JoinStats | null;
}) {
const [stats, setStats] = useState<JoinStats | null>(null);
useEffect(() => {
fetch("/api/join/stats")
.then((r) => r.json())
.then((d) => d?.stats?.[session.id] && setStats(d.stats[session.id]))
.catch(() => {});
}, [session.id]);
return (
<Link
href={`/join?session=${encodeURIComponent(session.id)}`}
className="group flex flex-col sm:flex-row gap-3 sm:gap-4 p-4 sm:p-5 rounded-xl sm:rounded-2xl bg-white dark:bg-stone-900/80 border border-stone-200/80 dark:border-stone-700/80 hover:border-amber-200 dark:hover:border-amber-900/50 hover:shadow-lg hover:shadow-amber-900/5 transition-all"
className="group flex flex-col sm:flex-row gap-3 sm:gap-4 p-4 sm:p-5 rounded-xl sm:rounded-2xl bg-white dark:bg-stone-900/80 border border-stone-200/80 dark:border-stone-700/80 hover:border-amber-200 dark:hover:border-amber-900/50 hover:shadow-lg hover:shadow-amber-900/5 hover:-translate-y-0.5 transition-all duration-200 ease-out"
>
<div className="relative w-full sm:w-32 sm:min-w-[128px] shrink-0 aspect-[16/10] rounded-lg sm:rounded-xl overflow-hidden bg-stone-100 dark:bg-stone-800">
{session.coverImage ? (
@@ -60,8 +54,8 @@ export default function SessionCard({
className="object-cover"
/>
) : (
<div className="absolute inset-0 flex items-center justify-center text-2xl">
{session.type === "skill-exchange" ? "🔄" : "☕"}
<div className="absolute inset-0 flex items-center justify-center text-amber-500/70 dark:text-amber-400/50">
{session.type === "skill-exchange" ? <RefreshCw className="size-8" aria-hidden /> : <Coffee className="size-8" aria-hidden />}
</div>
)}
</div>