feat: show temporal users - fix #228 (#229)

openhotel · Dec 28, 2024 · 23dfc88 · 23dfc88
1 parent bb043f1
commit 23dfc88
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 19 deletions.
diff --git a/app/client/src/modules/home/components/admin/components/users/users.component.tsx b/app/client/src/modules/home/components/admin/components/users/users.component.tsx
@@ -1,31 +1,71 @@
 import { useAdmin } from "shared/hooks";
-import React from "react";
+import React, { useMemo } from "react";
+import { cn, getCensoredEmail } from "shared/utils";
+import dayjs from "dayjs";
+
 //@ts-ignore
 import styles from "./users.module.scss";
-import { cn, getCensoredEmail } from "shared/utils";
 
 export const UsersComponent = () => {
   const { users } = useAdmin();
 
+  const verifiedUsers = useMemo(
+    () => users.filter(($user) => $user.verified),
+    [users],
+  );
+  const today = dayjs(Date.now());
+
+  const temporalUsers = useMemo(
+    () =>
+      users
+        .filter(($user) => !$user.verified)
+        .map(($user) => {
+          const expireAt = dayjs($user.createdAt).add(1, "day");
+          const remainingMinutes = expireAt.diff(today, "minutes");
+
+          return {
+            ...$user,
+            remainingTime: `${Math.floor(remainingMinutes / 60)} hours ${remainingMinutes % 60} minutes`,
+          };
+        }),
+    [users, today],
+  );
+
   return (
     <div className={styles.users}>
-      <h3>Users ({users.length})</h3>
-      <div className={styles.list}>
-        {users.map((user) => (
-          <div
-            className={cn(styles.item, {
-              [styles.admin]: user.admin,
-            })}
-            key={user.accountId}
-          >
-            <label>{new Date(user.createdAt).toISOString()}</label>
-            <label>{user.accountId}</label>
-            <label>{user.username}</label>
-            <label title={user.email}>{getCensoredEmail(user.email)}</label>
-            <label>{user.otp ? "2FA" : null}</label>
-            <label>{user.admin ? "ADMIN" : null}</label>
-          </div>
-        ))}
+      <div>
+        <h3>Users ({verifiedUsers.length})</h3>
+        <div className={styles.list}>
+          {verifiedUsers.map((user) => (
+            <div
+              className={cn(styles.item, {
+                [styles.admin]: user.admin,
+              })}
+              key={user.accountId}
+            >
+              <label>{new Date(user.createdAt).toISOString()}</label>
+              <label>{user.accountId}</label>
+              <label>{user.username}</label>
+              <label title={user.email}>{getCensoredEmail(user.email)}</label>
+              <label>{user.otp ? "2FA" : null}</label>
+              <label>{user.admin ? "ADMIN" : null}</label>
+            </div>
+          ))}
+        </div>
+      </div>
+      <div>
+        <h3>Temp Users ({temporalUsers.length})</h3>
+        <div className={styles.list}>
+          {temporalUsers.map((user) => (
+            <div className={styles.item} key={user.accountId}>
+              <label>{new Date(user.createdAt).toISOString()}</label>
+              <label>{user.accountId}</label>
+              <label>{user.username}</label>
+              <label title={user.email}>{getCensoredEmail(user.email)}</label>
+              <div>{user.remainingTime} remaining</div>
+            </div>
+          ))}
+        </div>
       </div>
     </div>
   );

diff --git a/app/client/src/shared/types/user.types.ts b/app/client/src/shared/types/user.types.ts
@@ -5,4 +5,5 @@ export type User = {
   email: string;
   admin?: boolean;
   otp?: boolean;
+  verified?: boolean;
 };
diff --git a/app/server/src/modules/api/v3/admin/users.request.ts b/app/server/src/modules/api/v3/admin/users.request.ts
@@ -26,6 +26,7 @@ export const usersGetRequest: RequestType = {
           admin: Boolean(await System.admins.get(account.accountId)),
           otp: await System.otp.isOTPVerified(account.accountId),
           createdAt: account.createdAt,
+          verified: account.verified,
         })),
       )
     ).sort((userA: any, userB: any) =>