Merge branch 'w/126.0/bugfix/fix-the-issue-that-new-version-is-not-lo…

…aded-after-upgrade' into tmp/octopus/q/126.0
scality · Sep 14, 2023 · 138a4d8 · 138a4d8
2 parents b1f81ed + be48dc0
commit 138a4d8
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 24 deletions.
diff --git a/shell-ui/index-template.html b/shell-ui/index-template.html
@@ -7,7 +7,7 @@
   <link rel="preload" as="script" href="{{this}}" />
   {{/each}}
   <title>Document</title>
-  <script language="javascript">window.shellUIRemoteEntryUrl = "/shell/remoteEntry.js?" + Date.now();</script>
+  <script language="javascript">window.shellUIRemoteEntryUrl = "/shell/remoteEntry.js?version={{htmlWebpackPlugin.options.version}}"</script>
 </head>
 <body>
   <div id="app"></div>

diff --git a/shell-ui/src/initFederation/ConfigurationProviders.tsx b/shell-ui/src/initFederation/ConfigurationProviders.tsx
@@ -280,30 +280,30 @@ export const ConfigurationProvider = ({
         queryKey: `${ui.name}.${ui.kind}.${ui.version}-buildtime-WebFinger`,
         refetchOnWindowFocus: false,
         queryFn: () => {
-          return fetch(`${ui.url}/.well-known/micro-app-configuration`).then(
-            (r) => {
-              if (r.ok) {
-                return r.json();
-              } else {
-                return Promise.reject();
-              }
-            },
-          );
+          return fetch(
+            `${ui.url}/.well-known/micro-app-configuration?version=${ui.version}`,
+          ).then((r) => {
+            if (r.ok) {
+              return r.json();
+            } else {
+              return Promise.reject();
+            }
+          });
         },
       },
       {
         queryKey: `${ui.name}.${ui.kind}.${ui.version}-runtime-WebFinger`,
         refetchOnWindowFocus: false,
         queryFn: () => {
-          return fetch(`${ui.url}/.well-known/runtime-app-configuration`).then(
-            (r) => {
-              if (r.ok) {
-                return r.json();
-              } else {
-                return Promise.reject();
-              }
-            },
-          );
+          return fetch(
+            `${ui.url}/.well-known/runtime-app-configuration?version=${ui.version}`,
+          ).then((r) => {
+            if (r.ok) {
+              return r.json();
+            } else {
+              return Promise.reject();
+            }
+          });
         },
       },
     ]),

diff --git a/shell-ui/src/initFederation/UIListProvider.tsx b/shell-ui/src/initFederation/UIListProvider.tsx
@@ -66,7 +66,7 @@ export const UIListProvider = ({
   const { status, data } = useQuery(
     'discoveredUIs',
     () => {
-      return fetch(discoveryURL).then((r) => {
+      return fetch(discoveryURL, { cache: 'no-cache' }).then((r) => {
         if (r.ok) {
           return r.json();
         } else {

diff --git a/shell-ui/src/navbar/NavBar.tsx b/shell-ui/src/navbar/NavBar.tsx
@@ -190,7 +190,10 @@ export const useNavbarLinksToActions = (
         },
       };
       const remoteEntryUrl = link.view.isFederated
-        ? link.view.app.url + microAppConfiguration.spec.remoteEntryPath
+        ? link.view.app.url +
+          microAppConfiguration.spec.remoteEntryPath +
+          '?version=' +
+          link.view.app.version
         : '';
       prefetch(remoteEntryUrl).catch((e) =>
         console.error(`Failed to preload ${remoteEntryUrl}`, e),

diff --git a/shell-ui/webpack.common.js b/shell-ui/webpack.common.js
@@ -6,6 +6,7 @@ const deps = require('./package.json').dependencies;
 module.exports = {
   entry: './src/index.tsx',
   output: {
+    filename: '[name].[contenthash].js',
     path: path.resolve(__dirname, 'build'),
     publicPath: '/shell/',
   },
@@ -172,6 +173,7 @@ module.exports = {
       },
     }),
     new HtmlWebPackPlugin({
+      version: new Date().getTime(),
       template: '!!handlebars-loader!./index-template.html',
       filename: './index.html',
       excludeChunks: ['shell'],

diff --git a/ui/src/containers/AlertProvider.tsx b/ui/src/containers/AlertProvider.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { useIntl } from 'react-intl';
-import { useTypedSelector } from '../hooks';
 import { ErrorBoundary } from 'react-error-boundary';
 import type { FilterLabels, Alert } from '../services/alertUtils';
 import { ErrorPage500 } from '@scality/core-ui';
@@ -10,10 +9,13 @@ import {
 } from '@scality/module-federation';
 import { STATUS_HEALTH } from '../constants';
 import { useConfig } from '../FederableApp';
+import { QueryObserverResult } from 'react-query';
 export type Status = 'healthy' | 'warning' | 'critical';
 
 const alertGlobal = {};
-export const useAlerts = (filters: FilterLabels): { alerts: Alert[] } => {
+export const useAlerts = (
+  filters: FilterLabels,
+): Omit<QueryObserverResult<Alert[]>, 'data'> & { alerts?: Alert[] } => {
   return alertGlobal.hooks.useAlerts(filters);
 };
 export const useHighestSeverityAlerts = (filters: FilterLabels) => {

diff --git a/ui/webpack.common.js b/ui/webpack.common.js
@@ -10,7 +10,7 @@ module.exports = (env) => ({
     metalk8s_ui: './src/index.ts',
   },
   output: {
-    filename: 'static/js/[name].js',
+    filename: 'static/js/[name].[contenthash].js',
     path: path.resolve(__dirname, 'build'),
     publicPath: '/',
   },