49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useParams } from "next/navigation";
|
|
import { Card } from "@/components/ui/card";
|
|
import { Header } from "@/components/header";
|
|
import { ControllerProfile } from "@/components/controller-profile";
|
|
|
|
export default function ControllerProfilePage() {
|
|
const params = useParams();
|
|
const [sessions, setSessions] = useState<any[]>([]);
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
useEffect(() => {
|
|
async function loadControllerData() {
|
|
try {
|
|
const response = await fetch(`/api/controllers/${params.cid}`);
|
|
if (!response.ok) throw new Error('Failed to fetch controller data');
|
|
const data = await response.json();
|
|
setSessions(data);
|
|
} catch (error) {
|
|
console.error("Error fetching controller data:", error);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
|
|
loadControllerData();
|
|
}, [params.cid]);
|
|
|
|
const controllerName = sessions[0]?.name || params.cid;
|
|
|
|
return (
|
|
<main className="min-h-screen bg-gradient-to-b from-gray-50 to-gray-100 dark:from-gray-900 dark:to-gray-800">
|
|
<div className="container mx-auto px-4 py-8">
|
|
<div className="flex flex-col gap-8">
|
|
<Header
|
|
title={`Controller Profile: ${controllerName}`}
|
|
subtitle={`CID: ${params.cid}`}
|
|
/>
|
|
|
|
<Card className="overflow-hidden">
|
|
<ControllerProfile sessions={sessions} loading={loading} />
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
);
|
|
} |