Merge pull request #44 from bcgov/ofmcc-738-notification-checkbox-lost

OFMCC-738 and OFMCC-756 - bug fixes and code refactoring
bcgov · Nov 23, 2023 · d96c784 · d96c784
2 parents a5becc2 + 493d4df
commit d96c784
Show file tree

Hide file tree

Showing 13 changed files with 374 additions and 320 deletions.
diff --git a/backend/src/components/message.js b/backend/src/components/message.js
@@ -87,7 +87,7 @@ async function getAssistanceRequests(req, res) {
   try {
     log.debug('getAssistanceRequests: ', req.params.contactId)
     let assistanceRequests = []
-    const operation = `ofm_assistance_requests?$select=modifiedon,ofm_assistance_requestid,ofm_last_opened_time,ofm_name,_ofm_request_category_value,ofm_subject,statecode,statuscode,ofm_is_read&$expand=ofm_facility_request_request($select=_ofm_facility_value),ofm_conversation_request($select=modifiedon)&$filter=(_ofm_contact_value eq ${req.params.contactId}) and (ofm_facility_request_request/any(o1:(o1/ofm_facility_requestid ne null))) and (ofm_conversation_request/any(o2:(o2/ofm_conversationid ne null)))`
+    const operation = `ofm_assistance_requests?$select=modifiedon,ofm_assistance_requestid,ofm_name,_ofm_request_category_value,ofm_subject,statecode,statuscode,ofm_is_read&$expand=ofm_facility_request_request($select=_ofm_facility_value),ofm_conversation_request($select=modifiedon)&$filter=(_ofm_contact_value eq ${req.params.contactId}) and (ofm_facility_request_request/any(o1:(o1/ofm_facility_requestid ne null))) and (ofm_conversation_request/any(o2:(o2/ofm_conversationid ne null)))`
     log.debug('operation: ', operation)
     const response = await getOperation(operation)
     response?.value?.forEach((item) => assistanceRequests.push(mapAssistanceRequestObjectForFront(item)))
@@ -99,9 +99,9 @@ async function getAssistanceRequests(req, res) {
 
 async function getAssistanceRequest(req, res) {
   try {
-    let operation = `ofm_assistance_requests(${req.params.assistanceRequestId})?$select=modifiedon,ofm_assistance_requestid,ofm_last_opened_time,ofm_name,_ofm_request_category_value,ofm_subject,statecode,statuscode,ofm_is_read&$expand=ofm_facility_request_request($select=_ofm_facility_value),ofm_conversation_request($select=modifiedon)`
+    const operation = `ofm_assistance_requests(${req.params.assistanceRequestId})?$select=modifiedon,ofm_assistance_requestid,ofm_name,_ofm_request_category_value,ofm_subject,statecode,statuscode,ofm_is_read&$expand=ofm_facility_request_request($select=_ofm_facility_value),ofm_conversation_request($select=modifiedon)`
     log.debug('operation: ', operation)
-    let response = await getOperation(operation)
+    const response = await getOperation(operation)
     return res.status(HttpStatus.OK).json(mapAssistanceRequestObjectForFront(response))
   } catch (e) {
     return res.status(HttpStatus.INTERNAL_SERVER_ERROR).json(e.data ? e.data : e?.status)

diff --git a/backend/src/components/notification.js b/backend/src/components/notification.js
@@ -1,55 +1,33 @@
 'use strict'
 const { getOperation, patchOperationWithObjectId } = require('./utils')
-const { MappableObjectForFront } = require('../util/mapping/MappableObject')
+const { MappableObjectForFront, MappableObjectForBack } = require('../util/mapping/MappableObject')
 const { NotificationMappings } = require('../util/mapping/Mappings')
 const HttpStatus = require('http-status-codes')
-const moment = require('moment')
 const log = require('./logger')
-const { join } = require('path')
-
-function mapNotificationObjectForFront(data) {
-  if (data.createdon) {
-    data.createdon = new moment(data.createdon).format('YYYY/MM/DD')
-  }
-  return new MappableObjectForFront(data, NotificationMappings).toJSON()
-}
-
-function sortByPropertyDesc(property) {
-  return function (a, b) {
-    if (a[property] < b[property]) return 1
-    else if (a[property] > b[property]) return -1
-    return 0
-  }
-}
 
 async function getNotifications(req, res) {
   try {
-    let operation =
-      'emails?$select=description,lastopenedtime,subject,createdon&$expand=email_activity_parties($filter=(_partyid_value eq ' +
+    const operation =
+      'emails?$select=description,lastopenedtime,subject,createdon,ofm_is_read&$expand=email_activity_parties($filter=(_partyid_value eq ' +
       req.params.contactId +
       '))&$filter=(email_activity_parties/any(o1:(o1/_partyid_value eq ' +
       req.params.contactId +
       ')))'
-    log.info('operation: ', operation)
-    let operationResponse = await getOperation(operation)
-    operationResponse.value.sort(sortByPropertyDesc('createdon'))
+    log.debug('operation: ', operation)
+    const response = await getOperation(operation)
     let notifications = []
-    for (const item of operationResponse.value) {
-      let notification = mapNotificationObjectForFront(item)
-      if (notification.lastOpenedTime) notification['isRead'] = true
-      else notification['isRead'] = false
-      notifications.push(notification)
-    }
+    response?.value?.forEach((item) => notifications.push(new MappableObjectForFront(item, NotificationMappings).toJSON()))
     return res.status(HttpStatus.OK).json(notifications)
   } catch (e) {
     log.error('failed with error', e)
     return res.status(HttpStatus.INTERNAL_SERVER_ERROR).json(e.data ? e.data : e?.status)
   }
 }
 
-async function updateNotificationLastOpenedTime(req, res) {
+async function updateNotification(req, res) {
   try {
-    let response = await patchOperationWithObjectId('emails', req.params.notificationId, req.body)
+    const payload = new MappableObjectForBack(req.body, NotificationMappings).toJSON()
+    const response = await patchOperationWithObjectId('emails', req.params.notificationId, payload)
     return res.status(HttpStatus.OK).json(response)
   } catch (e) {
     return res.status(HttpStatus.INTERNAL_SERVER_ERROR).json(e.data ? e.data : e?.status)
@@ -58,5 +36,5 @@ async function updateNotificationLastOpenedTime(req, res) {
 
 module.exports = {
   getNotifications,
-  updateNotificationLastOpenedTime,
+  updateNotification,
 }
diff --git a/backend/src/routes/notification.js b/backend/src/routes/notification.js
@@ -3,7 +3,7 @@ const passport = require('passport')
 const router = express.Router()
 const auth = require('../components/auth')
 const isValidBackendToken = auth.isValidBackendToken()
-const { getNotifications, updateNotificationLastOpenedTime } = require('../components/notification')
+const { getNotifications, updateNotification } = require('../components/notification')
 const { param, validationResult } = require('express-validator')
 
 module.exports = router
@@ -17,11 +17,17 @@ router.get('/contact/:contactId', passport.authenticate('jwt', { session: false
 })
 
 /**
- * Update Last Opened Time of an existing Notification
+ * Update an existing Notification
  */
-router.put('/:notificationId', passport.authenticate('jwt', { session: false }), isValidBackendToken, [param('notificationId', 'URL param: [notificationId] is required').not().isEmpty()], (req, res) => {
-  validationResult(req).throw()
-  return updateNotificationLastOpenedTime(req, res)
-})
+router.put(
+  '/:notificationId',
+  passport.authenticate('jwt', { session: false }),
+  isValidBackendToken,
+  [param('notificationId', 'URL param: [notificationId] is required').not().isEmpty()],
+  (req, res) => {
+    validationResult(req).throw()
+    return updateNotification(req, res)
+  },
+)
 
 module.exports = router
diff --git a/backend/src/util/mapping/Mappings.js b/backend/src/util/mapping/Mappings.js
@@ -49,7 +49,6 @@ const AssistanceRequestMappings = [
   { back: 'statecode', front: 'stateCode' },
   { back: '_ofm_request_category_value@OData.Community.Display.V1.FormattedValue', front: 'categoryName' },
   { back: 'modifiedon', front: 'lastUpdatedTime' },
-  { back: 'ofm_last_opened_time', front: 'lastOpenedTime' },
   { back: 'ofm_is_read', front: 'isRead' },
 ]
 
@@ -75,6 +74,7 @@ const NotificationMappings = [
   { back: 'createdon', front: 'dateReceived' },
   { back: 'description', front: 'notificationContent' },
   { back: 'lastopenedtime', front: 'lastOpenedTime' },
+  { back: 'ofm_is_read', front: 'isRead' },
 ]
 
 module.exports = {

diff --git a/frontend/src/components/messages/AssistanceRequestTable.vue b/frontend/src/components/messages/AssistanceRequestTable.vue
@@ -77,13 +77,13 @@ export default {
   },
   watch: {
     markReadButtonState: {
-      handler() {
-        this.updateBodyCheckboxesReadUnread(true)
+      async handler() {
+        await this.updateBodyCheckboxesReadUnread(true)
       },
     },
     markUnreadButtonInMessageTableState: {
-      handler() {
-        this.updateBodyCheckboxesReadUnread(false)
+      async handler() {
+        await this.updateBodyCheckboxesReadUnread(false)
       },
     },
     markUnreadButtonInConversationThreadState: {
@@ -118,18 +118,17 @@ export default {
       this.$emit('openRequestConversation', this.selectedRequestId)
       await this.updateMessageReadUnread(true, this.selectedRequestId)
     },
+    /**
+     * Include isRead in the payload if its value changes
+     */
     async updateMessageReadUnread(isRead, assistanceRequestId) {
-      this.selectedAssistanceRequest = this.assistanceRequests?.find((item) => item.assistanceRequestId === assistanceRequestId)
+      let selectedAssistanceRequest = this.assistanceRequests?.find((item) => item.assistanceRequestId === assistanceRequestId)
       let payload = {}
-      if (isRead) {
-        this.selectedAssistanceRequest.lastOpenedTime = new Date().toUTCString()
-        payload.lastOpenedTime = this.selectedAssistanceRequest.lastOpenedTime
-      }
-      if (this.selectedAssistanceRequest.isRead != isRead) {
-        this.selectedAssistanceRequest.isRead = isRead
+      if (selectedAssistanceRequest?.isRead != isRead) {
+        selectedAssistanceRequest.isRead = isRead
         payload.isRead = isRead
+        await this.updateAssistanceRequest(assistanceRequestId, payload)
       }
-      await this.updateAssistanceRequest(assistanceRequestId, payload)
     },
     isActionRequiredMessage(item) {
       return item?.status === 'Action required'

diff --git a/frontend/src/components/messages/MessagesTab.vue b/frontend/src/components/messages/MessagesTab.vue
@@ -29,9 +29,7 @@
         </v-skeleton-loader>
       </v-col>
       <v-col cols="6">
-        <RequestConversations
-          :assistanceRequestId="selectedAssistanceRequestId"
-          @toggleMarkUnreadButtonInConversationThread="toggleMarkUnreadButtonInConversationThread" />
+        <RequestConversations :assistanceRequestId="selectedAssistanceRequestId" @toggleMarkUnreadButtonInConversationThread="toggleMarkUnreadButtonInConversationThread" />
       </v-col>
     </v-row>
     <NewRequestDialog class="pa-0" :show="showNewRequestDialog" @close="toggleNewRequestDialog" />
@@ -40,11 +38,11 @@
 
 <script>
 import { mapState, mapActions } from 'pinia'
-import { useAuthStore } from '@/stores/auth'
 import { useMessagesStore } from '@/stores/messages'
 import NewRequestDialog from '@/components/messages/NewRequestDialog.vue'
 import AssistanceRequestTable from '@/components/messages/AssistanceRequestTable.vue'
 import RequestConversations from '@/components/messages/RequestConversations.vue'
+
 export default {
   name: 'MessagesTab',
   components: { NewRequestDialog, AssistanceRequestTable, RequestConversations },
@@ -58,12 +56,8 @@ export default {
     }
   },
   computed: {
-    ...mapState(useAuthStore, ['userInfo']),
     ...mapState(useMessagesStore, ['assistanceRequests']),
   },
-  async created() {
-    if (!this.assistanceRequests) await this.getAssistanceRequests(this.userInfo?.contactId)
-  },
   methods: {
     ...mapActions(useMessagesStore, ['getAssistanceRequests']),
     toggleNewRequestDialog() {
@@ -121,4 +115,4 @@ export default {
   margin: 0px;
   font-size: 1.5em;
 }
-</style>
+</style>
diff --git a/frontend/src/components/messages/NewRequestConfirmationDialog.vue b/frontend/src/components/messages/NewRequestConfirmationDialog.vue
@@ -19,8 +19,8 @@
 </template>
 
 <script>
-import AppButton from '../ui/AppButton.vue'
-import AppDialog from '../ui/AppDialog.vue'
+import AppButton from '@/components/ui/AppButton.vue'
+import AppDialog from '@/components/ui/AppDialog.vue'
 
 export default {
   name: 'NewRequestConfirmationDialog',

diff --git a/frontend/src/components/messages/NewRequestDialog.vue b/frontend/src/components/messages/NewRequestDialog.vue
@@ -1,7 +1,6 @@
 <template>
   <v-container>
-    <AppDialog v-model="isDisplayed" title="New request" :isLoading="isLoading" persistent max-width="70%"
-      @close="closeNewRequestDialog">
+    <AppDialog v-model="isDisplayed" title="New request" :isLoading="isLoading" persistent max-width="70%" @close="closeNewRequestDialog">
       <template #content>
         <v-form ref="newRequestForm" v-model="newRequestModel.isFormComplete" class="px-12 mx-8">
           <v-row no-gutters class="mt-4">
@@ -24,17 +23,15 @@
               <strong>Subject:</strong>
             </v-col>
             <v-col class="v-col-12 v-col-md-9 v-col-xl-10">
-              <v-text-field v-model="newRequestModel.subject" placeholder="Brief summary of request" counter
-                maxlength="100" variant="outlined" :rules="rules.required"></v-text-field>
+              <v-text-field v-model="newRequestModel.subject" placeholder="Brief summary of request" counter maxlength="100" variant="outlined" :rules="rules.required"></v-text-field>
             </v-col>
           </v-row>
           <v-row no-gutters class="mt-2">
             <v-col class="v-col-12 blue-text pb-0">
               <strong>Request description:</strong>
             </v-col>
             <v-col class="v-col-12">
-              <v-textarea v-model="newRequestModel.description" placeholder="Detailed description of request" counter
-                maxlength="1000" variant="outlined" :rules="rules.required"></v-textarea>
+              <v-textarea v-model="newRequestModel.description" placeholder="Detailed description of request" counter maxlength="1000" variant="outlined" :rules="rules.required"></v-textarea>
             </v-col>
           </v-row>
           <v-row no-gutters class="mt-2">
@@ -79,23 +76,19 @@
               <strong>Business phone:</strong>
             </v-col>
             <v-col class="v-col-12 v-col-md-9 v-col-xl-10">
-              <v-text-field v-model="newRequestModel.phone" variant="outlined"
-                :rules="[...rules.required, rules.phone]" />
+              <v-text-field v-model="newRequestModel.phone" variant="outlined" :rules="[...rules.required, rules.phone]" />
             </v-col>
           </v-row>
         </v-form>
       </template>
       <template #button>
         <v-row justify="space-around">
-          <AppButton id="cancel-new-request" :primary="false" size="large" width="200px" @click="closeNewRequestDialog()"
-            :loading="isLoading">Cancel</AppButton>
-          <AppButton id="submit-new-request" size="large" width="200px" @click="submit()" :loading="isLoading">Submit
-          </AppButton>
+          <AppButton id="cancel-new-request" :primary="false" size="large" width="200px" @click="closeNewRequestDialog()" :loading="isLoading">Cancel</AppButton>
+          <AppButton id="submit-new-request" size="large" width="200px" @click="submit()" :loading="isLoading">Submit</AppButton>
         </v-row>
       </template>
     </AppDialog>
-    <NewRequestConfirmationDialog :referenceNumber="referenceNumber" :show="showNewRequestConfirmationDialog"
-      @close="toggleNewRequestConfirmationDialog" />
+    <NewRequestConfirmationDialog :referenceNumber="referenceNumber" :show="showNewRequestConfirmationDialog" @close="toggleNewRequestConfirmationDialog" />
   </v-container>
 </template>
 
@@ -104,14 +97,16 @@ import { mapState, mapActions } from 'pinia'
 import { useAuthStore } from '@/stores/auth'
 import { useAppStore } from '@/stores/app'
 import { useMessagesStore } from '@/stores/messages'
-import AppButton from '../ui/AppButton.vue'
-import AppDialog from '../ui/AppDialog.vue'
+import AppButton from '@/components/ui/AppButton.vue'
+import AppDialog from '@/components/ui/AppDialog.vue'
 import rules from '@/utils/rules'
 import NewRequestConfirmationDialog from '@/components/messages/NewRequestConfirmationDialog.vue'
+import alertMixin from '@/mixins/alertMixin'
 
 export default {
   name: 'NewRequestDialog',
   components: { AppButton, AppDialog, NewRequestConfirmationDialog },
+  mixins: [alertMixin],
   props: {
     show: {
       type: Boolean,
@@ -178,6 +173,7 @@ export default {
           await this.addNewAssistanceRequestToStore(response?.assistanceRequestId)
           this.toggleNewRequestConfirmationDialog()
         } catch (error) {
+          this.setFailureAlert('Failed to create a new assistance request')
           console.log(`Failed to create a new Assistance Request - ${error}`)
           throw error
         } finally {
@@ -194,7 +190,9 @@ export default {
 }
 </script>
 
-<style scoped>.blue-text {
+<style scoped>
+.blue-text {
   color: #003366;
   font-size: 1.25em;
-}</style>
+}
+</style>
diff --git a/frontend/src/components/messages/RequestConversations.vue b/frontend/src/components/messages/RequestConversations.vue
@@ -5,7 +5,7 @@
         <span class="subject-header">Subject: {{ assistanceRequest.subject }}</span>
       </v-col>
       <v-col cols="2" class="d-flex flex-column align-start pb-0 pt-0">
-        <v-btn v-if="assistanceRequest.lastOpenedTime"
+        <v-btn v-if="assistanceRequest.isRead"
           @click="this.$emit('toggleMarkUnreadButtonInConversationThread')" class="btn-style">
           <v-icon class="icon" left>mdi-email-outline</v-icon>
           <span class="btn-label">Mark unread</span>