refactor(web): downgrade

web/components/DowngradeOs.ce.vue

@@ -0,0 +1,60 @@
+<script lang="ts" setup>
+/**
+ * @todo how are we going to update test, beta, and stable releases for internal testing?
+ * @todo after install / downgrade detect if third-party drivers are installed and tell users to wait for a user to wait for a new notification
+ *
+ * run exec("ps aux | grep -E "inotifywait -q /boot/changes.txt -e move_self,delete_self" | grep -v "grep -E inotifywait" | awk '{print $2}'");
+ * if this returns are value assume we have third-party drivers installed and tell the user to wait for a new notification
+ *
+ * view https://s3.amazonaws.com/dnld.lime-technology.com/stable/unRAIDServer.plg to see how the update is handled
+# ensure writes to USB flash boot device have completed
+sync -f /boot
+if [ -z "${plg_update_helper}" ]; then
+  echo "Update successful - PLEASE REBOOT YOUR SERVER"
+else
+  echo "Third party plugins found - PLEASE CHECK YOUR UNRAID NOTIFICATIONS AND WAIT FOR THE MESSAGE THAT IT IS SAFE TO REBOOT!"
+fi
+ */
+import { storeToRefs } from 'pinia';
+import { useI18n } from 'vue-i18n';
+
+import { useUpdateOsActionsStore } from '~/store/updateOsActions';
+
+import 'tailwindcss/tailwind.css';
+import '~/assets/main.css';
+
+const { t } = useI18n();
+
+export interface Props {
+  restoreReleaseDate?: string;
+  restoreVersion?: string;
+}
+withDefaults(defineProps<Props>(), {
+  restoreReleaseDate: '',
+  restoreVersion: '',
+});
+
+const updateOsActionsStore = useUpdateOsActionsStore();
+
+const { rebootType } = storeToRefs(updateOsActionsStore);
+</script>
+
+<template>
+  <UiPageContainer>
+    <UpdateOsStatus :t="t" />
+    <UpdateOsDowngrade
+      v-if="restoreVersion && rebootType === ''"
+      :release-date="restoreReleaseDate"
+      :version="restoreVersion"
+      :t="t" />
+    <UpdateOsThirdPartyDrivers
+      v-if="rebootType === 'thirdPartyDriversDownloading'"
+      :t="t" />
+  </UiPageContainer>
+</template>
+
+<style lang="postcss">
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+</style>

web/components/UpdateOs.ce.vue

@@ -25,15 +25,6 @@ import '~/assets/main.css';
 
 const { t } = useI18n();
 
-export interface Props {
-  restoreReleaseDate?: string;
-  restoreVersion?: string;
-}
-withDefaults(defineProps<Props>(), {
-  restoreReleaseDate: '',
-  restoreVersion: '',
-});
-
 const updateOsStore = useUpdateOsStore();
 const updateOsActionsStore = useUpdateOsActionsStore();
 
@@ -43,18 +34,13 @@ const { rebootType } = storeToRefs(updateOsActionsStore);
 
 <template>
   <UiPageContainer>
-    <UpdateOsStatus :t="t" />
+    <UpdateOsStatus :showUpdateCheck="true" :t="t" />
     <UpdateOsUpdateIneligible
       v-if="availableWithRenewal && rebootType === ''"
       :t="t" />
     <UpdateOsUpdate
       v-if="available && rebootType === ''"
       :t="t" />
-    <UpdateOsDowngrade
-      v-if="restoreVersion && rebootType === ''"
-      :release-date="restoreReleaseDate"
-      :version="restoreVersion"
-      :t="t" />
     <UpdateOsThirdPartyDrivers
       v-if="rebootType === 'thirdPartyDriversDownloading'"
       :t="t" />

web/components/UpdateOs/Downgrade.vue

@@ -29,12 +29,6 @@ const serverStore = useServerStore();
 const { dateTimeFormat } = storeToRefs(serverStore);
 const { formatDate } = useTimeHelper(dateTimeFormat.value, props.t, true);
 
-const visible = ref(false);
-const toggleVisible = () => {
-  visible.value = !visible.value;
-  /** @todo scroll to bottom of component into view */
-};
-
 const formattedReleaseDate = computed(() => {
   if (props.releaseDate) {
     return formatDate(dayjs(props.releaseDate, 'YYYY-MM-DD').valueOf());
@@ -72,20 +66,12 @@ const downgradeButton = ref<UserProfileLink | undefined>({
             </span>
           </span>
         </h3>
-        <div v-if="visible" class="text-16px leading-relaxed opacity-75 whitespace-normal">
+        <div class="text-16px leading-relaxed opacity-75 whitespace-normal">
           <p>{{ t('Downgrades are only recommended if you\'re unable to solve a critical issue. In the rare event you need to downgrade we ask that you please provide us with Diagnostics so we can investigate your issue. You will be prompted with the option to download the Diagnostics zip once the downgrade process is started. From there please open a bug report on our forums with a description of the issue and include your diagnostics.') }}</p>
         </div>
       </div>
 
-      <BrandButton
-        v-if="!visible"
-        @click="toggleVisible"
-        :btn-style="'outline'"
-        :icon="InformationCircleIcon"
-        :text="t('Learn More')"
-        class="flex-shrink-0" />
-
-      <div v-else-if="downgradeButton" class="flex flex-col sm:flex-shrink-0 items-center gap-16px">
+      <div v-if="downgradeButton" class="flex flex-col sm:flex-shrink-0 items-center gap-16px">
         <BrandButton
           :btn-style="'underline'"
           :external="true"