Make expired tokens more visibles

virtweb_frontend/src/api/TokensApi.ts

@@ -1,3 +1,4 @@
+import { time } from "../utils/DateUtils";
 import { APIClient } from "./ApiClient";
 
 export type RightVerb = "POST" | "GET" | "PUT" | "DELETE" | "PATCH";
@@ -23,6 +24,11 @@ export function APITokenURL(t: APIToken, edit: boolean = false): string {
   return `/token/${t.id}${edit ? "/edit" : ""}`;
 }
 
+export function ExpiredAPIToken(t: APIToken): boolean {
+  if (!t.max_inactivity) return false;
+  return t.last_used + t.max_inactivity < time();
+}
+
 export interface APITokenPrivateKey {
   alg: string;
   priv: string;

virtweb_frontend/src/routes/TokensListRoute.tsx

@@ -1,6 +1,4 @@
-import React from "react";
-import { APIToken, APITokenURL, TokensApi } from "../api/TokensApi";
-import { AsyncWidget } from "../widgets/AsyncWidget";
+import VisibilityIcon from "@mui/icons-material/Visibility";
 import {
   Button,
   IconButton,
@@ -12,11 +10,18 @@ import {
   TableHead,
   TableRow,
 } from "@mui/material";
-import { RouterLink } from "../widgets/RouterLink";
-import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
+import React from "react";
 import { useNavigate } from "react-router-dom";
-import VisibilityIcon from "@mui/icons-material/Visibility";
+import {
+  APIToken,
+  APITokenURL,
+  ExpiredAPIToken,
+  TokensApi,
+} from "../api/TokensApi";
+import { AsyncWidget } from "../widgets/AsyncWidget";
+import { RouterLink } from "../widgets/RouterLink";
 import { TimeWidget, timeDiff } from "../widgets/TimeWidget";
+import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
 
 export function TokensListRoute(): React.ReactElement {
   const [list, setList] = React.useState<APIToken[] | undefined>();
@@ -74,8 +79,11 @@ export function TokensListRouteInner(p: {
                   key={t.id}
                   hover
                   onDoubleClick={() => navigate(APITokenURL(t))}
+                  style={{ backgroundColor: ExpiredAPIToken(t) ? "red" : "" }}
                 >
-                  <TableCell>{t.name}</TableCell>
+                  <TableCell>
+                    {t.name} {ExpiredAPIToken(t) && <i>(Expired)</i>}
+                  </TableCell>
                   <TableCell>{t.description}</TableCell>
                   <TableCell>
                     <TimeWidget time={t.created} />