Merge branch 'main' into esm-plugin-tests

jescalada · web-flow · commit 993395022065 · 2025-11-05T21:01:25.000+09:00
diff --git a/src/routes.tsx b/src/routes.tsx
@@ -28,7 +28,7 @@ import RepoList from './ui/views/RepoList/RepoList';
 import SettingsView from './ui/views/Settings/Settings';
 
 import { RepoIcon } from '@primer/octicons-react';
-import { Group, AccountCircle, Dashboard, Settings } from '@material-ui/icons';
+import { AccountCircle, Dashboard, Group, Settings } from '@material-ui/icons';
 
 import { Route } from './types/models';
 
@@ -90,12 +90,10 @@ const dashboardRoutes: Route[] = [
     visible: true,
   },
   {
-    path: '/admin/user/:id',
+    path: '/user/:id',
     name: 'User',
     icon: Person,
-    component: (props) => (
-      <RouteGuard component={User} fullRoutePath={`/dashboard/admin/user/:id`} />
-    ),
+    component: (props) => <RouteGuard component={User} fullRoutePath={`/dashboard/user/:id`} />,
     layout: '/dashboard',
     visible: false,
   },
diff --git a/src/ui/components/UserLink/UserLink.tsx b/src/ui/components/UserLink/UserLink.tsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+interface UserLinkProps {
+  username: string;
+  children?: React.ReactNode;
+}
+
+const UserLink: React.FC<UserLinkProps> = ({ username, children }) => {
+  return <Link to={`/dashboard/user/${username}`}>{children || username}</Link>;
+};
+
+export default UserLink;
diff --git a/src/ui/views/PushDetails/PushDetails.tsx b/src/ui/views/PushDetails/PushDetails.tsx
@@ -25,6 +25,7 @@ import Tooltip from '@material-ui/core/Tooltip';
 import { PushData } from '../../../types/models';
 import { trimPrefixRefsHeads, trimTrailingDotGit } from '../../../db/helper';
 import { generateEmailLink, getGitProvider } from '../../utils';
