more

src/pageElements/Cards.js

@@ -277,17 +277,16 @@ export const DocCard = (props) => {
   } = props;
   const now = new Date().getTime();
   const uploadedAt = createdAt.toDate();
-  const diff = Math.round((now - uploadedAt) / 60 / 1000);
+  const isReportable = Math.round((now - uploadedAt) / 60 / 1000) > 15;
-  const isReportable = diff > 15;
+  const disabled = docType ? false : true;
-  console.log("diff", diff);
+  const tooltipText =
+    "Parsing is taking a bit longer than usual. This usually resolves within 15 minutes. If it does not, click “report” and support will address the issue within 24 hours.";
+  const pendingText =
+    "Parsing in process, please be patient. This should resolve within 10 minutes.";
   const report = (documentId, docType) => {
     console.log("report documentId, docType", documentId, docType);
   };
 
-  const tooltipText =
-    "Parsing is taking a bit longer than usual. This usually resolves within 10 - 15 minutes. If it does not, click “report” and support will address the issue within 24 hours.";
-
-  const disabled = docType ? false : true;
   return (
     <div className="doc-card-container">
       <div className="doc-card-input">
@@ -300,7 +299,7 @@ export const DocCard = (props) => {
             isReportable ? (
               <Tooltip text={tooltipText} />
             ) : (
-              <Tooltip text={tooltipText} iconStyle="clock" />
+              <Tooltip text={pendingText} iconStyle="clock" />
             )
           ) : (
             <></>

src/pageElements/Tooltip.js

@@ -1,17 +1,23 @@
 import { useState } from "react";
 import "../styles/tooltip.scss";
-import { InfoCircle } from "react-bootstrap-icons";
+import { InfoCircle, Clock } from "react-bootstrap-icons";
 
 function Tooltip(props) {
   const [show, setShow] = useState(false);
-  const { text } = props;
+  const { text, iconStyle } = props;
+  const showClock = iconStyle === "clock";
   return (
     <div
       className="tooltip-container"
       onMouseEnter={() => setShow(true)}
       onMouseLeave={() => setShow(false)}
     >
+      {showClock ? (
+        <Clock className="infocircle-icon" size="16px" />
+      ) : (
         <InfoCircle className="infocircle-icon" size="16px" />
+      )}
+
       {show ? <span className="tooltip-text">{text}</span> : <></>}
     </div>
   );