Initial commit - frontend

2025-09-19 03:26:52 +00:00
commit 27e9a08ee0
234 changed files with 32097 additions and 0 deletions
--- a/src/components/admin/UserTableSection.tsx
+++ b/src/components/admin/UserTableSection.tsx
@@ -0,0 +1,115 @@
+// src/components/admin/UserTableSection.tsx
+'use client';
+
+import { useState } from 'react';
+import {
+  Typography, Table, TableBody, TableCell, TableContainer, TableHead,
+  TableRow, Paper, Box, Button, Dialog, DialogTitle, DialogContent, DialogActions
+} from '@mui/material';
+import UserEnableToggle from './UserEnableToggle';
+import AddUserForm from './forms/AddUserForm';
+import AddClientForm from './forms/AddClientForm';
+import InviteUserForm from './forms/InviteUserForm';
+
+interface UserDTO {
+  id: number;
+  username: string;
+  displayName: string;
+  firstName: string;
+  lastName: string;
+  email: string;
+  role: string;
+  clientName: string;
+  enabled: boolean;
+}
+
+export default function UserTableSection({ initialUsers }: { initialUsers: UserDTO[] }) {
+  const [users, setUsers] = useState<UserDTO[]>(initialUsers);
+  const [openUserDialog, setOpenUserDialog] = useState(false);
+  const [openClientDialog, setOpenClientDialog] = useState(false);
+  const [openInviteUserDialog, setOpenInviteUserDialog] = useState(false);
+
+  return (
+    <Box sx={{ p: 4 }}>
+      <Typography variant="h5" gutterBottom>User Management</Typography>
+
+      <Box sx={{ mb: 2, display: 'flex', gap: 2 }}>
+        <Button variant="contained" color="primary" onClick={() => setOpenClientDialog(true)}>
+          Add Client
+        </Button>
+        <Button variant="contained" color="success" onClick={() => setOpenUserDialog(true)}>
+          Add User
+        </Button>
+        <Button variant="contained" color="success" onClick={() => setOpenInviteUserDialog(true)}>
+          Invite User
+        </Button>
+      </Box>
+
+      <TableContainer component={Paper}>
+        <Table>
+          <TableHead>
+            <TableRow>
+              <TableCell>Username</TableCell>
+              <TableCell>Display Name</TableCell>
+              <TableCell>First Name</TableCell>
+              <TableCell>Last Name</TableCell>
+              <TableCell>Email</TableCell>
+              <TableCell>Role</TableCell>
+              <TableCell>Client</TableCell>
+              <TableCell>Status</TableCell>
+            </TableRow>
+          </TableHead>
+          <TableBody>
+            {users.map((user) => (
+              <TableRow key={user.id}>
+                <TableCell>{user.username}</TableCell>
+                <TableCell>{user.displayName}</TableCell>
+                <TableCell>{user.firstName}</TableCell>
+                <TableCell>{user.lastName}</TableCell>
+                <TableCell>{user.email}</TableCell>
+                <TableCell>{user.role}</TableCell>
+                <TableCell>{user.clientName}</TableCell>
+                <TableCell>
+                  <UserEnableToggle userId={user.id} initialEnabled={user.enabled} />
+                </TableCell>
+              </TableRow>
+            ))}
+          </TableBody>
+        </Table>
+      </TableContainer>
+
+      {/* Add Client Dialog */}
+      <Dialog open={openClientDialog} onClose={() => setOpenClientDialog(false)}>
+        <DialogTitle>Register New Client</DialogTitle>
+        <DialogContent>
+          <AddClientForm onClose={() => setOpenClientDialog(false)} />
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={() => setOpenClientDialog(false)}>Close</Button>
+        </DialogActions>
+      </Dialog>
+
+      {/* Add User Dialog */}
+      <Dialog open={openUserDialog} onClose={() => setOpenUserDialog(false)}>
+        <DialogTitle>Register New User</DialogTitle>
+        <DialogContent>
+          <AddUserForm onClose={() => setOpenUserDialog(false)} />
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={() => setOpenUserDialog(false)}>Close</Button>
+        </DialogActions>
+      </Dialog>
+
+      {/* Invite User Dialog */}
+      <Dialog open={openInviteUserDialog} onClose={() => setOpenInviteUserDialog(false)}>
+        <DialogTitle>Invite New User</DialogTitle>
+        <DialogContent>
+          <InviteUserForm onClose={() => setOpenInviteUserDialog(false)} />
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={() => setOpenInviteUserDialog(false)}>Close</Button>
+        </DialogActions>
+      </Dialog>
+    </Box>
+  );
+}