diff --git a/frontend/.env-example b/frontend/.env-example
index 5cbd8e97c..77dd40251 100644
--- 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
new file mode 100644
index 000000000..4ffd00dd8
--- /dev/null
+++ b/frontend/components/bc/BcMaintenanceBanner.vue
@@ -0,0 +1,47 @@
+
+
+
+ {{ maintenanceLabel }}
+
+
+
+
diff --git a/frontend/components/bc/PageWrapper.vue b/frontend/components/bc/PageWrapper.vue
index 8060415a8..996397675 100644
--- a/frontend/components/bc/PageWrapper.vue
+++ b/frontend/components/bc/PageWrapper.vue
@@ -6,6 +6,7 @@ const props = defineProps({ isHomePage: { type: Boolean } })
+
diff --git a/frontend/i18n/en.json b/frontend/i18n/en.json
index 19f792ef5..f9ff031e4 100644
--- 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
index ece3cbc14..77baac678 100644
--- 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
index f9898b18c..295b56696 100644
--- 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',