erge branch 'main' into w3f-deploy-1.1

src/contexts/ActiveAccounts/index.tsx

@@ -44,14 +44,13 @@ export const ActiveAccountsProvider = ({
   // Setter for the active account.
   const setActiveAccount = (
     newActiveAccount: MaybeAddress,
-    local: boolean = true
+    updateLocalStorage: boolean = true
   ) => {
-    if (local)
-      if (newActiveAccount === null) {
+    if (updateLocalStorage)
+      if (newActiveAccount === null)
         localStorage.removeItem(`${network}_active_account`);
-      } else {
-        localStorage.setItem(`${network}_active_account`, newActiveAccount);
-      }
+      else localStorage.setItem(`${network}_active_account`, newActiveAccount);
+
     setStateWithRef(newActiveAccount, setActiveAccountState, activeAccountRef);
   };
 

src/contexts/ActiveAccounts/types.ts

@@ -8,8 +8,11 @@ export interface ActiveAccountsContextInterface {
   activeProxy: MaybeAddress;
   activeProxyType: string | null;
   getActiveAccount: () => string | null;
-  setActiveAccount: (address: MaybeAddress, updateLocal?: boolean) => void;
-  setActiveProxy: (address: ActiveProxy, updateLocal?: boolean) => void;
+  setActiveAccount: (
+    address: MaybeAddress,
+    updateLocalStorage?: boolean
+  ) => void;
+  setActiveProxy: (address: ActiveProxy, updateLocalStorage?: boolean) => void;
 }
 
 export type ActiveProxy = {

src/contexts/Connect/ImportedAccounts/defaults.ts

@@ -7,8 +7,8 @@ import type { ImportedAccountsContextInterface } from './types';
 export const defaultImportedAccountsContext: ImportedAccountsContextInterface =
   {
     accounts: [],
-    getAccount: (a) => null,
-    isReadOnlyAccount: (a) => false,
-    accountHasSigner: (a) => false,
-    requiresManualSign: (a) => false,
+    getAccount: (address) => null,
+    isReadOnlyAccount: (address) => false,
+    accountHasSigner: (address) => false,
+    requiresManualSign: (address) => false,
   };

src/contexts/Connect/ImportedAccounts/types.ts

@@ -9,8 +9,8 @@ import type { MaybeAddress } from 'types';
 
 export interface ImportedAccountsContextInterface {
   accounts: ImportedAccount[];
-  getAccount: (account: MaybeAddress) => ExtensionAccount | null;
-  isReadOnlyAccount: (a: MaybeAddress) => boolean;
-  accountHasSigner: (a: MaybeAddress) => boolean;
-  requiresManualSign: (a: MaybeAddress) => boolean;
+  getAccount: (address: MaybeAddress) => ExtensionAccount | null;
+  isReadOnlyAccount: (address: MaybeAddress) => boolean;
+  accountHasSigner: (address: MaybeAddress) => boolean;
+  requiresManualSign: (address: MaybeAddress) => boolean;
 }

src/contexts/Connect/OtherAccounts/index.tsx

@@ -76,13 +76,14 @@ export const OtherAccountsProvider = ({
       // Remove forgotten accounts from context state.
       setStateWithRef(
         [...otherAccountsRef.current].filter(
-          (a) => forget.find((s) => s.address === a.address) === undefined
+          (a) =>
+            forget.find(({ address }) => address === a.address) === undefined
         ),
         setOtherAccounts,
         otherAccountsRef
       );
       // If the currently active account is being forgotten, disconnect.
-      if (forget.find((a) => a.address === activeAccount) !== undefined)
+      if (forget.find(({ address }) => address === activeAccount) !== undefined)
         setActiveAccount(null);
     }
   };

src/library/BarChart/BondedChart.tsx

@@ -23,18 +23,27 @@ export const BondedChart = ({
   } = useNetwork();
   const totalUnlocking = unlocking.plus(unlocked);
 
+  const MinimumNoNZeroPercent = 13;
+
   // graph percentages
   const graphTotal = active.plus(totalUnlocking).plus(free);
   const graphActive = greaterThanZero(active)
-    ? active.dividedBy(graphTotal.multipliedBy(0.01))
+    ? BigNumber.max(
+        active.dividedBy(graphTotal.multipliedBy(0.01)),
+        MinimumNoNZeroPercent
+      )
     : new BigNumber(0);
 
   const graphUnlocking = greaterThanZero(totalUnlocking)
-    ? totalUnlocking.dividedBy(graphTotal.multipliedBy(0.01))
+    ? BigNumber.max(
+        totalUnlocking.dividedBy(graphTotal.multipliedBy(0.01)),
+        MinimumNoNZeroPercent
+      )
     : new BigNumber(0);
 
-  const graphFree = greaterThanZero(graphTotal)
-    ? new BigNumber(100).minus(graphActive).minus(graphUnlocking)
+  const remaining = new BigNumber(100).minus(graphActive).minus(graphUnlocking);
+  const graphFree = greaterThanZero(remaining)
+    ? BigNumber.max(remaining, MinimumNoNZeroPercent)
     : new BigNumber(0);
 
   return (

src/library/BarChart/Wrappers.ts

@@ -4,14 +4,15 @@
 import styled from 'styled-components';
 
 export const BarChartWrapper = styled.div<{ $lessPadding?: boolean }>`
-  width: 100%;
   padding: ${(props) => (props.$lessPadding ? '0' : '0 0.5rem')};
   margin-top: 1rem;
+  width: 100%;
 
   .available {
-    width: 100%;
     display: flex;
     margin-top: 2.7rem;
+    width: 100%;
+
     > div {
       display: flex;
       flex-flow: row wrap;
@@ -80,11 +81,11 @@ export const Legend = styled.div`
 
 export const Bar = styled.div`
   background: var(--button-secondary-background);
-  display: flex;
-  width: 100%;
-  height: 3.75rem;
   border-radius: 0.65rem;
+  display: flex;
   overflow: hidden;
+  height: 3.75rem;
+  width: 100%;
 
   > div {
     position: relative;

src/modals/ValidatorGeo/index.tsx

@@ -17,7 +17,7 @@ import type { ValidatorDetail } from '@polkawatch/ddp-client';
 import { useOverlay } from '@polkadot-cloud/react/hooks';
 import { PluginLabel } from 'library/PluginLabel';
 import { usePolkawatchApi } from 'contexts/Plugins/Polkawatch';
-import { usePlugins } from '../../contexts/Plugins';
+import { usePlugins } from 'contexts/Plugins';
 
 export const ValidatorGeo = () => {
   const { t } = useTranslation('modals');