feat: sort pr docs by recent first and show date badges

strr-examiner-web/app/components/Host/SupportingInfo.vue

@@ -195,12 +195,12 @@ const businessLicenseRegistrationConfig: SupportingDocumentsConfig = {
                 </div>
                 <div>
                   <SupportingDocuments
-                    class="mb-1 flex flex-wrap gap-y-2"
+                    class="mb-1 flex flex-col gap-y-2"
                     data-testid="bl-documents"
                     :config="isApplication ? businessLicenseDocumentsConfig : businessLicenseRegistrationConfig"
                   />
                   <SupportingDocuments
-                    class="mb-1 flex flex-wrap gap-y-2"
+                    class="mb-1 flex flex-col gap-y-2"
                     data-testid="bl-noc-documents"
                     :config="businessLicenseNocDocumentsConfig"
                   />
@@ -238,12 +238,12 @@ const businessLicenseRegistrationConfig: SupportingDocumentsConfig = {
                   data-testid="pr-req-documents"
                 >
                   <SupportingDocuments
-                    class="mb-1 flex flex-wrap gap-y-2"
+                    class="mb-1 flex flex-col gap-y-2"
                     data-testid="initial-app-documents"
                     :config="isApplication ? applicationDocumentsConfig : registrationDocumentsConfig"
                   />
                   <SupportingDocuments
-                    class="flex flex-wrap gap-y-2"
+                    class="flex flex-col gap-y-2"
                     data-testid="noc-documents"
                     :config="nocDocumentsConfig"
                   />

strr-examiner-web/app/components/SnapshotVersionsTable.vue

@@ -79,7 +79,3 @@ const onViewSnapshot = async (snapshotEndpoint: string) => {
     </UTable>
   </div>
 </template>
-
-<style>
-
-</style>

strr-examiner-web/app/components/SupportingDocuments.vue

@@ -27,13 +27,27 @@ const filterDocumentsByConfig = (config: SupportingDocumentsConfig): ApiDocument
     return includeType && !excludeType && includeStep && !excludeStep
   })
 }
-// optionally filter documents based on config, or return all documents
-const filteredDocuments = computed(() => props.config ? filterDocumentsByConfig(props.config) : documents)
+// sort documents by date (most recent first)
+const sortByDate = (docs: ApiDocument[]): ApiDocument[] => {
+  return [...docs].sort((a, b) => {
+    const dateA = new Date(a.uploadDate || a.addedOn || 0).getTime()
+    const dateB = new Date(b.uploadDate || b.addedOn || 0).getTime()
+    return dateB - dateA
+  })
+}
+
+// optionally filter documents based on config, or return all documents, sorted by date
+const filteredDocuments = computed(() => {
+  const docs = props.config ? filterDocumentsByConfig(props.config) : documents
+  return sortByDate(docs)
+})
 
 const appRegNumber = computed((): string | number =>
   isApplication.value ? applicationNumber : activeReg.value.id
 )
 
+const displayDate = (date: string = '') => dateToString(date, 'y-MM-dd', true)
+
 const shouldShowDateBadge = (document: ApiDocument): boolean => {
   return (document.uploadStep && props.config?.includeDateBadge?.includes(document.uploadStep)) ||
     (props.config?.showDateBadgeForAll && (document.uploadDate || document.addedOn))
@@ -42,7 +56,7 @@ const shouldShowDateBadge = (document: ApiDocument): boolean => {
 
 <template>
   <div v-if="!isEmpty(filteredDocuments)">
-    <span
+    <div
       v-for="(document, index) in filteredDocuments"
       :key="document.fileKey"
       class="mr-4 flex whitespace-nowrap"
@@ -58,11 +72,11 @@ const shouldShowDateBadge = (document: ApiDocument): boolean => {
       </UButton>
       <UBadge
         v-if="shouldShowDateBadge(document)"
-        :label="`${ t('strr.label.added')} ` + (document.uploadDate || document.addedOn)"
+        :label="`${ t('strr.label.added')} ` + displayDate(document.uploadDate || document.addedOn)"
         size="sm"
         class="ml-2 px-3 py-0 font-bold"
         data-testid="supporting-doc-date-badge"
       />
-    </span>
+    </div>
   </div>
 </template>

strr-examiner-web/app/pages/registration/[registrationId]/index.vue

@@ -223,15 +223,15 @@ watch(
       </ApplicationDetailsView>
       <DocumentUpload />
       <ComposeNoc v-if="!showDecisionPanel" />
-      <HistoricalApplicationsTable
-        v-if="!isApplication && isHistoricalApplicationsTableEnabled"
-        :applications="(activeRecord as HousRegistrationResponse).header.applications ?? []"
-      />
+      <DecisionPanel />
       <SnapshotVersionsTable
         v-if="!isApplication && isSnapshotVersionsTableEnabled"
         :snapshots="(activeRecord as HousRegistrationResponse).snapshots ?? []"
       />
-      <DecisionPanel />
+      <HistoricalApplicationsTable
+        v-if="!isApplication && isHistoricalApplicationsTableEnabled"
+        :applications="(activeRecord as HousRegistrationResponse).header.applications ?? []"
+      />
       <AssignmentActions :is-registration-page="true" @refresh="refresh" />
     </template>
   </div>

strr-examiner-web/app/pages/registration/[registrationId]/snapshots/[snapshotId].vue

@@ -24,7 +24,7 @@ const { data: snapshot, status, error } = await useLazyAsyncData<
     const snapshotId = route.params.snapshotId as string
     const resp = await getSnapshotById(registrationId, snapshotId)
     activeRecord.value = resp.snapshotData // used for the data needed to render the details page
-    snapshotInfo.value = resp // user for data needed for snapshot info widget on details page
+    snapshotInfo.value = resp // used for data needed for snapshot info widget on details page
     return resp
   }
 )

strr-examiner-web/i18n/locales/en-CA.ts

@@ -669,6 +669,7 @@ export default {
     UTILITY_BILL: 'Utility Bill',
     GOVT_OR_CROWN_CORP_OFFICIAL_NOTICE: 'Government or Crown Corporation Official Notice',
     FRACTIONAL_OWNERSHIP_AGREEMENT: 'Fractional Ownership Agreement',
+    PROPERTY_TITLE_WITH_FRACTIONAL_OWNERSHIP: 'Property Title Showing Fractional Ownership',
     STRATA_HOTEL_DOCUMENTATION: 'Strata Hotel Documentation',
     TENANCY_AGREEMENT: 'Tenancy Agreement',
     RENT_RECEIPT_OR_BANK_STATEMENT: 'Rent Receipt or Bank Statement',

strr-examiner-web/package.json

@@ -2,7 +2,7 @@
   "name": "strr-examiner-web",
   "private": true,
   "type": "module",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "scripts": {
     "build-check": "nuxt build",
     "build": "nuxt generate",