From 80576c7024d5f7a4f68bb460d6fd139f82a68f4f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9verin=20Beauvais?=
 <severinbeauvais@users.noreply.github.com>
Date: Tue, 23 Jul 2024 10:14:45 -0700
Subject: [PATCH] 21977 Handling for new bootstrap filing statuses (#684)

* - app version = 7.3.16
- added latestReviewComment property to filing interface
- deleted some unused CSS
- added pending list toggling from sub-components
- added Todo List subtitle for change-requested filings (eg, cont in)
- added Todo List default task handling
- added Todo List action for change-requests filings (ie, make changes)
- added Todo List content (body) for change-requested filings
- fixed misc Todo List console log messages
- added missing checks for "empty" continuation in
- added handling for cont in review fields (submitter, date, comment)
- renamed subtitle subcomponents "SubtitleXXX"
- added Approved status handling to FilingTemplate.vue
- renamed body subcomponents "BodyXXX"
- added Rejected status handling to ContinuationIn.vue
- added Hide/View Details button to PendingTemplate.vue
- updated body in ContinuationIn.vue (pending)
- added misc properties to interfaces as needed
- updated unit tests

* - specifically enable todo list tooltips
- specifically enable pending list tooltips
- auto-expand Continuation In bootstrap filing
- don't show rejected filing details button
- added store getter

* wip

---------

Co-authored-by: Severin Beauvais <severin.beauvais@gov.bc.ca>
---
 package-lock.json                             |   4 +-
 package.json                                  |   2 +-
 src/App.vue                                   |   3 +-
 .../Dashboard/FilingHistoryList.vue           |   9 -
 .../FilingHistoryList/FilingTemplate.vue      |  23 ++-
 ...eEffective.vue => BodyFutureEffective.vue} |   4 +-
 ...ing.vue => BodyFutureEffectivePending.vue} |   4 +-
 .../filings/AlterationFiling.vue              |  24 +--
 .../filings/AmalgamationFiling.vue            |  24 +--
 .../filings/ChangeOfAddress.vue               |   8 +-
 .../filings/ContinuationIn.vue                |  80 ++++++--
 .../filings/DissolutionVoluntary.vue          |  24 +--
 .../filings/IncorporationApplication.vue      |  24 +--
 ...ing.vue => SubtitleCoaFiledAndPending.vue} |   4 +-
 ...edAndPaid.vue => SubtitleFiledAndPaid.vue} |   6 +-
 ...id.vue => SubtitleFiledAndPendingPaid.vue} |   6 +-
 ...id.vue => SubtitleFutureEffectivePaid.vue} |   6 +-
 .../subtitles/SubtitleRejected.vue            |  72 +++++++
 src/components/Dashboard/PendingList.vue      |  11 +-
 .../Dashboard/PendingList/PendingTemplate.vue |  43 +++--
 .../PendingList/filings/ContinuationIn.vue    |  54 +++++-
 src/components/Dashboard/StaffNotation.vue    |   6 -
 src/components/Dashboard/TodoList.vue         | 176 ++++++++++++++----
 src/interfaces/api-filing-interface.ts        |   3 +
 src/interfaces/api-task-interface.ts          |   3 +-
 src/interfaces/todo-item-interface.ts         |   6 +
 src/stores/rootStore.ts                       |  44 +++--
 ...ve.spec.ts => BodyFutureEffective.spec.ts} |  14 +-
 ....ts => BodyFutureEffectivePending.spec.ts} |  14 +-
 tests/unit/FilingHistoryList1.spec.ts         |  77 ++++----
 tests/unit/FilingHistoryList2.spec.ts         |  12 +-
 31 files changed, 538 insertions(+), 252 deletions(-)
 rename src/components/Dashboard/FilingHistoryList/bodies/{FutureEffective.vue => BodyFutureEffective.vue} (96%)
 rename src/components/Dashboard/FilingHistoryList/bodies/{FutureEffectivePending.vue => BodyFutureEffectivePending.vue} (95%)
 rename src/components/Dashboard/FilingHistoryList/subtitles/{CoaFiledAndPending.vue => SubtitleCoaFiledAndPending.vue} (92%)
 rename src/components/Dashboard/FilingHistoryList/subtitles/{FiledAndPaid.vue => SubtitleFiledAndPaid.vue} (81%)
 rename src/components/Dashboard/FilingHistoryList/subtitles/{FiledAndPendingPaid.vue => SubtitleFiledAndPendingPaid.vue} (92%)
 rename src/components/Dashboard/FilingHistoryList/subtitles/{FutureEffectivePaid.vue => SubtitleFutureEffectivePaid.vue} (94%)
 create mode 100644 src/components/Dashboard/FilingHistoryList/subtitles/SubtitleRejected.vue
 rename tests/unit/{FutureEffective.spec.ts => BodyFutureEffective.spec.ts} (93%)
 rename tests/unit/{FutureEffectivePending.spec.ts => BodyFutureEffectivePending.spec.ts} (90%)

diff --git a/package-lock.json b/package-lock.json
index 76f61fe18..e3b1370a4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "business-filings-ui",
-  "version": "7.3.15",
+  "version": "7.3.16",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "business-filings-ui",
-      "version": "7.3.15",
+      "version": "7.3.16",
       "dependencies": {
         "@babel/compat-data": "^7.21.5",
         "@bcrs-shared-components/base-address": "2.0.9",
diff --git a/package.json b/package.json
index cc52fcc40..9a2ccaf73 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "business-filings-ui",
-  "version": "7.3.15",
+  "version": "7.3.16",
   "private": true,
   "appName": "Filings UI",
   "sbcName": "SBC Common Components",
diff --git a/src/App.vue b/src/App.vue
index de8afc99c..2f86f220c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -751,7 +751,8 @@ export default class App extends Mixins(
         applicationDate: this.dateToYyyyMmDd(this.apiToDate(header.date)),
         legalFilings: [header.name],
         order: data.courtOrder
-      }
+      },
+      latestReviewComment: header.latestReviewComment
     } as ApiFilingIF
     this.setFilings([filingItem])
   }
diff --git a/src/components/Dashboard/FilingHistoryList.vue b/src/components/Dashboard/FilingHistoryList.vue
index 99ea4e7a5..29c227570 100644
--- a/src/components/Dashboard/FilingHistoryList.vue
+++ b/src/components/Dashboard/FilingHistoryList.vue
@@ -219,19 +219,10 @@ export default class FilingHistoryList extends Mixins(FilingMixin) {
   max-height: 60rem;
 }
 
-.filing-history-item {
-  padding: 1.25rem 1.5rem;
-  pointer-events: none; // disable expansion generally
-}
-
 :deep(.v-expansion-panel-header) {
   min-height: auto !important;
   padding: 0;
   margin-top: 0.25rem;
-
-  .v-expansion-panel-header__icon {
-    display: none;
-  }
 }
 
 // specifically enable anchors, buttons, the pending alert icon and tooltips
diff --git a/src/components/Dashboard/FilingHistoryList/FilingTemplate.vue b/src/components/Dashboard/FilingHistoryList/FilingTemplate.vue
index 0c3274654..c578a6b51 100644
--- a/src/components/Dashboard/FilingHistoryList/FilingTemplate.vue
+++ b/src/components/Dashboard/FilingHistoryList/FilingTemplate.vue
@@ -13,13 +13,13 @@
           </h3>
 
           <slot name="subtitle">
-            <FiledAndPendingPaid
+            <SubtitleFiledAndPendingPaid
               v-if="isStatusPaid"
               class="item-header-subtitle"
               :filing="filing"
               :index="index"
             />
-            <FiledAndPaid
+            <SubtitleFiledAndPaid
               v-else
               class="item-header-subtitle"
               :filing="filing"
@@ -63,7 +63,7 @@
       <slot name="body">
         <!-- is this a generic paid (not yet completed) filing? -->
         <div
-          v-if="isStatusPaid"
+          v-if="isStatusPaid || isStatusApproved"
           class="body-2"
         >
           <h4>Filing Pending</h4>
@@ -137,21 +137,21 @@ import { ApiFilingIF } from '@/interfaces'
 import { EnumUtilities } from '@/services'
 import { FilingNames } from '@bcrs-shared-components/enums'
 import { ContactInfo } from '@/components/common'
+import { useFilingHistoryListStore } from '@/stores'
 import DetailsList from './DetailsList.vue'
 import DocumentsList from './DocumentsList.vue'
-import FiledAndPaid from './subtitles/FiledAndPaid.vue'
-import FiledAndPendingPaid from './subtitles/FiledAndPendingPaid.vue'
 import HeaderActions from './HeaderActions.vue'
