fix for an invalid reference link causing errors and not redirecting …

…user to correct page

src/ECER.Clients.RegistryPortal/ecer.clients.registryportal.client/src/components/reference/Reference.vue

@@ -1,5 +1,6 @@
 <template>
-  <Wizard :ref="'wizard'" :wizard="wizardConfigSetup" :show-steps="false">
+  <Loading v-if="fetchingData" />
+  <Wizard v-else :ref="'wizard'" :wizard="wizardConfigSetup" :show-steps="false">
     <template #header>
       <v-container fluid class="bg-primary">
         <v-container>
@@ -76,18 +77,23 @@ import type { Wizard as WizardType } from "@/types/wizard";
 import { PortalInviteType, WorkExperienceType } from "@/utils/constant";
 
 import Wizard from "../Wizard.vue";
+import Loading from "../Loading.vue";
 
 export default defineComponent({
   name: "Reference",
-  components: { Wizard },
+  components: { Wizard, Loading },
   async setup() {
     const route = useRoute();
     const router = useRouter();
     const { data, error } = await getReference(route.params.token as string);
     let wizardConfigSetup: WizardType | undefined = undefined;
+    //this variable prevents errors initializing the wizard when portal invitation in invalid which prevents redirecting the user to the invalid-reference page
+    let fetchingData = true;
 
     if (error) {
       router.push("/invalid-reference");
+    } else {
+      fetchingData = false;
     }
 
     const wizardStore = useWizardStore();
@@ -117,6 +123,7 @@ export default defineComponent({
       wizardConfigSetup,
       router,
       route,
+      fetchingData,
     };
   },
   computed: {