Adjust council proposeExternal (basic, non-optimal detect) (#8403)

* Adjust council proposeExternal (basic, non-optimal detect)

* Democracy propose

* Check for notePreimage

packages/page-council/src/Motions/ProposeExternal.tsx

@@ -2,13 +2,15 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { SubmittableExtrinsic } from '@polkadot/api/types';
+import type { HexString } from '@polkadot/util/types';
 
 import React, { useCallback, useEffect, useState } from 'react';
 
+import usePreimage from '@polkadot/app-preimages/usePreimage';
 import { getProposalThreshold } from '@polkadot/apps-config';
 import { Button, Input, InputAddress, Modal, TxButton } from '@polkadot/react-components';
 import { useApi, useCollectiveInstance, useToggle } from '@polkadot/react-hooks';
-import { isHex } from '@polkadot/util';
+import { isFunction, isHex } from '@polkadot/util';
 
 import { useTranslation } from '../translate';
 
@@ -19,7 +21,7 @@ interface Props {
 }
 
 interface HashState {
-  hash?: string;
+  hash?: HexString | null;
   isHashValid: boolean;
 }
 
@@ -34,31 +36,42 @@ function ProposeExternal ({ className = '', isMember, members }: Props): React.R
   const [isVisible, toggleVisible] = useToggle();
   const [accountId, setAcountId] = useState<string | null>(null);
   const [{ proposal, proposalLength }, setProposal] = useState<ProposalState>({ proposalLength: 0 });
-  const [{ hash, isHashValid }, setHash] = useState<HashState>({ hash: '', isHashValid: false });
+  const [{ hash, isHashValid }, setHash] = useState<HashState>({ isHashValid: false });
   const modLocation = useCollectiveInstance('council');
+  const preimage = usePreimage(hash);
 
   const threshold = Math.min(members.length, Math.ceil((members.length || 0) * getProposalThreshold(api)));
 
   const _onChangeHash = useCallback(
-    (hash?: string): void => setHash({ hash, isHashValid: isHex(hash, 256) }),
+    (hash?: string): void =>
+      setHash({ hash: hash as HexString, isHashValid: isHex(hash, 256) }),
     []
   );
 
   useEffect((): void => {
     if (isHashValid && hash) {
-      const proposal = api.tx.democracy.externalProposeMajority(hash);
+      const proposal = isFunction(api.tx.preimage?.notePreimage) && !isFunction(api.tx.democracy?.notePreimage)
+        ? preimage && api.tx.democracy.externalProposeMajority({
+          Lookup: {
+            hash: preimage.proposalHash,
+            len: preimage.proposalLength
+          }
+        })
+        : api.tx.democracy.externalProposeMajority(hash);
 
-      setProposal({
-        proposal,
-        proposalLength: proposal.encodedLength || 0
-      });
-    } else {
-      setProposal({
-        proposal: null,
-        proposalLength: 0
-      });
+      if (proposal) {
+        return setProposal({
+          proposal,
+          proposalLength: proposal.encodedLength || 0
+        });
+      }
     }
-  }, [api, hash, isHashValid]);
+
+    setProposal({
+      proposal: null,
+      proposalLength: 0
+    });
+  }, [api, hash, isHashValid, preimage]);
 
   if (!modLocation) {
     return null;

packages/page-democracy/src/Overview/Propose.tsx

@@ -2,13 +2,15 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { BN } from '@polkadot/util';
+import type { HexString } from '@polkadot/util/types';
 
 import React, { useCallback, useState } from 'react';
 
+import usePreimage from '@polkadot/app-preimages/usePreimage';
 import { Input, InputAddress, InputBalance, Modal, TxButton } from '@polkadot/react-components';
 import { useApi, useCall } from '@polkadot/react-hooks';
 import { Available } from '@polkadot/react-query';
-import { isHex } from '@polkadot/util';
+import { isFunction, isHex } from '@polkadot/util';
 
 import { useTranslation } from '../translate';
 
@@ -18,7 +20,7 @@ interface Props {
 }
 
 interface HashState {
-  hash?: string;
+  hash?: HexString;
   isHashValid: boolean;
 }
 
@@ -27,11 +29,13 @@ function Propose ({ className = '', onClose }: Props): React.ReactElement<Props>
   const { api } = useApi();
   const [accountId, setAccountId] = useState<string | null>(null);
   const [balance, setBalance] = useState<BN | undefined>();
-  const [{ hash, isHashValid }, setHash] = useState<HashState>({ hash: '', isHashValid: false });
+  const [{ hash, isHashValid }, setHash] = useState<HashState>({ isHashValid: false });
   const publicProps = useCall<unknown[]>(api.query.democracy.publicProps);
+  const preimage = usePreimage(hash);
 
   const _onChangeHash = useCallback(
-    (hash?: string): void => setHash({ hash, isHashValid: isHex(hash, 256) }),
+    (hash?: string): void =>
+      setHash({ hash: hash as HexString, isHashValid: isHex(hash, 256) }),
     []
   );
 
@@ -89,13 +93,15 @@ function Propose ({ className = '', onClose }: Props): React.ReactElement<Props>
         <TxButton
           accountId={accountId}
           icon='plus'
-          isDisabled={!balance || !hasMinLocked || !isHashValid || !accountId || !publicProps}
+          isDisabled={!balance || !hasMinLocked || !isHashValid || !accountId || !publicProps || (isFunction(api.tx.preimage?.notePreimage) && !isFunction(api.tx.democracy?.notePreimage) && !preimage)}
           label={t<string>('Submit proposal')}
           onStart={onClose}
           params={
             api.tx.democracy.propose.meta.args.length === 3
               ? [hash, balance, publicProps?.length]
-              : [hash, balance]
+              : isFunction(api.tx.preimage?.notePreimage) && !isFunction(api.tx.democracy?.notePreimage)
+                ? [preimage && { Lookup: { hash: preimage.proposalHash, len: preimage.proposalLength } }, balance]
+                : [hash, balance]
           }
           tx={api.tx.democracy.propose}
         />