Register action for parachains (#4636)

packages/page-parachains/src/Overview/Actions.tsx

@@ -4,17 +4,35 @@
 import React from 'react';
 
 import { Button } from '@polkadot/react-components';
+import { useApi, useToggle } from '@polkadot/react-hooks';
+
+import RegisterThread from '../modals/RegisterThread';
+import { useTranslation } from '../translate';
 
 interface Props {
   className?: string;
 }
 
-function Actions (): React.ReactElement<Props> {
+function Actions ({ className }: Props): React.ReactElement<Props> {
+  const { t } = useTranslation();
+  const { api } = useApi();
+  const [isRegisterOpen, toggleRegisterOpen] = useToggle();
+
   return (
-    <>
-      <Button.Group>
-      </Button.Group>
-    </>
+    <Button.Group className={className}>
+      {api.tx.registrar.register && (
+        <>
+          <Button
+            icon='plus'
+            label={t<string>('Register')}
+            onClick={toggleRegisterOpen}
+          />
+          {isRegisterOpen && (
+            <RegisterThread onClose={toggleRegisterOpen} />
+          )}
+        </>
+      )}
+    </Button.Group>
   );
 }
 

packages/page-parachains/src/modals/RegisterThread.tsx

@@ -41,6 +41,7 @@ function RegisterThread ({ className, onClose }: Props): React.ReactElement<Prop
     <Modal
       className={className}
       header={t<string>('Register parathread')}
+      size='large'
     >
       <Modal.Content>
         <Modal.Columns>
@@ -106,7 +107,7 @@ function RegisterThread ({ className, onClose }: Props): React.ReactElement<Prop
           isDisabled={!isWasmValid || !genesisState}
           onStart={onClose}
           params={[paraId, genesisState, wasm]}
-          tx={api.tx.registrar.registerParathread}
+          tx={api.tx.registrar.register}
         />
       </Modal.Actions>
     </Modal>