Hide democracy via api construction capabilities (#7369)

packages/apps-routing/src/democracy.ts

@@ -2,17 +2,32 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { ApiPromise } from '@polkadot/api';
 import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-democracy';
 
+function needsApiCheck (api: ApiPromise): boolean {
+  // we need to be able to create an actual vote
+  try {
+    api.tx.democracy.vote(1, { Standard: { balance: 1, vote: { aye: true, conviction: 1 } } });
+
+    return true;
+  } catch (error) {
+    console.warn('Unable to create referendum vote transaction, disabling democracy route');
+
+    return false;
+  }
+}
+
 export default function create (t: TFunction): Route {
   return {
     Component,
     display: {
       needsApi: [
         'tx.democracy.notePreimage'
-      ]
+      ],
+      needsApiCheck
     },
     group: 'governance',
     icon: 'calendar-check',

packages/apps-routing/src/types.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { IconName } from '@fortawesome/fontawesome-svg-core';
+import type { ApiPromise } from '@polkadot/api';
 import type { AppProps, BareProps } from '@polkadot/react-components/types';
 
 export type RouteGroup = 'accounts' | 'developer' | 'governance' | 'network' | 'files' | 'settings';
@@ -19,6 +20,7 @@ export interface Route {
     isModal?: boolean;
     needsAccounts?: boolean;
     needsApi?: (string | string[])[];
+    needsApiCheck?: (api: ApiPromise) => boolean;
     needsApiInstances?: boolean;
     needsSudo?: boolean;
     needsTeleport?: boolean;

packages/apps/src/Content/index.tsx

@@ -22,9 +22,7 @@ interface Props {
 
 const NOT_FOUND: Route = {
   Component: NotFound,
-  display: {
-    needsApi: undefined
-  },
+  display: {},
   group: 'settings',
   icon: 'times',
   isIgnored: false,
@@ -38,7 +36,7 @@ function Content ({ className }: Props): React.ReactElement<Props> {
   const { api, isApiConnected, isApiReady } = useApi();
   const { queueAction } = useContext(StatusContext);
 
-  const { Component, display: { needsApi, needsApiInstances }, icon, name, text } = useMemo(
+  const { Component, display: { needsApi, needsApiCheck, needsApiInstances }, icon, name, text } = useMemo(
     (): Route => {
       const app = location.pathname.slice(1) || '';
 
@@ -50,10 +48,10 @@ function Content ({ className }: Props): React.ReactElement<Props> {
   const missingApis = useMemo(
     () => needsApi
       ? isApiReady && isApiConnected
-        ? findMissingApis(api, needsApi, needsApiInstances)
+        ? findMissingApis(api, needsApi, needsApiInstances, needsApiCheck)
         : null
       : [],
-    [api, isApiConnected, isApiReady, needsApi, needsApiInstances]
+    [api, isApiConnected, isApiReady, needsApi, needsApiCheck, needsApiInstances]
   );
 
   return (

packages/apps/src/Menu/index.tsx

@@ -42,7 +42,7 @@ function createExternals (t: TFunction): ItemRoute[] {
   ];
 }
 
-function checkVisible ({ api, isApiConnected, isApiReady }: ApiProps, allowTeleport: boolean, hasAccounts: boolean, hasSudo: boolean, { isHidden, needsAccounts, needsApi, needsApiInstances, needsSudo, needsTeleport }: Route['display']): boolean {
+function checkVisible ({ api, isApiConnected, isApiReady }: ApiProps, allowTeleport: boolean, hasAccounts: boolean, hasSudo: boolean, { isHidden, needsAccounts, needsApi, needsApiCheck, needsApiInstances, needsSudo, needsTeleport }: Route['display']): boolean {
   if (isHidden) {
     return false;
   } else if (needsAccounts && !hasAccounts) {
@@ -57,7 +57,7 @@ function checkVisible ({ api, isApiConnected, isApiReady }: ApiProps, allowTelep
     return false;
   }
 
-  return findMissingApis(api, needsApi, needsApiInstances).length === 0;
+  return findMissingApis(api, needsApi, needsApiInstances, needsApiCheck).length === 0;
 }
 
 function extractGroups (routing: Routes, groupNames: Record<string, string>, apiProps: ApiProps, allowTeleport: boolean, hasAccounts: boolean, hasSudo: boolean): Group[] {

packages/apps/src/endpoint.ts

@@ -17,8 +17,10 @@ function hasEndpoint (api: ApiPromise, endpoint: string, needsApiInstances: bool
   }
 }
 
-export function findMissingApis (api: ApiPromise, needsApi?: (string | string[])[], needsApiInstances = false): (string | string[])[] {
-  if (!needsApi) {
+export function findMissingApis (api: ApiPromise, needsApi?: (string | string[])[], needsApiInstances = false, needsApiCheck?: (api: ApiPromise) => boolean): (string | string[])[] {
+  if (needsApiCheck && !needsApiCheck(api)) {
+    return ['needsApiCheck'];
+  } else if (!needsApi) {
     return [];
   }