refactor: implement session checking utility, enhance device queries with session validation, and improve UI interactions for device management

components/clickable-row.tsx

@@ -19,9 +19,13 @@ export default function ClickableRow({
 		<TableRow
 			key={device.id}
 			className={cn(
-				parentalControl === false && "cursor-pointer hover:bg-muted",
+				(parentalControl === false && device.blocked) || device.is_active
+					? "cursor-not-allowed title-bg"
+					: "cursor-pointer hover:bg-muted",
 			)}
 			onClick={() => {
+				if (device.blocked) return;
+				if (device.is_active === true) return;
 				if (parentalControl === true) return;
 				setDeviceCart((prev) =>
 					devices.some((d) => d.id === device.id)
@@ -33,7 +37,10 @@ export default function ClickableRow({
 			<TableCell>
 				<div className="flex flex-col items-start">
 					<Link
-						className="font-medium hover:underline"
+						className={cn(
+							"hover:underline font-semibold",
+							device.is_active ? "text-green-600" : "",
+						)}
 						href={`/devices/${device.id}`}
 						onClick={(e) => e.stopPropagation()}
 					>
@@ -49,7 +56,7 @@ export default function ClickableRow({
 							})}
 						</span>
 					) : (
-						<p>Inactive</p>
+						<p className="text-muted-foreground">Device Inactive</p>
 					)}
 
 					{device.blocked_by === "ADMIN" && device.blocked && (