feat(web): registration page array status messaging

web/components/Registration.ce.vue

@@ -40,7 +40,8 @@ const { t } = useI18n();
 const replaceRenewCheckStore = useReplaceRenewStore();
 const serverStore = useServerStore();
 const {
-  array,
+  computedArray,
+  arrayWarning,
   authAction,
   dateTimeFormat,
   deviceCount,
@@ -108,10 +109,11 @@ const showFilteredKeyActions = computed((): boolean => !!(keyActions.value && ke
 
 const items = computed((): RegistrationItemProps[] => {
   return [
-    ...(array.value
+    ...(computedArray.value
       ? [{
           label: t('Array status'),
-          text: array.value.state,
+          text: computedArray.value,
+          warning: arrayWarning.value,
         }]
       : []),
     ...(regTy.value
@@ -194,6 +196,7 @@ const items = computed((): RegistrationItemProps[] => {
           componentProps: { t },
         }]
       : []),
+
     ...(showFilteredKeyActions.value
       ? [{
           component: KeyActions,

web/store/server.ts

@@ -72,6 +72,17 @@ export const useServerStore = defineStore('server', () => {
   });
   const apiVersion = ref<string>('');
   const array = ref<ServerStateArray | undefined>();
+  // helps to display warning next to array status
+  const arrayWarning = computed(() => !!(stateDataError.value || serverConfigError.value));
+  const computedArray = computed(() => {
+    if (arrayWarning.value) {
+      if (array.value?.state === 'Stopped') {
+        return 'Stopped. The Array will not start until the above issue is resolved.';
+      }
+      return 'Started. If stopped, the Array will not restart until the above issue is resolved.';
+    }
+    return array.value?.state;
+  });
   const avatar = ref<string>(''); // @todo potentially move to a user store
   const caseModel = ref<string>('');
   const cloud = ref<PartialCloudFragment | undefined>();
@@ -860,6 +871,7 @@ export const useServerStore = defineStore('server', () => {
       cloudError.value,
     ].filter(Boolean);
   });
+
   /**
    * Actions
    */
@@ -1137,6 +1149,8 @@ export const useServerStore = defineStore('server', () => {
     serverErrors,
     tooManyDevices,
     serverConfigError,
+    arrayWarning,
+    computedArray,
     // actions
     setServer,
     setUpdateOsResponse,

web/types/server.ts

@@ -61,7 +61,7 @@ export interface ServerUpdateOsResponse {
 }
 
 export interface ServerStateArray {
-  state: 'Stopped' | 'Running' | 'Stopped. The Array will not start until the above issue is resolved.' | 'Running. If stopped, the Array will not restart until the above issue is resolved.';
+  state: 'Stopped' | 'Started' | 'Starting' | 'Stopping';
   progress: string;
 }