+import UserLink from '../../components/UserLink/UserLink';
 
 const Dashboard: React.FC = () => {
   const { id } = useParams<{ id: string }>();
@@ -198,25 +199,21 @@ const Dashboard: React.FC = () => {
                   ) : (
                     <>
                       {isGitHub && (
-                        <a href={`/dashboard/user/${data.attestation.reviewer.username}`}>
+                        <UserLink username={data.attestation.reviewer.username}>
                           <img
                             style={{ width: '45px', borderRadius: '20px' }}
                             src={`https://github.com/${data.attestation.reviewer.gitAccount}.png`}
                           />
-                        </a>
+                        </UserLink>
                       )}
                       <div>
                         <p>
                           {isGitHub && (
-                            <a href={`/dashboard/user/${data.attestation.reviewer.username}`}>
+                            <UserLink username={data.attestation.reviewer.username}>
                               {data.attestation.reviewer.gitAccount}
-                            </a>
+                            </UserLink>
                           )}
-                          {!isGitHub && (
-                            <a href={`/dashboard/user/${data.attestation.reviewer.username}`}>
-                              {data.attestation.reviewer.username}
-                            </a>
-                          )}{' '}
+                          {!isGitHub && <UserLink username={data.attestation.reviewer.username} />}{' '}
                           approved this contribution
                         </p>
                       </div>
diff --git a/src/ui/views/PushDetails/components/AttestationView.tsx b/src/ui/views/PushDetails/components/AttestationView.tsx
@@ -12,6 +12,7 @@ import { withStyles } from '@material-ui/core/styles';
 import { green } from '@material-ui/core/colors';
 import { setURLShortenerData } from '../../../services/config';
 import { AttestationViewProps } from '../attestation.types';
+import UserLink from '../../../components/UserLink/UserLink';
 
 const StyledFormControlLabel = withStyles({
   root: {
@@ -70,17 +71,15 @@ const AttestationView: React.FC<AttestationViewProps> = ({ attestation, setAttes
         <p style={{ fontSize: '15px', paddingLeft: '34px' }}>
           Prior to making this code contribution publicly accessible via GitHub, this code
           contribution was reviewed and approved by{' '}
-          <a href={`/dashboard/admin/user/${data.reviewer.username}`}>{data.reviewer.gitAccount}</a>
-          . As a reviewer, it was their responsibility to confirm that open sourcing this
-          contribution followed the requirements of the company open source contribution policy.
+          <UserLink username={data.reviewer.username}>{data.reviewer.gitAccount}</UserLink>. As a
+          reviewer, it was their responsibility to confirm that open sourcing this contribution
+          followed the requirements of the company open source contribution policy.
         </p>
       </span>
       <DialogContent>
         <p>
           <span>
-            <a href={`/dashboard/admin/user/${data.reviewer.username}`}>
-              {data.reviewer.gitAccount}
-            </a>{' '}
+            <UserLink username={data.reviewer.username}>{data.reviewer.gitAccount}</UserLink>{' '}
             approved this contribution{' '}
             <Tooltip title={moment(data.timestamp).format('dddd, MMMM Do YYYY, h:mm:ss a')} arrow>
               <kbd
diff --git a/src/ui/views/RepoDetails/Components/DeleteRepoDialog.tsx b/src/ui/views/RepoDetails/Components/DeleteRepoDialog.tsx
@@ -0,0 +1,70 @@
+import React, { useState } from 'react';
+import Dialog from '@material-ui/core/Dialog';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import DialogContent from '@material-ui/core/DialogContent';
+import { Button, DialogContentText, TextField } from '@material-ui/core';
+import DialogActions from '@material-ui/core/DialogActions';
+
+interface ConfirmDeleteRepoProps {
+  repoName: string;
+  open: boolean;
+  onClose: () => void;
+  onConfirm: () => void;
+}
+
+const DeleteRepoDialog: React.FC<ConfirmDeleteRepoProps> = ({
+  repoName,
+  open,
+  onClose,
+  onConfirm,
+}) => {
+  const [confirmInput, setConfirmInput] = useState<string>('');
+
+  const handleClose = () => {
+    setConfirmInput('');
+    onClose();
+  };
+
+  const handleConfirm = () => {
+    setConfirmInput('');
+    onConfirm();
+    onClose();
+  };
+
+  return (
+    <Dialog open={open} onClose={handleClose} maxWidth='sm' fullWidth>
+      <DialogTitle>Delete Repository</DialogTitle>
+      <DialogContent>
+        <DialogContentText>
+          This action cannot be undone. This will permanently delete the <strong>{repoName}</strong>{' '}
+          repository.
+        </DialogContentText>
+        <DialogContentText style={{ marginTop: '16px', marginBottom: '8px' }}>
+          Please type <strong>{repoName}</strong> to confirm:
+        </DialogContentText>
+        <TextField
+          fullWidth
+          value={confirmInput}
+          onChange={(e) => setConfirmInput(e.target.value)}
+          placeholder={repoName}
+          autoFocus
+        />
+      </DialogContent>
+      <DialogActions>
+        <Button variant='outlined' onClick={handleClose}>
+          Cancel
+        </Button>
+        <Button
+          variant='contained'
+          color='secondary'
+          onClick={handleConfirm}
+          disabled={confirmInput !== repoName}
+        >
+          Delete Repository
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default DeleteRepoDialog;
diff --git a/src/ui/views/RepoDetails/RepoDetails.tsx b/src/ui/views/RepoDetails/RepoDetails.tsx
@@ -23,6 +23,8 @@ import CodeActionButton from '../../components/CustomButtons/CodeActionButton';
 import { trimTrailingDotGit } from '../../../db/helper';
 import { fetchRemoteRepositoryData } from '../../utils';
 import { SCMRepositoryMetadata } from '../../../types/models';
+import UserLink from '../../components/UserLink/UserLink';
+import DeleteRepoDialog from './Components/DeleteRepoDialog';
 
 interface RepoData {
   _id: string;
@@ -58,10 +60,11 @@ const RepoDetails: React.FC = () => {
   const navigate = useNavigate();
   const classes = useStyles();
   const [data, setData] = useState<RepoData | null>(null);
-  const [, setAuth] = useState(true);
-  const [isLoading, setIsLoading] = useState(true);
-  const [isError, setIsError] = useState(false);
-  const [remoteRepoData, setRemoteRepoData] = React.useState<SCMRepositoryMetadata | null>(null);
+  const [confirmDeleteOpen, setConfirmDeleteOpen] = useState<boolean>(false);
+  const [, setAuth] = useState<boolean>(true);
+  const [isLoading, setIsLoading] = useState<boolean>(true);
+  const [isError, setIsError] = useState<boolean>(false);
+  const [remoteRepoData, setRemoteRepoData] = useState<SCMRepositoryMetadata | null>(null);
   const { user } = useContext<UserContextType>(UserContext);
   const { id: repoId } = useParams<{ id: string }>();
 
@@ -120,7 +123,7 @@ const RepoDetails: React.FC = () => {
                     variant='contained'
                     color='secondary'
                     data-testid='delete-repo-button'
-                    onClick={() => removeRepository(data._id)}
+                    onClick={() => setConfirmDeleteOpen(true)}
                   >
                     <Delete />
                   </Button>
@@ -200,7 +203,7 @@ const RepoDetails: React.FC = () => {
                       {data.users.canAuthorise.map((row) => (
                         <TableRow key={row}>
                           <TableCell align='left'>
-                            <a href={`/dashboard/user/${row}`}>{row}</a>
+                            <UserLink username={row} />
                           </TableCell>
                           {user.admin && (
                             <TableCell align='right' component='th' scope='row'>
@@ -243,7 +246,7 @@ const RepoDetails: React.FC = () => {
                       {data.users.canPush.map((row) => (
                         <TableRow key={row}>
                           <TableCell align='left'>
-                            <a href={`/dashboard/user/${row}`}>{row}</a>
+                            <UserLink username={row} />
                           </TableCell>
                           {user.admin && (
                             <TableCell align='right' component='th' scope='row'>
@@ -266,6 +269,13 @@ const RepoDetails: React.FC = () => {
           </CardBody>
         </Card>
       </GridItem>
+
+      <DeleteRepoDialog
+        repoName={data.name}
+        open={confirmDeleteOpen}
+        onClose={() => setConfirmDeleteOpen(false)}
+        onConfirm={() => removeRepository(data._id)}
+      />
     </GridContainer>
   );
 };
diff --git a/src/ui/views/UserList/Components/UserList.tsx b/src/ui/views/UserList/Components/UserList.tsx
@@ -32,8 +32,7 @@ const UserList: React.FC = () => {
   const itemsPerPage = 5;
   const [searchQuery, setSearchQuery] = useState<string>('');
 
-  const openUser = (username: string) =>
-    navigate(`/dashboard/admin/user/${username}`, { replace: true });
+  const openUser = (username: string) => navigate(`/dashboard/user/${username}`, { replace: true });
 
   useEffect(() => {
     getUsers(setIsLoading, setData, setAuth, setErrorMessage);
