This commit is contained in:
Kenneth Jannette
2024-01-12 17:24:13 -06:00
parent 8b11fae765
commit 64eab17924

View File

@@ -4,6 +4,7 @@ import { AppContext } from "../../Hooks/useContext/appContext";
import SelectDropdown from "../../pageElements/SelectDropdown"; import SelectDropdown from "../../pageElements/SelectDropdown";
import { DocCard } from "../../pageElements/Cards"; import { DocCard } from "../../pageElements/Cards";
import { db } from "../../firebase"; import { db } from "../../firebase";
import MobileContent from "../MobileContent";
import { import {
collection, collection,
deleteDoc, deleteDoc,
@@ -18,6 +19,8 @@ import ConfirmModal from "../Modals/ConfirmModal";
import "../../styles/doclist-page.scss"; import "../../styles/doclist-page.scss";
const DocumentListPage = ({ perPage }) => { const DocumentListPage = ({ perPage }) => {
const size = window.innerWidth < 440;
const [isMobile, setIsMobile] = useState(size);
const navigate = useNavigate(); const navigate = useNavigate();
const [showDeleteModal, setShowDeleteModal] = useState(false); const [showDeleteModal, setShowDeleteModal] = useState(false);
const [selectedDocumentId, setSelectedDocumentId] = useState(null); const [selectedDocumentId, setSelectedDocumentId] = useState(null);
@@ -164,103 +167,107 @@ const DocumentListPage = ({ perPage }) => {
if (!group) { if (!group) {
return null; return null;
} }
console.log("allDocs", allDocs);
return ( const DesktopContent = () => {
<> return (
<div className="doc-list-header"> <>
<h2 className="doc-header-text">Documents</h2> <div className="doc-list-header">
<div className="user-name-container">{group.firm}</div> <h2 className="doc-header-text">Documents</h2>
</div> <div className="user-name-container">{group.firm}</div>
{allDocs === null ? <div>Loading...</div> : null}
{allDocs !== null ? (
<div className="dropdown-container">
{allDocs.length > 0 ? (
<div className="d-flex justify-content-end mb-3">
<SelectDropdown
dropDownOptions={dropDownOptions}
titleText="Sort documents"
handleSelect={setOrder}
/>
</div>
) : (
<></>
)}
<div className="document-list-lower-wrapper">
{allDocs.length > 0 ? (
allDocs
.slice((page - 1) * perPage, page * perPage)
.map((doc, i) => (
<DocCard
key={`doccard-${i}`}
title={doc.docTitle}
parentCaseNumber={doc.parentCaseNumber}
parentCaseName={doc.parentCaseName}
parentCaseId={doc.parentCaseId}
docType={doc.docType}
documentId={doc.documentId}
dateServed={doc.dateServed}
openDocument={openDoc}
confirmDelete={confirmDelete}
handleNavigate={handleNavigate}
displayDeleteButton={true}
responseGenerations={doc.responseGenerations}
/>
))
) : (
<div className="nodocs-text-container">
<p className="nodocs-text">
{" "}
You have not uploaded any documents yet.
</p>
<p className="nodocs-light-text">To upload a document:</p>
<ol>
<li className="nodocs-list-item">
Navigate to the cases view (above link in navigation bar).{" "}
</li>
<li>
{" "}
Click "View Case" to select the case with which your
document will be associated. This will open the Case Detail
view.{" "}
</li>
<li className="nodocs-list-item">
Note: If you have not yet created any cases, you will need
to create one first - click "Create Case" and follow the
prompts.
</li>
<li className="nodocs-list-item">
In the case detail view, click "Upload Case Document" and
select a document from your computer for upload.
</li>
<li className="nodocs-list-item">
Your document will be parsed into a processable form. You
will then be able to generate a response to the document.
</li>
</ol>
</div>
)}
</div>
{totalPages > 1 ? (
<div className="mb-3">
<ListPagination
page={page}
totalPages={totalPages}
setPage={setPage}
/>
</div>
) : null}
</div> </div>
) : null} {allDocs === null ? <div>Loading...</div> : null}
{showDeleteModal && selectedDocumentId !== null ? ( {allDocs !== null ? (
<ConfirmModal <div className="dropdown-container">
onCancel={handleCancelDelete} {allDocs.length > 0 ? (
onConfirm={handleDeleteDocument} <div className="d-flex justify-content-end mb-3">
buttonLabelText="Delete" <SelectDropdown
modalText="Confirm that you want to permanently delete this document." dropDownOptions={dropDownOptions}
/> titleText="Sort documents"
) : null} handleSelect={setOrder}
</> />
); </div>
) : (
<></>
)}
<div className="document-list-lower-wrapper">
{allDocs.length > 0 ? (
allDocs
.slice((page - 1) * perPage, page * perPage)
.map((doc, i) => (
<DocCard
key={`doccard-${i}`}
title={doc.docTitle}
parentCaseNumber={doc.parentCaseNumber}
parentCaseName={doc.parentCaseName}
parentCaseId={doc.parentCaseId}
docType={doc.docType}
documentId={doc.documentId}
dateServed={doc.dateServed}
openDocument={openDoc}
confirmDelete={confirmDelete}
handleNavigate={handleNavigate}
displayDeleteButton={true}
responseGenerations={doc.responseGenerations}
/>
))
) : (
<div className="nodocs-text-container">
<p className="nodocs-text">
{" "}
You have not uploaded any documents yet.
</p>
<p className="nodocs-light-text">To upload a document:</p>
<ol>
<li className="nodocs-list-item">
Navigate to the cases view (above link in navigation bar).{" "}
</li>
<li>
{" "}
Click "View Case" to select the case with which your
document will be associated. This will open the Case
Detail view.{" "}
</li>
<li className="nodocs-list-item">
Note: If you have not yet created any cases, you will need
to create one first - click "Create Case" and follow the
prompts.
</li>
<li className="nodocs-list-item">
In the case detail view, click "Upload Case Document" and
select a document from your computer for upload.
</li>
<li className="nodocs-list-item">
Your document will be parsed into a processable form. You
will then be able to generate a response to the document.
</li>
</ol>
</div>
)}
</div>
{totalPages > 1 ? (
<div className="mb-3">
<ListPagination
page={page}
totalPages={totalPages}
setPage={setPage}
/>
</div>
) : null}
</div>
) : null}
{showDeleteModal && selectedDocumentId !== null ? (
<ConfirmModal
onCancel={handleCancelDelete}
onConfirm={handleDeleteDocument}
buttonLabelText="Delete"
modalText="Confirm that you want to permanently delete this document."
/>
) : null}
</>
);
};
return isMobile ? <MobileContent /> : <DesktopContent />;
}; };
export default DocumentListPage; export default DocumentListPage;