let's do some maintenance (#489)

* let's do some maintenance
gobitfly · Jun 17, 2024 · 2916e32 · 2916e32
1 parent 40163bb
commit 2916e32
Show file tree

Hide file tree

Showing 6 changed files with 56 additions and 2 deletions.
diff --git a/frontend/.env-example b/frontend/.env-example
@@ -10,3 +10,4 @@ NUXT_PUBLIC_SHOW_IN_DEVELOPMENT: ""
 NUXT_PUBLIC_V1_DOMAIN: ""
 NUXT_PUBLIC_LOG_FILE: ""
 NUXT_PUBLIC_CHAIN_ID_BY_DEFAULT: ""
+NUXT_PUBLIC_MAINTENANCE_TS: "1717700652"
diff --git a/frontend/components/bc/BcMaintenanceBanner.vue b/frontend/components/bc/BcMaintenanceBanner.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import { warn } from 'vue'
+
+const { public: { maintenanceTS } } = useRuntimeConfig()
+const { tick } = useInterval(60)
+const { t: $t } = useI18n()
+
+const maintenanceLabel = computed(() => {
+  if (!maintenanceTS) {
+    return
+  }
+  const parsed = typeof maintenanceTS === 'number' ? maintenanceTS : parseInt(maintenanceTS)
+  if (isNaN(parsed)) {
+    warn('NUXT_PUBLIC_MAINTENANCE_TS is not convertible to an integer, a unix ts is expected')
+    return undefined
+  } else if (parsed === 0) {
+    return
+  }
+  const ts = new Date(parsed * 1000).getTime()
+  if (ts > tick.value) {
+    return $t('maintenance.planned', { date: formatTsToAbsolute(ts / 1000, $t('locales.date'), true) })
+  } else {
+    return $t('maintenance.ongoing')
+  }
+})
+
+</script>
+<template>
+  <div v-if="maintenanceLabel" class="maintenance-banner">
+    {{ maintenanceLabel }}
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.maintenance-banner{
+  width: 100%;
+  padding: var(--padding-large);
+  background-color: var(--grey-4);
+  //color: var(--container-color);
+  text-align: center;
+}
+.dark-mode {
+  .maintenance-banner{
+    background-color: var(--very-dark-grey);
+  }
+}
+</style>
diff --git a/frontend/components/bc/PageWrapper.vue b/frontend/components/bc/PageWrapper.vue
@@ -6,6 +6,7 @@ const props = defineProps({ isHomePage: { type: Boolean } })
   <BcCookieModal />
   <div class="page">
     <BcHeaderMainHeader :is-home-page="props.isHomePage" />
+    <BcMaintenanceBanner />
     <div class="content">
       <slot name="top" />
       <BcAdControl />

diff --git a/frontend/i18n/en.json b/frontend/i18n/en.json
@@ -82,6 +82,10 @@
     "multiple_times": "The error {error} happened {count} times",
     "ws_error": "Webservice error"
   },
+  "maintenance": {
+    "planned": "Maintenance is scheduled ({date})",
+    "ongoing": "Maintenance: Some features are unavailable"
+  },
   "table": {
     "first": "First",
     "last": "Last",

diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts
@@ -41,7 +41,8 @@ export default defineNuxtConfig({
       logIp: '',
       logFile: '',
       showInDevelopment: '',
-      chainIdByDefault: process.env.PUBLIC_CHAIN_ID_BY_DEFAULT
+      chainIdByDefault: process.env.PUBLIC_CHAIN_ID_BY_DEFAULT,
+      maintenanceTS: ''
     },
     private: {
       apiServer: process.env.PRIVATE_API_SERVER,

diff --git a/frontend/utils/format.ts b/frontend/utils/format.ts
@@ -106,7 +106,7 @@ function formatTs (ts?: number, timestamp?: number, format: AgeFormat = 'relativ
   }
 }
 
-function formatTsToAbsolute (ts: number, locales: string, includeTime?: boolean): string {
+export function formatTsToAbsolute (ts: number, locales: string, includeTime?: boolean): string {
   const timeOptions: Intl.DateTimeFormatOptions = includeTime
     ? {
         hour: 'numeric',