Merge pull request #1654 from cityofaustin/rose/move_temp_records

Move temporary records functionality to crashes list
cityofaustin · Jan 20, 2025 · 2347efc · 2347efc
2 parents e2eb13e + f2686a8
commit 2347efc
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 66 deletions.
diff --git a/app/app/crashes/page.tsx b/app/app/crashes/page.tsx
@@ -1,25 +1,53 @@
 "use client";
+import { useState, useCallback } from "react";
 import Card from "react-bootstrap/Card";
+import Button from "react-bootstrap/Button";
+import AlignedLabel from "@/components/AlignedLabel";
 import AppBreadCrumb from "@/components/AppBreadCrumb";
+import CreateCrashRecordModal from "@/components/CreateCrashRecordModal";
+import { FaCirclePlus } from "react-icons/fa6";
 import { crashesListViewColumns } from "@/configs/crashesListViewColumns";
 import { crashesListViewQueryConfig } from "@/configs/crashesListViewTable";
 import TableWrapper from "@/components/TableWrapper";
 const localStorageKey = "crashesListViewQueryConfig";
 
 export default function Crashes() {
+  const [refetch, setRefetch] = useState(false);
+  const [showNewUserModal, setShowNewUserModal] = useState(false);
+  const onCloseModal = () => setShowNewUserModal(false);
+
+  const onSaveCallback = useCallback(() => {
+    setRefetch((prev) => !prev);
+    setShowNewUserModal(false);
+  }, [setRefetch]);
+
   return (
     <>
       <AppBreadCrumb />
       <Card>
-        <Card.Header className="fs-5 fw-bold">Crashes</Card.Header>
+        <Card.Header className="fs-5 fw-bold d-flex justify-content-between">
+          Crashes
+          <Button className="me-2" onClick={() => setShowNewUserModal(true)}>
+            <AlignedLabel>
+              <FaCirclePlus className="me-2" />
+              <span>Create crash record</span>
+            </AlignedLabel>
+          </Button>
+        </Card.Header>
         <Card.Body>
           <TableWrapper
             columns={crashesListViewColumns}
             initialQueryConfig={crashesListViewQueryConfig}
             localStorageKey={localStorageKey}
+            refetch={refetch}
           />
         </Card.Body>
       </Card>
+      <CreateCrashRecordModal
+        onClose={onCloseModal}
+        show={showNewUserModal}
+        onSubmitCallback={onSaveCallback}
+      />
     </>
   );
 }
diff --git a/app/app/create-crash-record/page.tsx b/app/app/create-crash-record/page.tsx
diff --git a/app/components/CrashIsTemporaryBanner.tsx b/app/components/CrashIsTemporaryBanner.tsx
@@ -46,7 +46,7 @@ export default function CrashIsTemporaryBanner({
               )
             ) {
               await mutate({ id: crashId, updated_by: user?.email });
-              router.push("/create-crash-record");
+              router.push("/crashes");
             }
           }}
           disabled={isMutating}

diff --git a/app/components/SidebarLayout.tsx b/app/components/SidebarLayout.tsx
@@ -14,7 +14,6 @@ import {
   FaAngleRight,
   FaUserGroup,
   FaCloudArrowUp,
-  FaFileCirclePlus,
 } from "react-icons/fa6";
 import AppNavBar from "./AppNavBar";
 import SideBarListItem from "./SideBarListItem";
@@ -40,7 +39,7 @@ export default function SidebarLayout({ children }: { children: ReactNode }) {
     []
   );
 
-  /** Check local storage for initialsidebar state */
+  /** Check local storage for initial sidebar state */
   useEffect(() => {
     const collapsedFromStorage =
       localStorage.getItem(localStorageKey) === "true";
@@ -117,13 +116,6 @@ export default function SidebarLayout({ children }: { children: ReactNode }) {
                 label="Locations"
                 href="/locations"
               />
-              <SideBarListItem
-                isCollapsed={isCollapsed}
-                isCurrentPage={segments.includes("create-crash-record")}
-                Icon={FaFileCirclePlus}
-                label="Create crash"
-                href="/create-crash-record"
-              />
               <SideBarListItem
                 isCollapsed={isCollapsed}
                 isCurrentPage={segments.includes("upload-non-cr3")}

diff --git a/app/configs/crashesListViewTable.ts b/app/configs/crashesListViewTable.ts
@@ -204,7 +204,8 @@ const crashesListViewfilterCards: FilterGroup[] = [
   {
     id: "internal_filters",
     label: "Internal",
-    groupOperator: "_or",
+    // because one of the filters is enabled and inverted we need to join using the "_and" operator
+    groupOperator: "_and",
     filterGroups: [
       {
         id: "private_drive",
@@ -221,6 +222,20 @@ const crashesListViewfilterCards: FilterGroup[] = [
           },
         ],
       },
+      {
+        id: "is_temp_record",
+        label: "Temporary records only",
+        groupOperator: "_and",
+        enabled: false,
+        filters: [
+          {
+            id: "is_temp_record",
+            column: "is_temp_record",
+            operator: "_eq",
+            value: true,
+          },
+        ],
+      },
     ],
   },
 ];