more

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"

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;