From 9220cdf81ca455a066dd504e5840f86315c8c660 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Mon, 19 Feb 2024 22:03:45 -0600
Subject: [PATCH] more

---
 src/Components/Document/DocumentListPage.js | 15 ++++++++++++---
 src/styles/doclist-page.scss                | 16 ++++++++++++++++
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/Components/Document/DocumentListPage.js b/src/Components/Document/DocumentListPage.js
index 7f36d4a..6f62ddd 100644
--- a/src/Components/Document/DocumentListPage.js
+++ b/src/Components/Document/DocumentListPage.js
@@ -16,6 +16,7 @@ import {
 } from "firebase/firestore";
 import ListPagination from "../../pageElements/ListPagination";
 import ConfirmModal from "../Modals/ConfirmModal";
+import Toggle from "../../pageElements/Toggle";
 import "../../styles/doclist-page.scss";
 
 const DocumentListPage = ({ perPage }) => {
@@ -36,7 +37,7 @@ const DocumentListPage = ({ perPage }) => {
   const [isBusy, setIsBusy] = useState(false);
   const [selectedDocumentType, setSelectedDocumentType] = useState();
   const [showModal, setShowModal] = useState(false);
-
+  const [responseVerbosity, setResponseVerbosity] = useState("");
   const apiUrl =
     process.env.NODE_ENV === "development"
       ? process.env.REACT_APP_API_DEV
@@ -151,6 +152,10 @@ const DocumentListPage = ({ perPage }) => {
     );
   }
 
+  const handleToggle = () => {
+    console.log(" <Toggle onClick={handleToggle} />");
+  };
+
   function handleCancelDelete() {
     if (!isBusy) {
       setShowDeleteModal(false);
@@ -182,9 +187,13 @@ const DocumentListPage = ({ perPage }) => {
         {allDocs === null ? <div>Loading...</div> : null}
         {allDocs !== null ? (
           <div>
-            <div>
+            <div className="doclist-upper-wrapper">
+              <div className="doclist-toggle-box">
+                {" "}
+                <Toggle onClick={handleToggle} />
+              </div>
               {allDocs.length > 0 ? (
-                <div className="d-flex justify-content-end mb-3">
+                <div className="doclist-select-box mb-3">
                   <SelectDropdown
                     dropDownOptions={dropDownOptions}
                     titleText="Sort documents"
diff --git a/src/styles/doclist-page.scss b/src/styles/doclist-page.scss
index 5f4d3f6..5c61322 100644
--- a/src/styles/doclist-page.scss
+++ b/src/styles/doclist-page.scss
@@ -16,6 +16,22 @@
   font-weight: 400;
 }
 
+.doclist-upper-wrapper {
+  display: flex;
+  flex-direction: row;
+}
+
+.doclist-toggle-box {
+  margin-left: auto;
+  margin-right: 25px;
+  min-width: 120px;
+  padding-top: 4px;
+}
+
+.doclist-select-box {
+  min-width: 100px;
+}
+
 .nodocs-text-container {
   border-top: 1px solid #dcd9d9 !important;
   margin-top: 6px;