-import { useFilingHistoryListStore } from '@/stores'
+import SubtitleFiledAndPaid from './subtitles/SubtitleFiledAndPaid.vue'
+import SubtitleFiledAndPendingPaid from './subtitles/SubtitleFiledAndPendingPaid.vue'
 
 @Component({
   components: {
     ContactInfo,
     DetailsList,
     DocumentsList,
-    FiledAndPaid,
-    FiledAndPendingPaid,
-    HeaderActions
+    HeaderActions,
+    SubtitleFiledAndPaid,
+    SubtitleFiledAndPendingPaid
   }
 })
 export default class FilingTemplate extends Vue {
@@ -165,6 +165,11 @@ export default class FilingTemplate extends Vue {
     return EnumUtilities.isStatusPaid(this.filing)
   }
 
+  /** Whether this filing is in Approved status. */
+  get isStatusApproved (): boolean {
+    return EnumUtilities.isStatusApproved(this.filing)
+  }
+
   /** The title of this filing. */
   get title (): string {
     if (EnumUtilities.isTypeAlteration(this.filing)) return FilingNames.ALTERATION
diff --git a/src/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue b/src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue
similarity index 96%
rename from src/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue
rename to src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue
index 2015ee364..4330aa905 100644
--- a/src/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue
+++ b/src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="future-effective body-2">
+  <div class="future-effective-body body-2">
     <h4>{{ _.subtitle }}</h4>
 
     <p>
@@ -41,7 +41,7 @@ import { useBusinessStore } from '@/stores'
 @Component({
   components: { ContactInfo }
 })
-export default class FutureEffective extends Vue {
+export default class BodyFutureEffective extends Vue {
   @Getter(useBusinessStore) getLegalName!: string
 
   /** The subject filing. */
diff --git a/src/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue b/src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue
similarity index 95%
rename from src/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue
rename to src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue
index 5a558defc..7741db99e 100644
--- a/src/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue
+++ b/src/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="future-effective-pending body-2">
+  <div class="body-future-effective-pending body-2">
     <h4>{{ _.subtitle }}</h4>
 
     <p>
@@ -35,7 +35,7 @@ import { useBusinessStore } from '@/stores'
 @Component({
   components: { ContactInfo }
 })
-export default class FutureEffectivePending extends Vue {
+export default class BodyFutureEffectivePending extends Vue {
   @Getter(useBusinessStore) getLegalName!: string
 
   /** The subject filing. */
diff --git a/src/components/Dashboard/FilingHistoryList/filings/AlterationFiling.vue b/src/components/Dashboard/FilingHistoryList/filings/AlterationFiling.vue
index 0c7616532..262edd702 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/AlterationFiling.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/AlterationFiling.vue
@@ -5,14 +5,14 @@
     :index="index"
   >
     <template #subtitle>
-      <FiledAndPendingPaid
+      <SubtitleFiledAndPendingPaid
         v-if="isFutureEffectivePending"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
 
-      <FutureEffectivePaid
+      <SubtitleFutureEffectivePaid
         v-else-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
@@ -21,12 +21,12 @@
     </template>
 
     <template #body>
-      <FutureEffectivePending
+      <BodyFutureEffectivePending
         v-if="isFutureEffectivePending"
         :filing="filing"
       />
 
-      <FutureEffective
+      <BodyFutureEffective
         v-else-if="isFutureEffective"
         :filing="filing"
       />
@@ -63,21 +63,21 @@ import { CorpTypeCd, GetCorpFullDescription } from '@bcrs-shared-components/corp
 import { DateTooltip } from '@/components/common'
 import { ApiFilingIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import FiledAndPendingPaid from '../subtitles/FiledAndPendingPaid.vue'
+import SubtitleFiledAndPendingPaid from '../subtitles/SubtitleFiledAndPendingPaid.vue'
 import FilingTemplate from '../FilingTemplate.vue'
-import FutureEffective from '../bodies/FutureEffective.vue'
-import FutureEffectivePaid from '../subtitles/FutureEffectivePaid.vue'
-import FutureEffectivePending from '../bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '../bodies/BodyFutureEffective.vue'
+import SubtitleFutureEffectivePaid from '../subtitles/SubtitleFutureEffectivePaid.vue'
+import BodyFutureEffectivePending from '../bodies/BodyFutureEffectivePending.vue'
 import { useBusinessStore } from '@/stores'
 
 @Component({
   components: {
+    BodyFutureEffective,
+    BodyFutureEffectivePending,
     DateTooltip,
-    FiledAndPendingPaid,
     FilingTemplate,
-    FutureEffective,
-    FutureEffectivePaid,
-    FutureEffectivePending
+    SubtitleFiledAndPendingPaid,
+    SubtitleFutureEffectivePaid
   }
 })
 export default class AlterationFiling extends Vue {
diff --git a/src/components/Dashboard/FilingHistoryList/filings/AmalgamationFiling.vue b/src/components/Dashboard/FilingHistoryList/filings/AmalgamationFiling.vue
index 985438b18..1fb819628 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/AmalgamationFiling.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/AmalgamationFiling.vue
@@ -5,14 +5,14 @@
     :index="index"
   >
     <template #subtitle>
-      <FiledAndPendingPaid
+      <SubtitleFiledAndPendingPaid
         v-if="isFutureEffectivePending"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
 
-      <FutureEffectivePaid
+      <SubtitleFutureEffectivePaid
         v-else-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
@@ -21,12 +21,12 @@
     </template>
 
     <template #body>
-      <FutureEffectivePending
+      <BodyFutureEffectivePending
         v-if="isFutureEffectivePending"
         :filing="filing"
       />
 
-      <FutureEffective
+      <BodyFutureEffective
         v-else-if="isFutureEffective"
         :filing="filing"
       />
@@ -63,20 +63,20 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
 import { Getter } from 'pinia-class'
 import { ApiFilingIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import FiledAndPendingPaid from '../subtitles/FiledAndPendingPaid.vue'
+import SubtitleFiledAndPendingPaid from '../subtitles/SubtitleFiledAndPendingPaid.vue'
 import FilingTemplate from '../FilingTemplate.vue'
-import FutureEffective from '../bodies/FutureEffective.vue'
-import FutureEffectivePaid from '../subtitles/FutureEffectivePaid.vue'
-import FutureEffectivePending from '../bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '../bodies/BodyFutureEffective.vue'
+import SubtitleFutureEffectivePaid from '../subtitles/SubtitleFutureEffectivePaid.vue'
+import BodyFutureEffectivePending from '../bodies/BodyFutureEffectivePending.vue'
 import { useBusinessStore, useConfigurationStore } from '@/stores'
 
 @Component({
   components: {
-    FiledAndPendingPaid,
+    BodyFutureEffective,
+    BodyFutureEffectivePending,
     FilingTemplate,
-    FutureEffective,
-    FutureEffectivePaid,
-    FutureEffectivePending
+    SubtitleFiledAndPendingPaid,
+    SubtitleFutureEffectivePaid
   }
 })
 export default class AmalgamationFiling extends Vue {
diff --git a/src/components/Dashboard/FilingHistoryList/filings/ChangeOfAddress.vue b/src/components/Dashboard/FilingHistoryList/filings/ChangeOfAddress.vue
index 668345883..51f95098b 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/ChangeOfAddress.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/ChangeOfAddress.vue
@@ -5,7 +5,7 @@
     :index="index"
   >
     <template #subtitle>
-      <CoaFiledAndPending
+      <SubtitleCoaFiledAndPending
         v-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
@@ -26,14 +26,14 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
 import { Getter } from 'pinia-class'
 import { ApiFilingIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import CoaFiledAndPending from '../subtitles/CoaFiledAndPending.vue'
+import SubtitleCoaFiledAndPending from '../subtitles/SubtitleCoaFiledAndPending.vue'
 import FilingTemplate from '../FilingTemplate.vue'
 import { useBusinessStore } from '@/stores'
 
 @Component({
   components: {
-    CoaFiledAndPending,
-    FilingTemplate
+    FilingTemplate,
+    SubtitleCoaFiledAndPending
   }
 })
 export default class ChangeOfAddress extends Vue {
diff --git a/src/components/Dashboard/FilingHistoryList/filings/ContinuationIn.vue b/src/components/Dashboard/FilingHistoryList/filings/ContinuationIn.vue
index 2d00d5694..a0cc7be93 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/ContinuationIn.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/ContinuationIn.vue
@@ -5,32 +5,57 @@
     :index="index"
   >
     <template #subtitle>
-      <FiledAndPendingPaid
+      <SubtitleFiledAndPendingPaid
         v-if="isFutureEffectivePending"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
 
-      <FutureEffectivePaid
+      <SubtitleFutureEffectivePaid
         v-else-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
+
+      <SubtitleRejected
+        v-else-if="isStatusRejected"
+        class="item-header-subtitle"
+        :filing="filing"
+        :index="index"
+      />
     </template>
 
     <template #body>
-      <FutureEffectivePending
+      <BodyFutureEffectivePending
         v-if="isFutureEffectivePending"
         :filing="filing"
       />
 
-      <FutureEffective
+      <BodyFutureEffective
         v-else-if="isFutureEffective"
         :filing="filing"
       />
 
+      <!-- rejected bootstrap filing -->
+      <div
+        v-else-if="isStatusRejected"
+        class="rejected-continuation-in-details"
+      >
+        <p class="mt-0">
+          This {{ filing.displayName }} is rejected for the following reasons:
+        </p>
+        <p>
+          {{ filing.latestReviewComment || '[undefined staff rejection message]' }}
+        </p>
+        <p>
+          You will receive a refund within 10 business days. Please submit a new application if you would
+          like to continue your business into B.C.
+        </p>
+      </div>
+
+      <!-- completed bootstrap filing -->
       <div
         v-else-if="!!tempRegNumber && isStatusCompleted"
         class="completed-continuation-in-details"
@@ -60,23 +85,25 @@
 
 <script lang="ts">
 import { Component, Prop, Vue } from 'vue-property-decorator'
-import { Getter } from 'pinia-class'
+import { Action, Getter } from 'pinia-class'
 import { ApiFilingIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import FiledAndPendingPaid from '../subtitles/FiledAndPendingPaid.vue'
+import SubtitleFiledAndPendingPaid from '../subtitles/SubtitleFiledAndPendingPaid.vue'
 import FilingTemplate from '../FilingTemplate.vue'
-import FutureEffective from '../bodies/FutureEffective.vue'
-import FutureEffectivePaid from '../subtitles/FutureEffectivePaid.vue'
-import FutureEffectivePending from '../bodies/FutureEffectivePending.vue'
-import { useBusinessStore, useConfigurationStore } from '@/stores'
+import BodyFutureEffective from '../bodies/BodyFutureEffective.vue'
+import SubtitleFutureEffectivePaid from '../subtitles/SubtitleFutureEffectivePaid.vue'
+import BodyFutureEffectivePending from '../bodies/BodyFutureEffectivePending.vue'
+import { useBusinessStore, useConfigurationStore, useFilingHistoryListStore } from '@/stores'
+import SubtitleRejected from '../subtitles/SubtitleRejected.vue'
 
 @Component({
   components: {
-    FiledAndPendingPaid,
+    BodyFutureEffective,
+    BodyFutureEffectivePending,
     FilingTemplate,
-    FutureEffective,
-    FutureEffectivePaid,
-    FutureEffectivePending
+    SubtitleFiledAndPendingPaid,
+    SubtitleFutureEffectivePaid,
+    SubtitleRejected
   }
 })
 export default class ContinuationIn extends Vue {
@@ -87,11 +114,18 @@ export default class ContinuationIn extends Vue {
   @Getter(useBusinessStore) getLegalName!: string
   @Getter(useConfigurationStore) getDashboardUrl!: string
 
+  @Action(useFilingHistoryListStore) setPanel!: (x: number) => void
+
   /** The Temporary Registration Number string (may be null). */
   get tempRegNumber (): string {
     return sessionStorage.getItem('TEMP_REG_NUMBER')
   }
 
+  /** Whether this filing is in Rejected status. */
+  get isStatusRejected (): boolean {
+    return EnumUtilities.isStatusRejected(this.filing)
+  }
+
   /** Whether this filing is in Complete status. */
   get isStatusCompleted (): boolean {
     return EnumUtilities.isStatusCompleted(this.filing)
@@ -100,7 +134,10 @@ export default class ContinuationIn extends Vue {
   /** Whether this filing is Future Effective Pending (overdue). */
   get isFutureEffectivePending (): boolean {
     return (
-      EnumUtilities.isStatusPaid(this.filing) &&
+      (
+        EnumUtilities.isStatusApproved(this.filing) ||
+        EnumUtilities.isStatusPaid(this.filing)
+      ) &&
       this.filing.isFutureEffective &&
       DateUtilities.isDatePast(this.filing.effectiveDate)
     )
@@ -109,7 +146,10 @@ export default class ContinuationIn extends Vue {
   /** Whether this filing is Future Effective (not yet completed). */
   get isFutureEffective (): boolean {
     return (
-      EnumUtilities.isStatusPaid(this.filing) &&
+      (
+        EnumUtilities.isStatusApproved(this.filing) ||
+        EnumUtilities.isStatusPaid(this.filing)
+      ) &&
       this.filing.isFutureEffective &&
       DateUtilities.isDateFuture(this.filing.effectiveDate)
     )
@@ -122,6 +162,14 @@ export default class ContinuationIn extends Vue {
     return 'Unknown Name'
   }
 
+  mounted (): void {
+    if (this.tempRegNumber) {
+      // auto-expand bootstrap filing
+      // assumes this the only filing in the Filing History list (which it should be)
+      this.setPanel(0)
+    }
+  }
+
   /** Reloads Filings UI using business id instead of temporary registration number. */
   reloadWithBusinessId (): void {
     // build the URL to the business dashboard with the business id and any URL parameters
diff --git a/src/components/Dashboard/FilingHistoryList/filings/DissolutionVoluntary.vue b/src/components/Dashboard/FilingHistoryList/filings/DissolutionVoluntary.vue
index ae823212d..359c79839 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/DissolutionVoluntary.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/DissolutionVoluntary.vue
@@ -5,14 +5,14 @@
     :index="index"
   >
     <template #subtitle>
-      <FiledAndPendingPaid
+      <SubtitleFiledAndPendingPaid
         v-if="isFutureEffectivePending"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
 
-      <FutureEffectivePaid
+      <SubtitleFutureEffectivePaid
         v-else-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
@@ -21,12 +21,12 @@
     </template>
 
     <template #body>
-      <FutureEffectivePending
+      <BodyFutureEffectivePending
         v-if="isFutureEffectivePending"
         :filing="filing"
       />
 
-      <FutureEffective
+      <BodyFutureEffective
         v-else-if="isFutureEffective"
         :filing="filing"
       />
@@ -76,20 +76,20 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
 import { Getter } from 'pinia-class'
 import { ApiFilingIF, DissolutionConfirmationResourceIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import FiledAndPendingPaid from '../subtitles/FiledAndPendingPaid.vue'
+import SubtitleFiledAndPendingPaid from '../subtitles/SubtitleFiledAndPendingPaid.vue'
 import FilingTemplate from '../FilingTemplate.vue'
-import FutureEffective from '../bodies/FutureEffective.vue'
-import FutureEffectivePaid from '../subtitles/FutureEffectivePaid.vue'
-import FutureEffectivePending from '../bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '../bodies/BodyFutureEffective.vue'
+import SubtitleFutureEffectivePaid from '../subtitles/SubtitleFutureEffectivePaid.vue'
+import BodyFutureEffectivePending from '../bodies/BodyFutureEffectivePending.vue'
 import { useBusinessStore, useRootStore } from '@/stores'
 
 @Component({
   components: {
-    FiledAndPendingPaid,
+    BodyFutureEffective,
+    BodyFutureEffectivePending,
     FilingTemplate,
-    FutureEffective,
-    FutureEffectivePaid,
-    FutureEffectivePending
+    SubtitleFiledAndPendingPaid,
+    SubtitleFutureEffectivePaid
   }
 })
 export default class DissolutionVoluntary extends Vue {
diff --git a/src/components/Dashboard/FilingHistoryList/filings/IncorporationApplication.vue b/src/components/Dashboard/FilingHistoryList/filings/IncorporationApplication.vue
index f823c5259..ca64dd545 100644
--- a/src/components/Dashboard/FilingHistoryList/filings/IncorporationApplication.vue
+++ b/src/components/Dashboard/FilingHistoryList/filings/IncorporationApplication.vue
@@ -5,14 +5,14 @@
     :index="index"
   >
     <template #subtitle>
-      <FiledAndPendingPaid
+      <SubtitleFiledAndPendingPaid
         v-if="isFutureEffectivePending"
         class="item-header-subtitle"
         :filing="filing"
         :index="index"
       />
 
-      <FutureEffectivePaid
+      <SubtitleFutureEffectivePaid
         v-else-if="isFutureEffective"
         class="item-header-subtitle"
         :filing="filing"
@@ -21,12 +21,12 @@
     </template>
 
     <template #body>
-      <FutureEffectivePending
+      <BodyFutureEffectivePending
         v-if="isFutureEffectivePending"
         :filing="filing"
       />
 
-      <FutureEffective
+      <BodyFutureEffective
         v-else-if="isFutureEffective"
         :filing="filing"
       />
@@ -63,20 +63,20 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
 import { Getter } from 'pinia-class'
 import { ApiFilingIF } from '@/interfaces'
 import { DateUtilities, EnumUtilities } from '@/services'
-import FiledAndPendingPaid from '../subtitles/FiledAndPendingPaid.vue'
+import SubtitleFiledAndPendingPaid from '../subtitles/SubtitleFiledAndPendingPaid.vue'
 import FilingTemplate from '../FilingTemplate.vue'
-import FutureEffective from '../bodies/FutureEffective.vue'
-import FutureEffectivePaid from '../subtitles/FutureEffectivePaid.vue'
-import FutureEffectivePending from '../bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '../bodies/BodyFutureEffective.vue'
+import SubtitleFutureEffectivePaid from '../subtitles/SubtitleFutureEffectivePaid.vue'
+import BodyFutureEffectivePending from '../bodies/BodyFutureEffectivePending.vue'
 import { useBusinessStore, useConfigurationStore } from '@/stores'
 
 @Component({
   components: {
-    FiledAndPendingPaid,
+    BodyFutureEffective,
+    BodyFutureEffectivePending,
     FilingTemplate,
-    FutureEffective,
-    FutureEffectivePaid,
-    FutureEffectivePending
+    SubtitleFiledAndPendingPaid,
+    SubtitleFutureEffectivePaid
   }
 })
 export default class IncorporationApplication extends Vue {
diff --git a/src/components/Dashboard/FilingHistoryList/subtitles/CoaFiledAndPending.vue b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleCoaFiledAndPending.vue
similarity index 92%
rename from src/components/Dashboard/FilingHistoryList/subtitles/CoaFiledAndPending.vue
rename to src/components/Dashboard/FilingHistoryList/subtitles/SubtitleCoaFiledAndPending.vue
index 65af75b78..760caa6d3 100644
--- a/src/components/Dashboard/FilingHistoryList/subtitles/CoaFiledAndPending.vue
+++ b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleCoaFiledAndPending.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="coa-filed-and-pending">
+  <div class="subtitle-coa-filed-and-pending">
     <span>FILED AND PENDING <FiledLabel :filing="filing" /></span>
 
     <v-tooltip
@@ -31,7 +31,7 @@ import FiledLabel from '../FiledLabel.vue'
 @Component({
   components: { FiledLabel }
 })
-export default class CoaFiledAndPending extends Vue {
+export default class SubtitleCoaFiledAndPending extends Vue {
   @Prop({ required: true }) readonly filing!: ApiFilingIF
   @Prop({ required: true }) readonly index!: number
 
diff --git a/src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPaid.vue b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPaid.vue
similarity index 81%
rename from src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPaid.vue
rename to src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPaid.vue
index ebde7c764..5ad77430d 100644
--- a/src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPaid.vue
+++ b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPaid.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="filed-and-paid">
+  <div class="subtitle-filed-and-paid">
     <span>FILED AND PAID <FiledLabel :filing="filing" /></span>
   </div>
 </template>
@@ -12,7 +12,7 @@ import FiledLabel from '../FiledLabel.vue'
 @Component({
   components: { FiledLabel }
 })
-export default class FiledAndPaid extends Vue {
+export default class SubtitleFiledAndPaid extends Vue {
   @Prop({ required: true }) readonly filing!: ApiFilingIF
   @Prop({ required: true }) readonly index!: number
 }
@@ -21,7 +21,7 @@ export default class FiledAndPaid extends Vue {
 <style lang="scss" scoped>
 @import "@/assets/styles/theme.scss";
 
-.filed-and-paid {
+.subtitle-filed-and-paid {
   color: $gray7;
 }
 </style>
diff --git a/src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPendingPaid.vue b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPendingPaid.vue
similarity index 92%
rename from src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPendingPaid.vue
rename to src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPendingPaid.vue
index 8cdb75e75..a6a05ad05 100644
--- a/src/components/Dashboard/FilingHistoryList/subtitles/FiledAndPendingPaid.vue
+++ b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFiledAndPendingPaid.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="filed-and-pending-paid">
+  <div class="subtitle-filed-and-pending-paid">
     <span class="orange--text text--darken-2">FILED AND PENDING</span>
     <span class="vert-pipe" />
     <span>PAID <FiledLabel :filing="filing" /></span>
@@ -29,7 +29,7 @@ import { useFilingHistoryListStore, useRootStore } from '@/stores'
 @Component({
   components: { FiledLabel }
 })
-export default class FiledAndPendingPaid extends Vue {
+export default class SubtitleFiledAndPendingPaid extends Vue {
   @Prop({ required: true }) readonly filing!: ApiFilingIF
   @Prop({ required: true }) readonly index!: number
 
@@ -41,7 +41,7 @@ export default class FiledAndPendingPaid extends Vue {
 <style lang="scss" scoped>
 @import "@/assets/styles/theme.scss";
 
-.filed-and-pending-paid {
+.subtitle-filed-and-pending-paid {
   color: $gray7;
 }
 
diff --git a/src/components/Dashboard/FilingHistoryList/subtitles/FutureEffectivePaid.vue b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFutureEffectivePaid.vue
similarity index 94%
rename from src/components/Dashboard/FilingHistoryList/subtitles/FutureEffectivePaid.vue
rename to src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFutureEffectivePaid.vue
index 496376e33..233063558 100644
--- a/src/components/Dashboard/FilingHistoryList/subtitles/FutureEffectivePaid.vue
+++ b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleFutureEffectivePaid.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="future-effective-paid">
+  <div class="subtitle-future-effective-paid">
     <span v-if="isTypeIncorporationApplication">FUTURE EFFECTIVE INCORPORATION</span>
     <span v-else-if="isTypeAlteration">FUTURE EFFECTIVE ALTERATION</span>
     <span v-else-if="isTypeDissolutionVoluntary">FUTURE EFFECTIVE DISSOLUTION</span>
@@ -33,7 +33,7 @@ import { useFilingHistoryListStore, useRootStore } from '@/stores'
 @Component({
   components: { FiledLabel }
 })
-export default class FutureEffectivePaid extends Vue {
+export default class SubtitleFutureEffectivePaid extends Vue {
   @Prop({ required: true }) readonly filing!: ApiFilingIF
   @Prop({ required: true }) readonly index!: number
 
@@ -60,7 +60,7 @@ export default class FutureEffectivePaid extends Vue {
 <style lang="scss" scoped>
 @import "@/assets/styles/theme.scss";
 
-.future-effective-paid {
+.subtitle-future-effective-paid {
   color: $gray7;
 }
 
diff --git a/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleRejected.vue b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleRejected.vue
new file mode 100644
index 000000000..5b2a3a133
--- /dev/null
+++ b/src/components/Dashboard/FilingHistoryList/subtitles/SubtitleRejected.vue
@@ -0,0 +1,72 @@
+<template>
+  <div class="subtitle-rejected">
+    <span class="orange--text text--darken-2">REJECTED</span>
+    <span class="vert-pipe" />
+    <span>PAID (filed by {{ filing.submitter }} on <DateTooltip :date="submittedDate" />)</span>
+
+    <!-- <v-btn
+      class="details-btn"
+      outlined
+      color="orange darken-2"
+      :ripple="false"
+      @click.stop="toggleFilingHistoryItem(index)"
+    >
+      <v-icon>mdi-alert</v-icon>
+      <span class="view-details ml-1">View Details</span>
+      <span class="hide-details ml-1">Hide Details</span>
+    </v-btn> -->
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from 'vue-property-decorator'
+import { Action } from 'pinia-class'
+import { ApiFilingIF } from '@/interfaces'
+import { useFilingHistoryListStore } from '@/stores'
+import { DateTooltip } from '@/components/common'
+import FiledLabel from '../FiledLabel.vue'
+
+@Component({
+  components: {
+    DateTooltip,
+    FiledLabel
+  }
+})
+export default class SubtitleRejected extends Vue {
+  @Prop({ required: true }) readonly filing!: ApiFilingIF
+  @Prop({ required: true }) readonly index!: number
+
+  @Action(useFilingHistoryListStore) toggleFilingHistoryItem!: (x: number) => Promise<void>
+
+  get submittedDate (): Date {
+    return new Date(this.filing.submittedDate)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/theme.scss";
+
+.subtitle-rejected {
+  color: $gray7;
+}
+
+.details-btn {
+  border: none;
+}
+
+// when panel is active, hide View button
+.v-expansion-panel.v-expansion-panel--active .view-details {
+  display: none;
+}
+
+// when panel is not active, hide Hide button
+.v-expansion-panel:not(.v-expansion-panel--active) .hide-details {
+  display: none;
+}
+
+// when panel is active and this is a bootstrap filing, hide button
+.v-expansion-panel.v-expansion-panel--active .bootstrap-filing {
+  display: none;
+}
+</style>
diff --git a/src/components/Dashboard/PendingList.vue b/src/components/Dashboard/PendingList.vue
index 85ca0f8d1..29da8a84e 100644
--- a/src/components/Dashboard/PendingList.vue
+++ b/src/components/Dashboard/PendingList.vue
@@ -7,6 +7,7 @@
         :key="index"
         :item="item"
         :index="index"
+        @toggle-panel="togglePanel(index)"
       />
     </v-expansion-panels>
   </div>
@@ -50,7 +51,7 @@ export default class PendingList extends Vue {
     if (this.highlightId) {
       const index = this.getPendingsList.findIndex(p => (p.header.filingId === this.highlightId))
       if (index >= 0) { // safety check
-        this.toggleItem(index)
+        this.togglePanel(index)
       }
     } else {
       // otherwise, open up the first item
@@ -58,9 +59,9 @@ export default class PendingList extends Vue {
     }
   }
 
-  private toggleItem (index: number): void {
+  togglePanel (item: number): void {
     // if panel is open, close it, else open it
-    this.panel = (this.panel === index) ? null : index
+    this.panel = (this.panel === item) ? null : item
   }
 }
 </script>
@@ -72,10 +73,6 @@ export default class PendingList extends Vue {
   min-height: auto !important;
   padding: 0;
   margin-top: 0.25rem;
-
-  .v-expansion-panel-header__icon {
-    display: none;
-  }
 }
 
 :deep(.v-expansion-panel-content__wrap) {
diff --git a/src/components/Dashboard/PendingList/PendingTemplate.vue b/src/components/Dashboard/PendingList/PendingTemplate.vue
index ebe647bf1..18e4ced5e 100644
--- a/src/components/Dashboard/PendingList/PendingTemplate.vue
+++ b/src/components/Dashboard/PendingList/PendingTemplate.vue
@@ -1,6 +1,6 @@
 <template>
   <v-expansion-panel
-    class="pending-template py-5 px-6"
+    class="pending-template align-items-top py-5 px-6"
     :disabled="true"
   >
     <v-expansion-panel-header>
@@ -9,6 +9,16 @@
           <h3 class="item-header-title">
             <slot name="title">
               <span>{{ item.displayName }}</span>
+              <v-btn
+                class="expand-btn ml-1"
+                outlined
+                color="primary"
+                :ripple="false"
+                @click.stop="$emit('toggle-panel')"
+              >
+                <v-icon>mdi-information-outline</v-icon>
+                <span>{{ (0 === index) ? "Hide Details" : "View Details" }}</span>
+              </v-btn>
             </slot>
           </h3>
 
@@ -19,10 +29,6 @@
               <span>PAID (filed by {{ submitter }} on <DateTooltip :date="submittedDate" />)</span>
             </div>
           </slot>
-
-          <slot name="details-button">
-            <!-- no default details button at this time -->
-          </slot>
         </div>
 
         <slot name="actions">
@@ -76,15 +82,30 @@ export default class PendingTemplate extends Vue {
 
 .item-header {
   line-height: 1.25rem;
-}
 
-.item-header-title {
-  font-weight: bold;
+  .item-header-title {
+    font-weight: bold;
+
+    .expand-btn {
+      margin-top: -1px;
+      padding-top: 1px;
+      border: none;
+
+      // specifically enable button on this disabled expansion panel
+      pointer-events: auto;
+    }
+  }
+
+  .item-header-subtitle {
+    color: $gray7;
+  }
 }
 
-.item-header-subtitle {
-  color: $gray7;
-  margin-top: 0.5rem;
+// specifically enable tooltips for this page
+:deep() {
+  .v-tooltip + div {
+    pointer-events: auto;
+  }
 }
 
 p {
diff --git a/src/components/Dashboard/PendingList/filings/ContinuationIn.vue b/src/components/Dashboard/PendingList/filings/ContinuationIn.vue
index ce6fa522e..8fb0313aa 100644
--- a/src/components/Dashboard/PendingList/filings/ContinuationIn.vue
+++ b/src/components/Dashboard/PendingList/filings/ContinuationIn.vue
@@ -3,12 +3,36 @@
     class="continuation-in"
     :item="item"
     :index="index"
+    @toggle-panel="$emit('toggle-panel')"
   >
     <template #body>
       <div class="body-2">
-        <p class="mb-0">
-          This {{ entityType }} Continuation Application is paid and awaiting staff review. We will
-          notify you of the results by email. You can also come back here to check on the progress.
+        <h4 v-if="isFutureEffectivePast || isFutureEffective">
+          Future Effective Incorporation
+        </h4>
+
+        <p
+          class="mb-0"
+          :class="{ 'mt-4': isFutureEffectivePast || isFutureEffective }"
+        >
+          This {{ entityType }} Continuation Application is paid. BC Registries will review your
+          Continuation Authorization documents and contact you with the results within 2 business days.
+        </p>
+
+        <p
+          v-if="isFutureEffectivePast"
+          class="mt-4 mb-0"
+        >
+          If approved, the incorporation date and time for {{ getLegalName || 'this company' }} will be
+          recorded as <strong>{{ effectiveDateTime || '[unknown]' }}</strong>.
+        </p>
+
+        <p
+          v-if="isFutureEffective"
+          class="mt-4 mb-0"
+        >
+          If approved, the incorporation date and time for {{ getLegalName || 'this company' }} will be
+          <strong>{{ effectiveDateTime || '[unknown]' }}</strong>.
         </p>
       </div>
     </template>
@@ -17,6 +41,9 @@
 
 <script lang="ts">
 import { Component, Prop, Vue } from 'vue-property-decorator'
+import { Getter } from 'pinia-class'
+import { useBusinessStore } from '@/stores'
+import { DateUtilities } from '@/services'
 import PendingTemplate from '../PendingTemplate.vue'
 import { GetCorpFullDescription } from '@bcrs-shared-components/corp-type-module'
 
@@ -29,9 +56,30 @@ export default class ContinuationIn extends Vue {
   @Prop({ required: true }) readonly item!: any
   @Prop({ required: true }) readonly index!: number
 
+  @Getter(useBusinessStore) getLegalName!: string
+
   get entityType (): string {
     return GetCorpFullDescription(this.item.business.legalType)
   }
+
+  get isFutureEffectivePast (): boolean {
+    return (
+      this.item.header.isFutureEffective &&
+      DateUtilities.isDatePast(this.item.header.effectiveDate)
+    )
+  }
+
+  get isFutureEffective (): boolean {
+    return (
+      this.item.header.isFutureEffective &&
+      DateUtilities.isDateFuture(this.item.header.effectiveDate)
+    )
+  }
+
+  get effectiveDateTime (): string {
+    const effectiveDate = this.item.header.effectiveDate
+    return effectiveDate ? DateUtilities.dateToPacificDateTime(new Date(effectiveDate)) : '[unknown]'
+  }
 }
 </script>
 
diff --git a/src/components/Dashboard/StaffNotation.vue b/src/components/Dashboard/StaffNotation.vue
index 7d3483208..ca5ff0d4d 100644
--- a/src/components/Dashboard/StaffNotation.vue
+++ b/src/components/Dashboard/StaffNotation.vue
@@ -433,12 +433,6 @@ export default class StaffNotation extends Mixins(AllowableActionsMixin, FilingM
 
 .staff-notation-container {
   display: inline-block;
-
-  .expand-btn {
-    letter-spacing: -0.01rem;
-    font-size: $px-14;
-    font-weight: 700;
-  }
 }
 
 // This class will be applied when addScrollbarOffset prop is true.
diff --git a/src/components/Dashboard/TodoList.vue b/src/components/Dashboard/TodoList.vue
index 2d4f7ecac..8f483c7b3 100644
--- a/src/components/Dashboard/TodoList.vue
+++ b/src/components/Dashboard/TodoList.vue
@@ -115,6 +115,7 @@
                 />
               </div>
 
+              <!-- all other subtitles -->
               <div
                 v-else
                 class="list-item__subtitle"
@@ -212,7 +213,7 @@
                   <span>DRAFT</span>
                 </div>
 
-                <!-- pending filing -->
+                <!-- pending (or pending correction) filing -->
                 <div
                   v-else-if="EnumUtilities.isStatusPending(item) || EnumUtilities.isStatusPendingCorrection(item)"
                   class="todo-subtitle"
@@ -253,6 +254,16 @@
                   <span v-if="inProcessFiling === item.filingId">PROCESSING...</span>
                   <span v-else>PAID</span>
                 </div>
+
+                <!-- change-requested filing -->
+                <div
+                  v-else-if="EnumUtilities.isStatusChangeRequested(item)"
+                  class="todo-subtitle pt-1"
+                >
+                  <span>CHANGE REQUESTED</span>
+                  <span class="vert-pipe" />
+                  <span>PAID (filed by {{ item.submitter }} on <DateTooltip :date="item.submittedDate" />)</span>
+                </div>
               </div> <!-- end of other subtitles -->
             </div> <!-- end of todo label -->
 
@@ -279,7 +290,7 @@
               </v-btn>
             </div>
 
-            <!-- Not affiliation invite (ie, rest of the todo actions) -->
+            <!-- all other todo actions -->
             <div
               v-else
               class="list-item__actions"
@@ -306,6 +317,16 @@
                   />
                 </template>
 
+                <!-- default task -->
+                <template v-if="item.isDefaultTask">
+                  <!-- no action button in this case -->
+                </template>
+
+                <!-- non-staff see no buttons for staff filings (cont out, conversion, correction, restoration) -->
+                <template v-else-if="!isRoleStaff && isStaffFiling(item)">
+                  <!-- no action button in this case -->
+                </template>
+
                 <!-- new annual report -->
                 <template v-else-if="EnumUtilities.isStatusNew(item) && EnumUtilities.isTypeAnnualReport(item)">
                   <v-btn
@@ -332,12 +353,7 @@
                   </v-btn>
                 </template>
 
-                <!-- non-staff see no buttons for staff filings -->
-                <template v-else-if="!isRoleStaff && isStaffFiling(item)">
-                  <!-- no action button in this case -->
-                </template>
-
-                <!-- draft filing - show Delete only -->
+                <!-- draft filing - Show Delete conditions only -->
                 <template v-else-if="EnumUtilities.isStatusDraft(item) && showDeleteOnly(item)">
                   <v-btn
                     class="btn-draft-delete"
@@ -504,6 +520,18 @@
                 <template v-else-if="EnumUtilities.isStatusPaid(item)">
                   <!-- no action button in this case -->
                 </template>
+
+                <!-- change-requested filing -->
+                <template v-else-if="EnumUtilities.isStatusChangeRequested(item)">
+                  <v-btn
+                    class="btn-draft-resume rounded-r"
+                    color="primary"
+                    :disabled="!item.enabled"
+                    @click.native.stop="doResumeFiling(item)"
+                  >
+                    <span>Make Changes</span>
+                  </v-btn>
+                </template>
               </div>
             </div> <!-- end of actions -->
           </div> <!-- end of list item -->
@@ -532,10 +560,7 @@
 
           <!-- is this a draft correction? -->
           <template v-else-if="EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeCorrection(item)">
-            <div
-              data-test-class="correction-draft"
-              class="todo-list-detail body-2"
-            >
+            <div class="todo-list-detail body-2">
               <p class="list-item__subtitle">
                 This filing is in review and has been saved as a draft.<br>
                 Normal processing times are 2 to 5 business days. Priority processing times are 1 to 2 business days.
@@ -548,10 +573,7 @@
 
           <!-- is this a correction in any other status? -->
           <template v-else-if="EnumUtilities.isTypeCorrection(item)">
-            <div
-              data-test-class="correction-pending"
-              class="todo-list-detail body-2"
-            >
+            <div class="todo-list-detail body-2">
               <p class="list-item__subtitle">
                 This filing is pending review by Registry Staff.<br>
                 Normal processing times are 2 to 5 business days. Priority processing times are 1 to 2 business days.
@@ -581,6 +603,18 @@
             <PaymentPending v-else />
           </template>
 
+          <!-- is this a change-requested item? -->
+          <template v-else-if="EnumUtilities.isStatusChangeRequested(item)">
+            <div class="todo-list-detail body-2">
+              <p class="list-item__subtitle">
+                This {{ item.title }} is paid but requires you to make the following changes:
+              </p>
+              <p class="list-item__subtitle">
+                {{ item.comment || '[undefined staff change request message]' }}
+              </p>
+            </div>
+          </template>
+
           <!-- does this item have an unsuccessful payment? -->
           <template v-else-if="EnumUtilities.isStatusError(item)">
             <PaymentUnsuccessful />
@@ -619,7 +653,7 @@ import axios from '@/axios-auth'
 import { GetFeatureFlag, navigate } from '@/utils'
 import { AffiliationErrorDialog, CancelPaymentErrorDialog, ConfirmDialog, DeleteErrorDialog }
   from '@/components/dialogs'
-import { ContactInfo, NameRequestInfo } from '@/components/common'
+import { ContactInfo, DateTooltip, NameRequestInfo } from '@/components/common'
 import AffiliationInvitationDetails from './TodoList/AffiliationInvitationDetails.vue'
 import ConversionDetails from './TodoList/ConversionDetails.vue'
 import CorrectionComment from './TodoList/CorrectionComment.vue'
@@ -664,6 +698,7 @@ import { useAuthenticationStore, useBusinessStore, useConfigurationStore, useFil
     AffiliationInvitationDetails,
     ConversionDetails,
     CorrectionComment,
+    DateTooltip,
     NameRequestInfo,
     ContactInfo,
     PaymentIncomplete,
@@ -799,18 +834,26 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
 
   /** Whether to show the details button with blue color. */
   showDetailsBtnBlue (item: TodoItemIF): boolean {
-    if (EnumUtilities.isStatusNew(item) && EnumUtilities.isTypeConversion(item)) return true
-    if (EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeConversion(item)) return true
-    if (EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeAmalgamationApplication(item) &&
-      item.nameRequest) return true
-    if (EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeContinuationIn(item) &&
-      item.nameRequest) return true
-    if (EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeIncorporationApplication(item) &&
-      item.nameRequest) return true
-    if (EnumUtilities.isStatusDraft(item) && EnumUtilities.isTypeRegistration(item) &&
-      item.nameRequest) return true
+    if (EnumUtilities.isStatusNew(item)) {
+      if (EnumUtilities.isTypeConversion(item)) return true
+    }
+
+    if (EnumUtilities.isStatusDraft(item)) {
+      if (EnumUtilities.isTypeConversion(item)) return true
+      if (EnumUtilities.isTypeAmalgamationApplication(item) && item.nameRequest) return true
+      if (EnumUtilities.isTypeContinuationIn(item) && item.nameRequest) return true
+      if (EnumUtilities.isTypeIncorporationApplication(item) && item.nameRequest) return true
+      if (EnumUtilities.isTypeRegistration(item) && item.nameRequest) return true
+    }
+
+    if (EnumUtilities.isStatusChangeRequested(item)) {
+      if (EnumUtilities.isTypeContinuationIn(item)) return true
+    }
+
     if (EnumUtilities.isStatusPending(item)) return true
+
     if (this.isAffiliationInvitation(item)) return true
+
     return false
   }
 
@@ -1123,7 +1166,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
           await this.loadContinuationOut(task)
           break
         case FilingTypes.CONTINUATION_IN:
-          await this.loadContinuationInApplication(task)
+          await this.loadContinuationIn(task)
           break
         case FilingTypes.CONVERSION:
           await this.loadConversion(task)
@@ -1147,8 +1190,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
           await this.loadSpecialResolution(task)
           break
         default:
-          // eslint-disable-next-line no-console
-          console.log('ERROR - invalid name in filing header =', header)
+          await this.loadDefaultTask(task)
           break
       }
     } else {
@@ -1187,7 +1229,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
-      console.log('ERROR - invalid header or dissolution or business in task =', task)
+      console.log('ERROR - invalid header or dissolution or business in filing =', filing)
     }
   }
 
@@ -1235,7 +1277,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
-      console.log('ERROR - invalid header or alteration or business in task =', task)
+      console.log('ERROR - invalid header or alteration or business in filing =', filing)
     }
   }
 
@@ -1477,7 +1519,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
     }
   }
 
-  async loadContinuationInApplication (task: ApiTaskIF): Promise<void> {
+  async loadContinuationIn (task: ApiTaskIF): Promise<void> {
     const filing = task.task.filing
     const header = filing.header
     const continuationIn = filing.continuationIn
@@ -1497,11 +1539,12 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
 
       // NB: continuationIn application may be undefined
       const haveData = Boolean(
-        continuationIn?.offices ||
+        continuationIn?.authorization ||
         continuationIn?.contactPoint ||
+        continuationIn?.foreignJurisdiction ||
+        continuationIn?.offices ||
         continuationIn?.parties ||
-        continuationIn?.shareClasses ||
-        continuationIn?.foreignJurisdiction
+        continuationIn?.shareStructure
       )
 
       const item: TodoItemIF = {
@@ -1518,13 +1561,22 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
         payErrorObj,
         isPayCompleted: (paymentStatusCode === 'COMPLETED'),
         isEmptyFiling: !haveData,
-        nameRequest: this.getNameRequest
+        nameRequest: this.getNameRequest,
+        submitter: header.submitter,
+        submittedDate: new Date(header.date), // API format
+        latestReviewComment: header?.latestReviewComment
       }
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
       console.log('ERROR - invalid header in filing =', filing)
     }
+
+    if (header.status === FilingStatus.CHANGE_REQUESTED) {
+      // special case: expand this task by default
+      // this assumes this the only task in the Todo list
+      this.panel = 0
+    }
   }
 
   async loadRegistration (task: ApiTaskIF): Promise<void> {
@@ -1772,7 +1824,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
-      console.log('ERROR - invalid header or business in filing =', filing)
+      console.log('ERROR - invalid header or continuationOut in filing =', filing)
     }
   }
 
@@ -1805,7 +1857,42 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
-      console.log('ERROR - invalid header or specialResolution in task =', task)
+      console.log('ERROR - invalid header or specialResolution in filing =', filing)
+    }
+  }
+
+  async loadDefaultTask (task: ApiTaskIF): Promise<void> {
+    const filing = task.task.filing
+    const header = filing.header
+    const business = filing.business
+
+    if (header) {
+      const corpFullDescription = GetCorpFullDescription(business.legalType)
+
+      const title = EnumUtilities.filingTypeToName(header.name)
+
+      const paymentStatusCode = header.paymentStatusCode
+      const payErrorObj = paymentStatusCode && await PayServices.getPayErrorObj(this.getPayApiUrl, paymentStatusCode)
+
+      const item: TodoItemIF = {
+        name: header.name,
+        filingId: header.filingId,
+        legalType: corpFullDescription,
+        title,
+        draftTitle: title,
+        status: header.status,
+        enabled: task.enabled,
+        order: task.order,
+        paymentMethod: header.paymentMethod || null,
+        paymentToken: header.paymentToken || null,
+        payErrorObj,
+        isPayCompleted: (paymentStatusCode === 'COMPLETED'),
+        isDefaultTask: true
+      }
+      this.todoItems.push(item)
+    } else {
+      // eslint-disable-next-line no-console
+      console.log('ERROR - invalid header in filing =', filing)
     }
   }
 
@@ -1841,7 +1928,7 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       this.todoItems.push(item)
     } else {
       // eslint-disable-next-line no-console
-      console.log('ERROR - invalid header or restoration in task =', task)
+      console.log('ERROR - invalid header or restoration in filing =', filing)
     }
   }
 
@@ -2220,9 +2307,9 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
     return title
   }
 
+  /** Loads data initially and when task list changes. */
   @Watch('getTasks', { immediate: true })
   async onTasksChanged (): Promise<void> {
-    // load data initially and when task list changes
     await this.loadData()
   }
 
@@ -2272,6 +2359,13 @@ export default class TodoList extends Mixins(AllowableActionsMixin, DateMixin) {
       margin-top: 1rem;
     }
   }
+
+  // specifically enable tooltips for this page
+  :deep() {
+    .v-tooltip + div {
+      pointer-events: auto;
+    }
+  }
 }
 
 .todo-item .list-item {
diff --git a/src/interfaces/api-filing-interface.ts b/src/interfaces/api-filing-interface.ts
index ffb123ed1..cde54e021 100644
--- a/src/interfaces/api-filing-interface.ts
+++ b/src/interfaces/api-filing-interface.ts
@@ -34,6 +34,9 @@ export interface ApiFilingIF {
   correctionFilingId?: string // ID of this filing's correction
   correctionLink?: string // URL to fetch this filing's correction
 
+  // continuation in filings only
+  latestReviewComment?: string
+
   // filing-specific data (not always present)
   data?: {
     applicationDate: ApiDateTimeUtc
diff --git a/src/interfaces/api-task-interface.ts b/src/interfaces/api-task-interface.ts
index f7ba70f97..230833006 100644
--- a/src/interfaces/api-task-interface.ts
+++ b/src/interfaces/api-task-interface.ts
@@ -34,7 +34,8 @@ export interface ApiHeaderIF {
   paymentToken?: any // NB: may be UUID in future
   priority?: boolean // alterations and corrections only
   status: FilingStatus
-  submitter: string // FUTURE: is this obsolete?
+  submitter: string
+  latestReviewComment?: string // for change-requested tasks
 }
 
 /**
diff --git a/src/interfaces/todo-item-interface.ts b/src/interfaces/todo-item-interface.ts
index ea7f2dff9..370e97d58 100644
--- a/src/interfaces/todo-item-interface.ts
+++ b/src/interfaces/todo-item-interface.ts
@@ -15,6 +15,7 @@ export interface TodoItemIF {
   status: string
   title: string
   comments?: Array<any> // always [] and never used
+  isDefaultTask?: boolean // for generic fallback handling
 
   // Todo ARs and Draft IAs only
   subtitle?: string
@@ -61,4 +62,9 @@ export interface TodoItemIF {
     fromOrgName: string
     additionalMessage?: string
   }
+
+  // continuation ins only
+  submitter?: string
+  submittedDate?: Date
+  latestReviewComment?: string
 }
diff --git a/src/stores/rootStore.ts b/src/stores/rootStore.ts
index bb1628047..a3bcaa459 100644
--- a/src/stores/rootStore.ts
+++ b/src/stores/rootStore.ts
@@ -119,13 +119,17 @@ export const useRootStore = defineStore('root', {
       return false // FUTURE: implement this
     },
 
+    getBootstrapFilingStatus (state: RootStateIF): FilingStatus {
+      return state.bootstrapFilingStatus
+    },
+
     /** Whether this is an amalgamation bootstrap filing that belongs in the Todo List. */
     isAmalgamationTodo (state: RootStateIF): boolean {
       return (
         state.bootstrapFilingType === FilingTypes.AMALGAMATION_APPLICATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.DRAFT ||
-          state.bootstrapFilingStatus === FilingStatus.PENDING
+          this.getBootstrapFilingStatus === FilingStatus.DRAFT ||
+          this.getBootstrapFilingStatus === FilingStatus.PENDING
         )
       )
     },
@@ -135,8 +139,8 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.AMALGAMATION_APPLICATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.COMPLETED ||
-          state.bootstrapFilingStatus === FilingStatus.PAID
+          this.getBootstrapFilingStatus === FilingStatus.COMPLETED ||
+          this.getBootstrapFilingStatus === FilingStatus.PAID
         )
       )
     },
@@ -146,9 +150,9 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.CONTINUATION_IN &&
         (
-          state.bootstrapFilingStatus === FilingStatus.CHANGE_REQUESTED ||
-          state.bootstrapFilingStatus === FilingStatus.DRAFT ||
-          state.bootstrapFilingStatus === FilingStatus.PENDING
+          this.getBootstrapFilingStatus === FilingStatus.CHANGE_REQUESTED ||
+          this.getBootstrapFilingStatus === FilingStatus.DRAFT ||
+          this.getBootstrapFilingStatus === FilingStatus.PENDING
         )
       )
     },
@@ -157,7 +161,7 @@ export const useRootStore = defineStore('root', {
     isContinuationInPending (state: RootStateIF): boolean {
       return (
         state.bootstrapFilingType === FilingTypes.CONTINUATION_IN &&
-        state.bootstrapFilingStatus === FilingStatus.AWAITING_REVIEW
+        this.getBootstrapFilingStatus === FilingStatus.AWAITING_REVIEW
       )
     },
 
@@ -166,10 +170,10 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.CONTINUATION_IN &&
         (
-          state.bootstrapFilingStatus === FilingStatus.APPROVED ||
-          state.bootstrapFilingStatus === FilingStatus.COMPLETED ||
-          state.bootstrapFilingStatus === FilingStatus.PAID ||
-          state.bootstrapFilingStatus === FilingStatus.REJECTED
+          this.getBootstrapFilingStatus === FilingStatus.APPROVED ||
+          this.getBootstrapFilingStatus === FilingStatus.COMPLETED ||
+          this.getBootstrapFilingStatus === FilingStatus.PAID ||
+          this.getBootstrapFilingStatus === FilingStatus.REJECTED
         )
       )
     },
@@ -179,8 +183,8 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.INCORPORATION_APPLICATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.DRAFT ||
-          state.bootstrapFilingStatus === FilingStatus.PENDING
+          this.getBootstrapFilingStatus === FilingStatus.DRAFT ||
+          this.getBootstrapFilingStatus === FilingStatus.PENDING
         )
       )
     },
@@ -190,8 +194,8 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.INCORPORATION_APPLICATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.COMPLETED ||
-          state.bootstrapFilingStatus === FilingStatus.PAID
+          this.getBootstrapFilingStatus === FilingStatus.COMPLETED ||
+          this.getBootstrapFilingStatus === FilingStatus.PAID
         )
       )
     },
@@ -201,8 +205,8 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.REGISTRATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.DRAFT ||
-          state.bootstrapFilingStatus === FilingStatus.PENDING
+          this.getBootstrapFilingStatus === FilingStatus.DRAFT ||
+          this.getBootstrapFilingStatus === FilingStatus.PENDING
         )
       )
     },
@@ -212,8 +216,8 @@ export const useRootStore = defineStore('root', {
       return (
         state.bootstrapFilingType === FilingTypes.REGISTRATION &&
         (
-          state.bootstrapFilingStatus === FilingStatus.COMPLETED ||
-          state.bootstrapFilingStatus === FilingStatus.PAID
+          this.getBootstrapFilingStatus === FilingStatus.COMPLETED ||
+          this.getBootstrapFilingStatus === FilingStatus.PAID
         )
       )
     },
diff --git a/tests/unit/FutureEffective.spec.ts b/tests/unit/BodyFutureEffective.spec.ts
similarity index 93%
rename from tests/unit/FutureEffective.spec.ts
rename to tests/unit/BodyFutureEffective.spec.ts
index 157f3a9ae..2d83806cf 100644
--- a/tests/unit/FutureEffective.spec.ts
+++ b/tests/unit/BodyFutureEffective.spec.ts
@@ -4,7 +4,7 @@ import Vuetify from 'vuetify'
 import { createPinia, setActivePinia } from 'pinia'
 import { useBusinessStore } from '@/stores'
 import { mount } from '@vue/test-utils'
-import FutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue'
+import BodyFutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue'
 import { ContactInfo } from '@/components/common'
 
 Vue.use(Vuetify)
@@ -13,9 +13,9 @@ const vuetify = new Vuetify({})
 setActivePinia(createPinia())
 const businessStore = useBusinessStore()
 
-describe.skip('Future Effective', () => {
+describe.skip('Body Future Effective', () => {
   it('Displays expected content with a null filing', () => {
-    const wrapper = mount(FutureEffective, {
+    const wrapper = mount(BodyFutureEffective, {
       vuetify,
       propsData: { filing: null }
     })
@@ -28,7 +28,7 @@ describe.skip('Future Effective', () => {
   })
 
   it('Displays expected content with an empty filing', () => {
-    const wrapper = mount(FutureEffective, {
+    const wrapper = mount(BodyFutureEffective, {
       vuetify,
       propsData: { filing: {} }
     })
@@ -50,7 +50,7 @@ describe.skip('Future Effective', () => {
 
   it('Displays expected content with a FE named IA', () => {
     businessStore.setLegalName('My Incorporation')
-    const wrapper = mount(FutureEffective, {
+    const wrapper = mount(BodyFutureEffective, {
       vuetify,
       propsData: {
         filing: {
@@ -77,7 +77,7 @@ describe.skip('Future Effective', () => {
 
   it('Displays expected content with a FE numbered IA', () => {
     businessStore.setLegalName(null)
-    const wrapper = mount(FutureEffective, {
+    const wrapper = mount(BodyFutureEffective, {
       vuetify,
       propsData: {
         filing: {
@@ -104,7 +104,7 @@ describe.skip('Future Effective', () => {
 
   it('Displays expected content with a FE alteration', () => {
     businessStore.setLegalName('My Alteration')
-    const wrapper = mount(FutureEffective, {
+    const wrapper = mount(BodyFutureEffective, {
       vuetify,
       propsData: {
         filing: {
diff --git a/tests/unit/FutureEffectivePending.spec.ts b/tests/unit/BodyFutureEffectivePending.spec.ts
similarity index 90%
rename from tests/unit/FutureEffectivePending.spec.ts
rename to tests/unit/BodyFutureEffectivePending.spec.ts
index 5881f6ec2..d66ea3ed9 100644
--- a/tests/unit/FutureEffectivePending.spec.ts
+++ b/tests/unit/BodyFutureEffectivePending.spec.ts
@@ -4,7 +4,7 @@ import Vuetify from 'vuetify'
 import { createPinia, setActivePinia } from 'pinia'
 import { useBusinessStore } from '@/stores'
 import { mount } from '@vue/test-utils'
-import FutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue'
+import BodyFutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue'
 import { ContactInfo } from '@/components/common'
 
 Vue.use(Vuetify)
@@ -13,9 +13,9 @@ const vuetify = new Vuetify({})
 setActivePinia(createPinia())
 const businessStore = useBusinessStore()
 
-describe.skip('Future Effective Pending', () => {
+describe.skip('Body Future Effective Pending', () => {
   it('Displays expected content with a null filing', () => {
-    const wrapper = mount(FutureEffectivePending, {
+    const wrapper = mount(BodyFutureEffectivePending, {
       vuetify,
       propsData: { filing: null }
     })
@@ -28,7 +28,7 @@ describe.skip('Future Effective Pending', () => {
   })
 
   it('Displays expected content with an empty filing', () => {
-    const wrapper = mount(FutureEffectivePending, {
+    const wrapper = mount(BodyFutureEffectivePending, {
       vuetify,
       propsData: { filing: {} }
     })
@@ -49,7 +49,7 @@ describe.skip('Future Effective Pending', () => {
   it('Displays expected content with a FE named IA', () => {
     businessStore.setLegalName('My Incorporation')
 
-    const wrapper = mount(FutureEffectivePending, {
+    const wrapper = mount(BodyFutureEffectivePending, {
       vuetify,
       propsData: {
         filing: {
@@ -75,7 +75,7 @@ describe.skip('Future Effective Pending', () => {
   it('Displays expected content with a FE numbered IA', () => {
     businessStore.setLegalName(null)
 
-    const wrapper = mount(FutureEffectivePending, {
+    const wrapper = mount(BodyFutureEffectivePending, {
       vuetify,
       propsData: {
         filing: {
@@ -101,7 +101,7 @@ describe.skip('Future Effective Pending', () => {
   it('Displays expected content with a FE Alteration', () => {
     businessStore.setLegalName('My Alteration')
 
-    const wrapper = mount(FutureEffectivePending, {
+    const wrapper = mount(BodyFutureEffectivePending, {
       vuetify,
       propsData: {
         filing: {
diff --git a/tests/unit/FilingHistoryList1.spec.ts b/tests/unit/FilingHistoryList1.spec.ts
index 273f9f917..2eab20e27 100644
--- a/tests/unit/FilingHistoryList1.spec.ts
+++ b/tests/unit/FilingHistoryList1.spec.ts
@@ -14,8 +14,8 @@ import FilingHistoryList from '@/components/Dashboard/FilingHistoryList.vue'
 // import CompletedIa from '@/components/Dashboard/FilingHistoryList/CompletedIa.vue'
 import DetailsList from '@/components/Dashboard/FilingHistoryList/DetailsList.vue'
 import DocumentsList from '@/components/Dashboard/FilingHistoryList/DocumentsList.vue'
-import FutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue'
-import FutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue'
+import BodyFutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue'
 import PaperFiling from '@/components/Dashboard/FilingHistoryList/filings/PaperFiling.vue'
 // import PendingFiling from '@/components/Dashboard/FilingHistoryList/PendingFiling.vue'
 import StaffFiling from '@/components/Dashboard/FilingHistoryList/filings/StaffFiling.vue'
@@ -262,8 +262,8 @@ describe('Filing History List - misc functionality', () => {
     expect(vm.getPanel).toBe(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(true)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -317,8 +317,8 @@ describe('Filing History List - misc functionality', () => {
     expect(vm.getPanel).toBe(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -451,8 +451,8 @@ describe('Filing History List - misc functionality', () => {
     expect(vm.getFilings.length).toEqual(1)
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1248,8 +1248,8 @@ describe('Filing History List - incorporation applications', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(true)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(true)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1279,6 +1279,7 @@ describe('Filing History List - incorporation applications', () => {
         submitter: 'Cameron'
       } as any
     ])
+    filingHistoryListStore.setPanel(null) // so we can re-open it
 
     const wrapper = mount(FilingHistoryList, { vuetify })
 
@@ -1286,10 +1287,10 @@ describe('Filing History List - incorporation applications', () => {
     expect(detailsBtn.text()).toContain('View Details')
 
     await detailsBtn.trigger('click')
-    await Vue.nextTick()
+    await flushPromises() // wait for expansion transition
 
     expect(wrapper.findAll('.v-expansion-panel-content').isVisible()).toBe(true)
-    expect(wrapper.find('.future-effective').text()).toContain('Future Effective Incorporation Date')
+    expect(wrapper.find('h4').text()).toBe('Future Effective Incorporation Date')
 
     // cleanup
     rootStore.setBootstrapFilingStatus(null) // set isBootstrapFiling to false
@@ -1351,8 +1352,8 @@ describe('Filing History List - incorporation applications', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(true)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(true)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1415,8 +1416,8 @@ describe('Filing History List - incorporation applications', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(true)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1519,8 +1520,8 @@ describe('Filing History List - incorporation applications', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(true)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1587,8 +1588,8 @@ describe('Filing History List - incorporation applications', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1631,8 +1632,8 @@ describe('Filing History List - continuation in applications', () => {
     expect(wrapper.find('.hide-details').text()).toBe('Hide')
 
     // verify Filing History Component
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
     expect(wrapper.findComponent(DetailsList).exists()).toBe(false)
@@ -1706,8 +1707,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(true)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1767,8 +1768,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(true)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1833,8 +1834,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(true)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(true)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1899,8 +1900,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(true)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(true)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -1964,8 +1965,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toEqual(0) // first row is expanded
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(true)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(false)
@@ -2021,8 +2022,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toBe(0)
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(true)
@@ -2078,8 +2079,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toBe(0)
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(true)
@@ -2135,8 +2136,8 @@ describe('Filing History List - paper only and other filings', () => {
     expect(vm.getPanel).toBe(0)
     // expect(wrapper.findComponent(CompletedAlteration).exists()).toBe(false)
     // expect(wrapper.findComponent(CompletedIa).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffective).exists()).toBe(false)
-    expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(false)
+    expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(false)
     expect(wrapper.findComponent(PaperFiling).exists()).toBe(false)
     // expect(wrapper.findComponent(PendingFiling).exists()).toBe(false)
     expect(wrapper.findComponent(StaffFiling).exists()).toBe(true)
diff --git a/tests/unit/FilingHistoryList2.spec.ts b/tests/unit/FilingHistoryList2.spec.ts
index 97cba988f..529b064a1 100644
--- a/tests/unit/FilingHistoryList2.spec.ts
+++ b/tests/unit/FilingHistoryList2.spec.ts
@@ -14,8 +14,8 @@ import { FilingTypes } from '@bcrs-shared-components/enums'
 import FilingHistoryList from '@/components/Dashboard/FilingHistoryList.vue'
 // import CompletedAlteration from '@/components/Dashboard/FilingHistoryList/CompletedAlteration.vue'
 // import CompletedIa from '@/components/Dashboard/FilingHistoryList/CompletedIa.vue'
-import FutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffective.vue'
-import FutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/FutureEffectivePending.vue'
+import BodyFutureEffective from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffective.vue'
+import BodyFutureEffectivePending from '@/components/Dashboard/FilingHistoryList/bodies/BodyFutureEffectivePending.vue'
 import PaperFiling from '@/components/Dashboard/FilingHistoryList/filings/PaperFiling.vue'
 // import PendingFiling from '@/components/Dashboard/FilingHistoryList/PendingFiling.vue'
 import StaffFiling from '@/components/Dashboard/FilingHistoryList/filings/StaffFiling.vue'
@@ -310,13 +310,13 @@ filings.forEach((filing: any, index: number) => {
       // } else if (item.isCompletedIa) {
       //   expect(wrapper.findComponent(CompletedIa).exists()).toBe(true)
       } else if (item.isFutureEffectiveIaPending) {
-        expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(true)
+        expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(true)
       } else if (item.isFutureEffectiveIa) {
-        expect(wrapper.findComponent(FutureEffective).exists()).toBe(true)
+        expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(true)
       } else if (item.isFutureEffectiveAlterationPending) {
-        expect(wrapper.findComponent(FutureEffectivePending).exists()).toBe(true)
+        expect(wrapper.findComponent(BodyFutureEffectivePending).exists()).toBe(true)
       } else if (item.isFutureEffectiveAlteration) {
-        expect(wrapper.findComponent(FutureEffective).exists()).toBe(true)
+        expect(wrapper.findComponent(BodyFutureEffective).exists()).toBe(true)
       // } else if (item.status === 'PAID') {
       //   expect(wrapper.findComponent(PendingFiling).exists()).toBe(true)
       // } else if (item.name === 'alteration') {