✨ Allow clicking on Summaries

code/frontend/src/components/base/Summary.js

@@ -10,6 +10,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
  * @param icon - The icon of the summary.
  * @param title - The title of the summary.
  * @param subtitle - The subtitle of the summary.
+ * @param onClick - A function to call when the summary is clicked.
  * @param upperLabel - The label for the upper value.
  * @param upperValue - The upper value.
  * @param lowerLabel - The label for the lower value.
@@ -21,11 +22,11 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
  * @constructor
  */
 export default function Summary(
-    { icon, title, subtitle, upperLabel, upperValue, lowerLabel, lowerValue, buttons, className, ...props },
+    { icon, title, subtitle, onClick, upperLabel, upperValue, lowerLabel, lowerValue, buttons, className, ...props },
 ) {
     return (
         <div className={classNames(Style.Summary, className)} {...props}>
-            <div className={Style.Left}>
+            <div className={classNames(Style.Left, onClick ? Style.Clickable : null)} onClick={onClick}>
                 <div className={Style.IconContainer}>
                     <FontAwesomeIcon icon={icon}/>
                 </div>

code/frontend/src/components/base/Summary.module.css

@@ -7,6 +7,13 @@
     display: flex;
 }
 
+.Clickable {
+    cursor: pointer;
+}
+
+.Clickable:hover {
+    filter: brightness(110%);
+}
 
 .Left {
     width: 250px;

code/frontend/src/components/interactive/SummaryRepository.js

@@ -28,6 +28,10 @@ export default function SummaryRepository(
     const { fetchNow: archiveThis } = useBackend(fetchDataAuth, "PATCH", `/api/v1/repositories/${repo.id}`, { "close": true })
     const { fetchNow: deletThis } = useBackend(fetchDataAuth, "DELETE", `/api/v1/repositories/${repo.id}`)
 
+    const onRepoClick = () => {
+        history.push(`/repositories/${repo.id}`)
+    }
+
     const onEditClick = () => {
         history.push(`/repositories/${repo.id}/edit`)
     }
@@ -77,6 +81,7 @@ export default function SummaryRepository(
             icon={repo.is_active ? faFolderOpen : faFolder}
             title={repo.name}
             subtitle={repo.owner ? repo.owner.username : null}
+            onClick={onRepoClick}
             upperLabel={"Created"}
             upperValue={repo.start ? new Date(repo.start).toLocaleString() : null}
             lowerLabel={"Archived"}

code/frontend/src/components/interactive/SummaryUser.js

@@ -13,7 +13,8 @@ export default function SummaryUser({ user, destroyUser, running, ...props }) {
          <Button
              color={"Red"}
              icon={faTrash}
-             onClick={async () => {
+             onClick={async event => {
+                 event.stopPropagation()
                  // TODO: Errors are not caught here. Where should they be displayed?
                  await destroyUser(user["email"])
              }}