Client table, dashbaord updates (#1722)

* UI update * client list completed * Dashboard style fix * Dashboard datepicker style updated * Dashboard fixes done --------- Co-authored-by: shuhaib-aot <[email protected]>
AOT-Technologies · Nov 15, 2023 · 32c488f · 32c488f
1 parent 9eb62ca
commit 32c488f
Show file tree

Hide file tree

Showing 5 changed files with 172 additions and 116 deletions.
diff --git a/forms-flow-web/src/apiManager/services/bpmServices.js b/forms-flow-web/src/apiManager/services/bpmServices.js
@@ -44,6 +44,7 @@ export const formatForms = (forms) => {
       processKey: form.processKey,
       status: form.status,
       anonymous: form.anonymous,
+      description:form.description,
       created: form.created,
       formType: form.formType
     };

diff --git a/forms-flow-web/src/components/Dashboard/Dashboard.js b/forms-flow-web/src/components/Dashboard/Dashboard.js
@@ -79,9 +79,7 @@ const Dashboard = React.memo(() => {
   const [searchBy, setSearchBy] = useState("created");
   const [sortsBy, setSortsBy] = useState("formName");
 
-  const [showSubmissionData, setSHowSubmissionData] = useState(
-    submissionsList[0]
-  );
+  const [showSubmissionData, setSHowSubmissionData] = useState(submissionsList[0]);
   const [show, setShow] = useState(false);
   // State to set search text for submission data
   const [showClearButton, setShowClearButton] = useState("");
@@ -172,10 +170,17 @@ const Dashboard = React.memo(() => {
   };
 
   const onSetDateRange = (date) => {
-    dispatch(setMetricsSubmissionLimitChange(limit));
-    dispatch(setMetricsSubmissionPageChange(1));
-    dispatch(setMetricsDateRangeLoading(true));
-    dispatch(setMetricsDateChange(date));
+    if (date) {
+      dispatch(setMetricsSubmissionLimitChange(limit));
+      dispatch(setMetricsSubmissionPageChange(1));
+      dispatch(setMetricsDateRangeLoading(true));
+      dispatch(setMetricsDateChange(date));
+    } else {
+      const now = new Date();
+      let firstDay = new Date(now.getFullYear(), now.getMonth(), 1);
+      let lastDay = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+      dispatch(setMetricsDateChange([firstDay, lastDay]));
+    }
   };
   const headerList = () => {
     return [
@@ -208,7 +213,6 @@ const Dashboard = React.memo(() => {
       <LoadingOverlay active={submissionStatusCountLoader} spinner>
         <div
           className="mb-4"
-          style={{ maxHeight: "60vh" }}
           id="main"
           role="complementary"
         >
@@ -265,7 +269,7 @@ const Dashboard = React.memo(() => {
                   <option value="modified">{t("Modified Date")}</option>
                 </FormControl>
               </div>
-              <DateRangePicker
+              <DateRangePicker className = "bg-white"
                 onChange={onSetDateRange}
                 value={dateRange}
                 dayPlaceholder="dd"
@@ -274,7 +278,6 @@ const Dashboard = React.memo(() => {
                 calendarAriaLabel={t("Select the date")}
                 dayAriaLabel="Select the day"
                 clearAriaLabel="Clear value"
-                clearIcon={null}
                 name="selectDateRange"
                 monthAriaLabel="Select the month"
                 yearAriaLabel="Select the year"
@@ -312,7 +315,7 @@ const Dashboard = React.memo(() => {
             </div>
           </div>
 
-          <div className="dashboard d-flex">
+          <div className="dashboard d-flex" style={{ minHeight: "60vh" }}>
             {submissionsList.length ? (
               <div className="col-12 px-0">
                 {!metricsDateRangeLoader && (
@@ -326,20 +329,19 @@ const Dashboard = React.memo(() => {
                 )}
               </div>
             ) : (
-              <div className="col-12 col-sm-6 col-md-6 no_submission_main">
-                {!metricsDateRangeLoader && (
-                  <div className="col-12 col-sm-6 col-md-6 no_sumbsmission">
-                    <h3>{t("No submissions found")}</h3>
-                  </div>
-                )}
-              </div>
+              <>
+              {!metricsDateRangeLoader && (
+
+                  <h3 className = "text-center w-100 p-5">{t("No submissions found")}</h3>
+
+              )}</>
             )}
           </div>
 
           {submissionsList.length && !metricsDateRangeLoader ? (
             <div className="d-flex justify-content-between align-items-center mt-3">
                  <div className="d-flex align-items-center">
-          <span className="mr-2"> {t("Rows per page")}</span>
+          <span className="mr-2"> {t("Items per page")}</span>
           <Dropdown>
                 <Dropdown.Toggle variant="light" id="dropdown-basic">
                   {selectedLimitValue}

diff --git a/forms-flow-web/src/components/Form/List.scss b/forms-flow-web/src/components/Form/List.scss
@@ -168,3 +168,6 @@ flex-wrap: wrap;
  .custom-button {
     width: auto;
   }
+.form-description-p-tag > p{
+    word-wrap: break-word;
+}