feat(grants): formatting fixes for dates

usdigitalresponse · Oct 17, 2024 · eb10cad · eb10cad
1 parent 7577330
commit eb10cad
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 8 deletions.
diff --git a/packages/client/src/components/GrantsTable.vue b/packages/client/src/components/GrantsTable.vue
@@ -293,6 +293,10 @@ export default {
       };
       const generateOpenDate = (date, status) => {
         const formattedDate = new Date(date).toLocaleDateString('en-US', { timeZone: 'UTC' });
+        const dateExists = date && date !== '2100-01-01';
+        if (!dateExists) {
+          return 'Not yet issued';
+        }
         if (status === 'forecasted') {
           return `est. ${formattedDate}`;
         }

diff --git a/packages/client/src/views/GrantDetailsView.vue b/packages/client/src/views/GrantDetailsView.vue
@@ -103,7 +103,8 @@
                     hover
                   >
                     <template #cell()="data">
-                      <span :class="{ 'text-muted font-weight-normal': data.item.displayMuted }">
+                      <i v-if="data.item.displayEstimatedText">est.&nbsp;</i>
+                      <span :class="{'text-muted font-weight-normal': data.item.displayMuted}">
                         {{ data.value }}
                       </span>
                     </template>
@@ -223,7 +224,8 @@ import GrantActivity from '@/components/GrantActivity.vue';
 
 const HEADER = '__HEADER__';
 const FAR_FUTURE_CLOSE_DATE = '2100-01-01';
-const NOT_AVAILABLE_TEXT = 'Not Available';
+const NOT_YET_ISSUED_TEXT = 'Not yet issued';
+const FORECASTED = 'forecasted';
 
 export default {
   components: {
@@ -283,10 +285,12 @@ export default {
       }, {
         name: 'Open Date',
         value: this.openDateDisplay,
+        displayEstimatedText: this.displayEstimatedOpenDateText,
       }, {
         name: 'Close Date',
         value: this.closeDateDisplay,
         displayMuted: this.closeDateDisplayMuted,
+        displayEstimatedText: this.displayEstimatedCloseDateText,
       }, {
         name: 'Grant ID',
         value: this.currentGrant.grant_id,
@@ -315,19 +319,22 @@ export default {
       ];
     },
     openDateDisplay() {
-      // make 'forecasted' a constant
-      if (this.currentGrant.opportunity_status === 'forecasted') {
+      if (!this.currentGrant.open_date || this.currentGrant.open_date === FAR_FUTURE_CLOSE_DATE) {
+        return NOT_YET_ISSUED_TEXT;
+      }
+      if (this.currentGrant.opportunity_status === FORECASTED) {
         // check for date validity here and in closeDateDisplay
-        return `est. ${this.formatDate(this.currentGrant.open_date)}`;
+        return `${this.formatDate(this.currentGrant.open_date)}`;
       }
       return this.formatDate(this.currentGrant.open_date);
     },
     closeDateDisplay() {
       // If we have an explainer text instead of a real close date, display that instead
       if (!this.currentGrant.close_date || this.currentGrant.close_date === FAR_FUTURE_CLOSE_DATE) {
-        return this.currentGrant.close_date_explanation ?? NOT_AVAILABLE_TEXT;
-      } if (this.currentGrant.opportunity_status === 'forecasted') {
-        return `est. ${this.formatDate(this.currentGrant.close_date)}`;
+        return this.currentGrant.close_date_explanation ?? NOT_YET_ISSUED_TEXT;
+      }
+      if (this.currentGrant.opportunity_status === FORECASTED) {
+        return `${this.formatDate(this.currentGrant.close_date)}`;
       }
       return this.formatDate(this.currentGrant.close_date);
     },
@@ -360,6 +367,12 @@ export default {
     statusSubmitButtonDisabled() {
       return this.selectedInterestedCode === null;
     },
+    displayEstimatedCloseDateText() {
+      return this.currentGrant.close_date && this.currentGrant.opportunity_status === 'forecasted';
+    },
+    displayEstimatedOpenDateText() {
+      return this.currentGrant.open_date && this.currentGrant.opportunity_status === 'forecasted';
+    },
   },
   watch: {
     async currentGrant() {