Pull nextFreeId for Rococo-gen as well (#5277)

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

@@ -1,14 +1,17 @@
 // Copyright 2017-2021 @polkadot/app-parachains authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type BN from 'bn.js';
+import type { ParaId } from '@polkadot/types/interfaces';
 import type { OwnedId } from '../types';
 
 import React from 'react';
 
 import { Button } from '@polkadot/react-components';
-import { useApi, useToggle } from '@polkadot/react-hooks';
+import { useApi, useCall, useToggle } from '@polkadot/react-hooks';
 
 import { useTranslation } from '../translate';
+import { LOWEST_PUBLIC_ID } from './constants';
 import RegisterId from './RegisterId';
 import RegisterThread from './RegisterThread';
 
@@ -17,11 +20,19 @@ interface Props {
   ownedIds: OwnedId[];
 }
 
+const transformId = {
+  transform: (nextId: ParaId) =>
+    nextId.isZero()
+      ? LOWEST_PUBLIC_ID
+      : nextId
+};
+
 function Actions ({ className, ownedIds }: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
   const { api } = useApi();
   const [isRegisterOpen, toggleRegisterOpen] = useToggle();
   const [isReserveOpen, toggleReserveOpen] = useToggle();
+  const nextParaId = useCall<ParaId | BN>(api.query.registrar.nextFreeParaId, [], transformId);
 
   return (
     <Button.Group className={className}>
@@ -32,7 +43,10 @@ function Actions ({ className, ownedIds }: Props): React.ReactElement<Props> {
         onClick={toggleReserveOpen}
       />
       {isReserveOpen && (
-        <RegisterId onClose={toggleReserveOpen} />
+        <RegisterId
+          nextParaId={nextParaId}
+          onClose={toggleReserveOpen}
+        />
       )}
       <Button
         icon='plus'
@@ -42,6 +56,7 @@ function Actions ({ className, ownedIds }: Props): React.ReactElement<Props> {
       />
       {isRegisterOpen && (
         <RegisterThread
+          nextParaId={nextParaId}
           onClose={toggleRegisterOpen}
           ownedIds={ownedIds}
         />

packages/page-parachains/src/Parathreads/RegisterId.tsx

@@ -2,33 +2,24 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type BN from 'bn.js';
-import type { ParaId } from '@polkadot/types/interfaces';
 
 import React, { useState } from 'react';
 
 import { InputAddress, InputBalance, InputNumber, Modal, TxButton } from '@polkadot/react-components';
-import { useApi, useCall } from '@polkadot/react-hooks';
+import { useApi } from '@polkadot/react-hooks';
 
 import { useTranslation } from '../translate';
-import { LOWEST_PUBLIC_ID } from './constants';
 
 interface Props {
   className?: string;
+  nextParaId?: BN;
   onClose: () => void;
 }
 
-const transformId = {
-  transform: (nextId: ParaId) =>
-    nextId.isZero()
-      ? LOWEST_PUBLIC_ID
-      : nextId
-};
-
-function RegisterId ({ className, onClose }: Props): React.ReactElement<Props> {
+function RegisterId ({ className, nextParaId, onClose }: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
   const { api } = useApi();
   const [accountId, setAccountId] = useState<string | null>(null);
-  const nextParaId = useCall<ParaId | BN>(api.query.registrar?.nextFreeParaId, [], transformId);
 
   return (
     <Modal

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

@@ -17,11 +17,12 @@ import { LOWEST_INVALID_ID } from './constants';
 
 interface Props {
   className?: string;
+  nextParaId?: BN;
   onClose: () => void;
   ownedIds: OwnedId[];
 }
 
-function RegisterThread ({ className, onClose, ownedIds }: Props): React.ReactElement<Props> {
+function RegisterThread ({ className, nextParaId, onClose, ownedIds }: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
   const { api } = useApi();
   const [accountId, setAccountId] = useState<string | null>(null);
@@ -84,7 +85,7 @@ function RegisterThread ({ className, onClose, ownedIds }: Props): React.ReactEl
               <Modal.Columns hint={t<string>('The id of this parachain as known on the network')}>
                 <InputNumber
                   autoFocus
-                  defaultValue={LOWEST_INVALID_ID}
+                  defaultValue={nextParaId}
                   isError={isIdError}
                   isZeroable={false}
                   label={t<string>('parachain id')}