diff --git a/src/Components/Case/CaseDetailsPage.js b/src/Components/Case/CaseDetailsPage.js
index 2d8d818..709466c 100644
--- a/src/Components/Case/CaseDetailsPage.js
+++ b/src/Components/Case/CaseDetailsPage.js
@@ -4,6 +4,7 @@ import { DetailCard } from "../../pageElements/DetailCard.js";
 import Button from "../../pageElements/Button";
 import CreateModal from "../Modals/CreateModal.js";
 import UploadModal from "../Modals/UploadModal.js";
+import ConfirmModal from "../Modals/ConfirmModal.js";
 import { db } from "../../firebase";
 import { useParams } from "react-router-dom";
 import { AppContext } from "../../Hooks/useContext/appContext.js";
@@ -17,6 +18,7 @@ const CaseDetailsPage = () => {
   const navigate = useNavigate();
   const [showUploadModal, setShowUploadModal] = useState();
   const [showCreateModal, setShowCreateModal] = useState();
+  const [showConfirmModal, setShowConfirmModal] = useState();
   const [isLoading, setIsLoading] = useState(false);
   const { appState } = useContext(AppContext);
   const { group } = appState;
@@ -64,12 +66,19 @@ const CaseDetailsPage = () => {
     const allowed = Number(temp.docsAllowed);
     const generated = Number(temp.docsGenerated);
     if (allowed - generated > 0) {
-      console.log("greater than do some shit");
       setShowUploadModal(true);
     } else {
-      console.log("fuck you");
+      setShowConfirmModal(true);
     }
   };
+
+  const handleCancelConfirm = () => {
+    setShowConfirmModal(false);
+  };
+
+  const handleConfirmUpgrade = () => {
+    console.log("handle confirm upgrade");
+  };
   const handleSuccess = () => {
     setIsLoading(true);
     setShowUploadModal(false);
@@ -127,6 +136,7 @@ const CaseDetailsPage = () => {
 
   const showUp = showUploadModal && subCase !== null ? true : false;
   const showCreate = showCreateModal && subCase !== null ? true : false;
+  const showConfirm = showConfirmModal && subCase !== null ? true : false;
   return (
     <div className="details-container">
       {isLoading ? <LoadingSpinner message={message} /> : null}
@@ -146,6 +156,18 @@ const CaseDetailsPage = () => {
           <CreateModal setShowModal={setShowCreateModal} caseData={subCase} />
         ) : null
       ) : null}
+      {!isLoading ? (
+        showConfirm ? (
+          <ConfirmModal
+            setShowModal={setShowConfirmModal}
+            onCancel={handleCancelConfirm}
+            onConfirm={handleConfirmUpgrade}
+            modalText="You have used the maximum documents allowed in your current subscription. Upgrade to get more."
+            titleText="No documents remaining"
+            buttonLabelText="Upgrade"
+          />
+        ) : null
+      ) : null}
       {!isLoading ? (
         subCase !== null ? (
           <DetailCard data={subCase} />
diff --git a/src/Components/Modals/ConfirmModal.js b/src/Components/Modals/ConfirmModal.js
index 64926f5..5426e04 100644
--- a/src/Components/Modals/ConfirmModal.js
+++ b/src/Components/Modals/ConfirmModal.js
@@ -4,6 +4,7 @@ import Modal from "react-bootstrap/Modal";
 import TextInput from "../../pageElements/TextInput";
 
 import { db } from "../../firebase";
+
 const ConfirmModal = ({
   onCancel,
   onConfirm,
@@ -17,14 +18,16 @@ const ConfirmModal = ({
   issueText,
   setIssueText,
   reportDoc,
+  titleText,
 }) => {
+  const title = titleText ? titleText : "Confirmation";
   return (
     <Modal show="true" onHide={onCancel} size="lg">
       <Modal.Header closeButton>
         {isReport ? (
           <Modal.Title>Report an issue</Modal.Title>
         ) : (
-          <Modal.Title>Confirmation</Modal.Title>
+          <Modal.Title>{title}</Modal.Title>
         )}
       </Modal.Header>
       <Modal.Body>