diff --git a/packages/apps/src/Menu/NodeInfo.tsx b/packages/apps/src/Menu/NodeInfo.tsx
index b2d96ca8dc..b42643de45 100644
--- a/packages/apps/src/Menu/NodeInfo.tsx
+++ b/packages/apps/src/Menu/NodeInfo.tsx
@@ -10,10 +10,9 @@ import { styled } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';
 import { NodeName, NodeVersion } from '@polkadot/react-query';
 
-const appsVersion = getPackageVersion();
-
 function NodeInfo ({ className = '' }: Props): React.ReactElement<Props> {
   const { api, isApiReady } = useApi();
+  const appsVersion = getPackageVersion();
 
   return (
     <StyledDiv className={`${className} media--1400 highlight--color-contrast ui--NodeInfo`}>
diff --git a/packages/page-settings/src/Metadata/SystemVersion.tsx b/packages/page-settings/src/Metadata/SystemVersion.tsx
index 6554c5f75b..1f014bbb5e 100644
--- a/packages/page-settings/src/Metadata/SystemVersion.tsx
+++ b/packages/page-settings/src/Metadata/SystemVersion.tsx
@@ -11,10 +11,9 @@ import { useApi } from '@polkadot/react-hooks';
 
 import { useTranslation } from '../translate.js';
 
-const appsVersion = getPackageVersion();
-
 function SystemVersion ({ className }: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
+  const appsVersion = getPackageVersion();
   const { api, isApiReady, systemName, systemVersion } = useApi();
 
   const headerRef = useRef<[React.ReactNode?, string?, number?][]>([