ZO62AO2GDHIMVT2KFXCG6MOL3LPGM6QSSQ2MXXG33E6HO6YSE6IAC I27QGYUJ66RJXCXQPY2MMSODRGL3SB7KO4UOGQSK2WRFG7LG23GAC 3LWMCLGHSCYSYGDX3J6PRIRO52SBWFC5KXNLPOAFZWEKJJYGOWGAC XTU6PGJEQEQ4WLCZDUQPDBB3H3JST4NO7QBPYJ3ZMKTZ4QH3U3OAC POIBWSL3JFHT2KN3STFSJX3INSYKEJTX6KSW3N7BVEKWX2GJ6T7QC M4UG5FMI5ICQRLJCCNSLV3ZKCGIXDQ65ECJM4PBE3NZYHT3CJLDAC GDEZHFJTAHWBJGQ3UD6DAZNWORGIR5RV6VM3IURGL3R7OGXSNFMAC HBM7XFBGVMKW3P3VZFNQTJMINZ4DC3D4TZMT4TPTJRXC62HKZMMQC XEXJLBOH6HQAUZRUNH3CCPNUD4HRNCKMRZ5UJ6UUCO76KV6WUJAAC ROQGXQWL2V363K3W7TVVYKIAX4N4IWRERN5BJ7NYJRRVB6OMIJ4QC setFormError(err instanceof Error ? err.message : `Failed to ${isEditMode ? 'update' : 'create'} cluster`);console.error(`Error ${isEditMode ? 'updating' : 'creating'} cluster:`, err);
setFormError(err instanceof Error? err.message: `Failed to ${isEditMode ? "update" : "create"} cluster`,);console.error(`Error ${isEditMode ? "updating" : "creating"} cluster:`,err,);
const handleFormChange = (field: keyof typeof formData, value: string | boolean) => {setFormData(prev => ({
const handleFormChange = (field: keyof typeof formData,value: string | boolean,) => {setFormData((prev) => ({
recordS: cluster.recordingPattern ? String(cluster.recordingPattern.recordS) : '',sleepS: cluster.recordingPattern ? String(cluster.recordingPattern.sleepS) : ''
recordS: cluster.recordingPattern? String(cluster.recordingPattern.recordS): "",sleepS: cluster.recordingPattern? String(cluster.recordingPattern.sleepS): "",
const confirmDelete = window.confirm(`Are you sure you want to delete "${cluster.name}"? This will soft delete the cluster and remove any recording pattern.`);
const confirmDelete = window.confirm(`Are you sure you want to delete "${cluster.name}"? This will soft delete the cluster and remove any recording pattern.`,);
{isAuthenticated && !authLoading && canCreateClusters && (<div className="flex justify-between items-center mb-4"><h2 className="text-lg font-semibold">Clusters</h2>
<div className="flex justify-between items-center mb-4"><h2 className="text-lg font-semibold">Clusters</h2>{isAuthenticated && !authLoading && canCreateClusters && (
{loading && <div className="py-4 text-center text-gray-500">Loading clusters...</div>}
{error && (<div className="p-4 bg-red-50 text-red-700 rounded-md mb-4"><p className="font-medium">Error loading clusters</p><p className="text-sm mt-1">{error}</p></div>)}
{error && (<div className="p-4 bg-red-50 text-red-700 rounded-md mb-4"><p className="font-medium">Error loading clusters</p><p className="text-sm mt-1">{error}</p></div>)}{!loading && !error && clusters.length > 0 && (<div className="w-full overflow-visible"><Table><TableHeader className="bg-muted"><TableRow className="border-b-2 border-primary/20"><TableHead className="w-[180px] py-3 font-bold text-sm uppercase">Cluster</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Description</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Timezone</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Sample Rate</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Record:Sleep</TableHead>{canCreateClusters && (<TableHead className="w-[120px] py-3 font-bold text-sm uppercase text-center">Actions</TableHead>)}</TableRow></TableHeader><TableBody>{clusters.map((cluster) => {console.log('Rendering cluster:', cluster.id, cluster.name);return (<TableRowkey={cluster.id}className={onClusterSelect ? "hover:bg-primary/5" : ""}><TableCellclassName={`font-medium whitespace-normal break-words ${onClusterSelect ? 'cursor-pointer' : ''}`}onClick={() => {console.log('Cluster clicked:', cluster.id);if (onClusterSelect) {onClusterSelect(cluster.id, cluster.name);}}}>{cluster.name}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? 'cursor-pointer' : ''}`}onClick={() => onClusterSelect && onClusterSelect(cluster.id, cluster.name)}>{cluster.description || "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? 'cursor-pointer' : ''}`}onClick={() => onClusterSelect && onClusterSelect(cluster.id, cluster.name)}>{cluster.timezoneId || "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? 'cursor-pointer' : ''}`}onClick={() => onClusterSelect && onClusterSelect(cluster.id, cluster.name)}>{cluster.sampleRate ? `${cluster.sampleRate} Hz` : "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? 'cursor-pointer' : ''}`}onClick={() => onClusterSelect && onClusterSelect(cluster.id, cluster.name)}>{cluster.recordingPattern? (`${Math.round(cluster.recordingPattern.recordS)}:${Math.round(cluster.recordingPattern.sleepS)}`): ("—")}</TableCell>
{!loading && !error && clusters.length > 0 && (<div className="w-full overflow-visible"><Table><TableHeader className="bg-muted"><TableRow className="border-b-2 border-primary/20"><TableHead className="w-[180px] py-3 font-bold text-sm uppercase">Cluster</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Description</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Timezone</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Sample Rate</TableHead><TableHead className="py-3 font-bold text-sm uppercase">Record:Sleep</TableHead>
<TableCell className="text-center"><div className="flex justify-center gap-2"><ButtononClick={(e) => {e.stopPropagation();handleEditCluster(cluster);}}variant="ghost"size="sm"className="p-1 h-8 w-8"title="Edit cluster"><Edit className="h-4 w-4" /></Button><ButtononClick={(e) => {e.stopPropagation();void handleDeleteCluster(cluster).catch(console.error);}}variant="ghost"size="sm"className="p-1 h-8 w-8 text-red-600 hover:text-red-700 hover:bg-red-50"title="Delete cluster"><Trash2 className="h-4 w-4" /></Button></div></TableCell>
<TableHead className="w-[120px] py-3 font-bold text-sm uppercase text-center">Actions</TableHead>
);})}</TableBody></Table></div>)}
</TableHeader><TableBody>{clusters.map((cluster) => {console.log("Rendering cluster:", cluster.id, cluster.name);return (<TableRowkey={cluster.id}className={onClusterSelect ? "hover:bg-primary/5" : ""}><TableCellclassName={`font-medium whitespace-normal break-words ${onClusterSelect ? "cursor-pointer" : ""}`}onClick={() => {console.log("Cluster clicked:", cluster.id);if (onClusterSelect) {onClusterSelect(cluster.id, cluster.name);}}}>{cluster.name}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? "cursor-pointer" : ""}`}onClick={() =>onClusterSelect &&onClusterSelect(cluster.id, cluster.name)}>{cluster.description || "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? "cursor-pointer" : ""}`}onClick={() =>onClusterSelect &&onClusterSelect(cluster.id, cluster.name)}>{cluster.timezoneId || "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? "cursor-pointer" : ""}`}onClick={() =>onClusterSelect &&onClusterSelect(cluster.id, cluster.name)}>{cluster.sampleRate ? `${cluster.sampleRate} Hz` : "—"}</TableCell><TableCellclassName={`whitespace-normal break-words ${onClusterSelect ? "cursor-pointer" : ""}`}onClick={() =>onClusterSelect &&onClusterSelect(cluster.id, cluster.name)}>{cluster.recordingPattern? `${Math.round(cluster.recordingPattern.recordS)}:${Math.round(cluster.recordingPattern.sleepS)}`: "—"}</TableCell>{canCreateClusters && (<TableCell className="text-center"><div className="flex justify-center gap-2"><ButtononClick={(e) => {e.stopPropagation();handleEditCluster(cluster);}}variant="ghost"size="sm"className="p-1 h-8 w-8"title="Edit cluster"><Edit className="h-4 w-4" /></Button><ButtononClick={(e) => {e.stopPropagation();void handleDeleteCluster(cluster).catch(console.error,);}}variant="ghost"size="sm"className="p-1 h-8 w-8 text-red-600 hover:text-red-700 hover:bg-red-50"title="Delete cluster"><Trash2 className="h-4 w-4" /></Button></div></TableCell>)}</TableRow>);})}</TableBody></Table></div>)}
{!loading && !error && clusters.length === 0 && (<div className="p-4 bg-yellow-50 text-yellow-800 rounded-md"><p className="font-medium">No clusters found for this location</p></div>)}
{!loading && !error && clusters.length === 0 && (<div className="p-4 bg-yellow-50 text-yellow-800 rounded-md"><p className="font-medium">No clusters found for this location</p></div>)}