Disable collection creation for non admins (#27) (#28)

gear-foundation · Mar 15, 2024 · 0b86e10 · 0b86e10
1 parent b11996f
commit 0b86e10
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 6 deletions.
diff --git a/...tures/create-simple-collection/components/create-collection/create-collection.module.scss b/...tures/create-simple-collection/components/create-collection/create-collection.module.scss
@@ -21,6 +21,10 @@
   &:hover {
     background-color: #eee;
   }
+
+  &:disabled {
+    pointer-events: none;
+  }
 }
 
 .header {

diff --git a/.../src/features/create-simple-collection/components/create-collection/create-collection.tsx b/.../src/features/create-simple-collection/components/create-collection/create-collection.tsx
@@ -13,15 +13,16 @@ type Props = {
   tag: string;
   text: string;
   SVG: SVGComponent;
+  isActive: boolean;
   modal: (props: Pick<ModalProps, 'close'>) => JSX.Element;
 };
 
-function CreateCollection({ heading, tag, text, SVG, modal: Modal }: Props) {
+function CreateCollection({ heading, tag, text, SVG, isActive, modal: Modal }: Props) {
   const [isOpen, open, close] = useModal();
 
   return (
     <>
-      <button className={styles.button} onClick={open}>
+      <button className={styles.button} onClick={isActive ? open : undefined} disabled={!isActive}>
         <span>
           <span className={styles.header}>
             <SVG />

diff --git a/frontend/src/pages/create-collection/create-collection.tsx b/frontend/src/pages/create-collection/create-collection.tsx
@@ -1,3 +1,5 @@
+import { useAccount } from '@gear-js/react-hooks';
+
 import { Container, Skeleton } from '@/components';
 import { useMarketplace } from '@/context';
 import { CreateCollection as CollectionType } from '@/features/create-simple-collection';
@@ -11,16 +13,24 @@ const COLLECTION_TYPE_SKELETONS = [null];
 
 function CreateCollection() {
   const { marketplace } = useMarketplace();
-  const { collectionTypes } = marketplace || {};
+  const { collectionTypes, admins } = marketplace || {};
 
   const msTillCreateIsAvailable = useCreateCountdown();
   const isCreateAvailable = msTillCreateIsAvailable === 0;
   const isReady = Boolean(collectionTypes) && msTillCreateIsAvailable !== undefined;
 
+  const { account } = useAccount();
+  const isAdmin = account && admins ? admins.includes(account.decodedAddress) : false;
+
   const renderCollectionTypes = () =>
     collectionTypes?.map((item) => (
       <li key={item.type}>
-        <CollectionType heading={item.type} text={item.description} {...COLLECTION_TYPE[item.type]} />
+        <CollectionType
+          heading={item.type}
+          text={item.description}
+          isActive={isAdmin}
+          {...COLLECTION_TYPE[item.type]}
+        />
       </li>
     ));
 
@@ -38,8 +48,9 @@ function CreateCollection() {
 
         {isReady && isCreateAvailable && (
           <p className={styles.text}>
-            Choose your collection type: Simple NFT for pre-existing images, Composable NFT to generate layers and
-            compositions, or NFT Collections for Music Creators to craft musical NFTs.
+            {isAdmin
+              ? 'Choose your collection type: Simple NFT for pre-existing images, Composable NFT to generate layers and compositions, or NFT Collections for Music Creators to craft musical NFTs.'
+              : 'The creation of a collection is not available for the current account.'}
           </p>
         )}