Release 0.7.1

tqtezos · May 13, 2021 · 7f7c1bb · 7f7c1bb
1 parent 2e7c92e
commit 7f7c1bb
Show file tree

Hide file tree

Showing 24 changed files with 423 additions and 613 deletions.
diff --git a/README.md b/README.md
@@ -26,13 +26,6 @@ yarn install
 yarn start
 ```
 
-Or with NPM:
-
-```
-npm install
-npm start
-```
-
 ## Support
 
 OpenMinter supports the following networks and software components:

diff --git a/config/mainnet.json b/config/mainnet.json
@@ -6,7 +6,7 @@
     "gui": "https://better-call.dev"
   },
   "tzkt": {
-    "api": "https://staging.api.mainnet.tzkt.io"
+    "api": "https://api.mainnet.tzkt.io"
   },
   "contracts": {
     "nftFaucet": "KT1QcxwB4QyPKfmSwjH1VRxa6kquUjeDWeEy",

diff --git a/config/testnet.json b/config/testnet.json
@@ -1,21 +1,21 @@
 {
-  "rpc": "https://rpctest.tzbeta.net",
-  "network": "edonet",
-  "bcd": {
-    "api": "https://api.better-call.dev",
-    "gui": "https://better-call.dev"
-  },
-  "tzkt": {
-    "api": "https://staging.api.edo2net.tzkt.io"
-  },
-  "contracts": {
-    "nftFaucet": "KT1Hagc5XQYzkX7HfRbUNXdi4CBfiENzbHiU",
-    "marketplace": {
-      "fixedPrice": {
-        "tez": "KT1H4tMRW3o9GdPJ3r82ZC7BJiR6WgmYazUC"
-      }
-    }
-  },
-  "ipfsApi": "https://minter-api.tqhosted.com",
-  "ipfsGateway": "https://tqtezos.mypinata.cloud"
+	"network": "florencenet",
+	"rpc": "https://api.tez.ie/rpc/florencenet",
+	"bcd": {
+		"api": "https://api.better-call.dev",
+		"gui": "https://better-call.dev"
+	},
+	"tzkt": {
+		"api": "https://api.florencenet.tzkt.io"
+	},
+	"contracts": {
+		"nftFaucet": "KT1DzPX2SHnviWURFUfD5NQ9FcHQVmYFuPYu",
+		"marketplace": {
+			"fixedPrice": {
+				"tez": "KT1X9YgJbwhGgPcJqtvcyn6ceGeUZ7DwPsDm"
+			}
+		}
+	},
+	"ipfsApi": "https://minter-api.tqhosted.com",
+	"ipfsGateway": "https://tqtezos.mypinata.cloud"
 }
diff --git a/package.json b/package.json
@@ -9,11 +9,11 @@
     "@emotion/react": "11.1.4",
     "@emotion/styled": "11.0.0",
     "@reduxjs/toolkit": "1.5.0",
-    "@taquito/beacon-wallet": "8.1.0",
-    "@taquito/signer": "8.1.0",
-    "@taquito/taquito": "8.1.0",
-    "@taquito/tzip12": "8.1.0",
-    "@taquito/tzip16": "8.1.0",
+    "@taquito/beacon-wallet": "9.0.0",
+    "@taquito/signer": "9.0.0",
+    "@taquito/taquito": "9.0.0",
+    "@taquito/tzip12": "9.0.0",
+    "@taquito/tzip16": "9.0.0",
     "@tqtezos/minter-contracts": "1.2.0",
     "@types/lodash": "4.14.165",
     "@types/react": "16.9.12",
@@ -29,6 +29,7 @@
     "framer-motion": "3.1.4",
     "immer": "8.0.0",
     "io-ts": "2.2.16",
+    "io-ts-types": "0.5.16",
     "joi": "17.3.0",
     "react": "16.13.1",
     "react-dom": "16.13.1",

diff --git a/scripts/bootstrap.ts b/scripts/bootstrap.ts
@@ -60,7 +60,7 @@ const askConfigQuestions = (): Promise<ConfigInput> => {
     {
       name: 'network',
       type: 'list',
-      choices: ['Mainnet', 'Edonet'],
+      choices: ['Mainnet', 'Florencenet'],
       message: 'Select the network to deploy OpenMinter contracts to:',
       filter: function (val: string) {
         return val.toLowerCase();
@@ -79,12 +79,12 @@ const askConfigQuestions = (): Promise<ConfigInput> => {
             "https://mainnet-tezos.giganode.io",
             "Other"
           ]
-        } else if (input.network === "edonet") {
+        } else if (input.network === "florencenet") {
           rpcOpts = [
             "https://rpctest.tzbeta.net",
-            "https://edonet.smartpy.io",
-            "https://api.tez.ie/rpc/edonet",
-            "https://edonet-tezos.giganode.io",
+            "https://florencenet.smartpy.io",
+            "https://api.tez.ie/rpc/florencenet",
+            "https://testnet-tezos.giganode.io",
             "Other"
           ]
         }
@@ -186,7 +186,7 @@ const saveConfig = (input: ConfigInput) => {
   config.set('rpc', input.rpc === "Other" ? input.rpcCustom : input.rpc);
   config.set('bcd.api', "https://api.better-call.dev");
   config.set('bcd.gui', "https://better-call.dev");
-  config.set('tzkt.api', input.network === "mainnet" ? "https://staging.api.mainnet.tzkt.io" : "https://staging.api.edo2net.tzkt.io");
+  config.set('tzkt.api', input.network === "mainnet" ? "https://api.mainnet.tzkt.io" : "https://api.florencenet.tzkt.io");
   config.set('admin.address', input.adminPkh);
   config.set('admin.secret', input.adminSk);
   config.set('ipfsApi', "https://minter-api.tqhosted.com");

diff --git a/src/components/Collections/Catalog/CollectionDisplay.tsx b/src/components/Collections/Catalog/CollectionDisplay.tsx
@@ -1,160 +1,21 @@
-import React, { useEffect, useState } from 'react';
-import { useLocation } from 'wouter';
+import React, { useEffect } from 'react';
 import {
-  AspectRatio,
-  Box,
   Flex,
   Heading,
-  Image,
   Link,
   SimpleGrid,
   Spinner,
   Text
 } from '@chakra-ui/react';
 import { MinterButton } from '../../common';
-import { ExternalLink, Wind, HelpCircle } from 'react-feather';
-import { Token } from '../../../reducer/slices/collections';
-import { IpfsGatewayConfig, ipfsUriToGatewayUrl } from '../../../lib/util/ipfs';
+import { ExternalLink, Wind } from 'react-feather';
 import { useDispatch, useSelector } from '../../../reducer';
 import {
   getContractNftsQuery,
   getNftAssetContractQuery
 } from '../../../reducer/async/queries';
 import CollectionsDropdown from './CollectionsDropdown';
-
-function MediaNotFound() {
-  return (
-    <Flex
-      flexDir="column"
-      align="center"
-      justify="center"
-      flex="1"
-      bg="gray.100"
-      color="gray.300"
-      height="100%"
-    >
-      <HelpCircle size="70px" />
-    </Flex>
-  );
-}
-
-function TokenImage(props: TokenTileProps) {
-  const src = ipfsUriToGatewayUrl(props.config, props.artifactUri);
-  const [errored, setErrored] = useState(false);
-  const [obj, setObj] = useState<{ url: string; type: string } | null>(null);
-  useEffect(() => {
-    (async () => {
-      let blob;
-      try {
-        blob = await fetch(src).then(r => r.blob());
-      } catch (e) {
-        return setErrored(true);
-      }
-      setObj({
-        url: URL.createObjectURL(blob),
-        type: blob.type
-      });
-    })();
-  }, [src]);
-
-  if (errored) {
-    return <MediaNotFound />;
-  }
-
-  if (!obj) return null;
-
-  if (/^image\/.*/.test(obj.type)) {
-    return (
-      <Image
-        src={src}
-        objectFit="scale-down"
-        flex="1"
-        height="100%"
-        onError={() => setErrored(true)}
-      />
-    );
-  }
-
-  if (/^video\/.*/.test(obj.type)) {
-    return (
-      <video
-        loop
-        onClick={e => e.preventDefault()}
-        onMouseEnter={e => e.currentTarget.play()}
-        onMouseLeave={e => e.currentTarget.pause()}
-        muted
-      >
-        <source src={obj.url} type={obj.type} />
-      </video>
-    );
-  }
-
-  if (props.metadata.formats?.length) {
-    if (
-      props.metadata.formats[0].mimeType === 'model/gltf-binary' ||
-      props.metadata.formats[0].mimeType === 'model/gltf+json'
-    ) {
-      return (
-        <>
-          <model-viewer
-            auto-rotate
-            rotation-per-second="30deg"
-            src={obj.url}
-            class="grid"
-          ></model-viewer>
-        </>
-      );
-    }
-  }
-
-  return <MediaNotFound />;
-}
-
-interface TokenTileProps extends Token {
-  config: IpfsGatewayConfig;
-  address: string;
-}
-
-function TokenTile(props: TokenTileProps) {
-  const [, setLocation] = useLocation();
-  return (
-    <Flex
-      flexDir="column"
-      ratio={1}
-      w="100%"
-      bg="white"
-      border="1px solid"
-      borderColor="brand.lightBlue"
-      borderRadius="3px"
-      overflow="hidden"
-      boxShadow="0px 0px 0px 4px rgba(15, 97, 255, 0)"
-      transition="all linear 50ms"
-      _hover={{
-        cursor: 'pointer',
-        boxShadow: '0px 0px 0px 4px rgba(15, 97, 255, 0.1)'
-      }}
-      onClick={() =>
-        setLocation(`/collection/${props.address}/token/${props.id}`)
-      }
-    >
-      <AspectRatio ratio={3 / 2}>
-        <Box p={4}>
-          <TokenImage {...props} />
-        </Box>
-      </AspectRatio>
-      <Flex
-        width="100%"
-        px={4}
-        py={4}
-        bg="white"
-        borderTop="1px solid"
-        borderColor="brand.lightBlue"
-      >
-        <Text>{props.title}</Text>
-      </Flex>
-    </Flex>
-  );
-}
+import TokenCard from '../../common/TokenCard';
 
 interface CollectionDisplayProps {
   address: string | null;
@@ -276,7 +137,7 @@ export default function CollectionDisplay({
               {collection.address}
             </Text>
             <Link
-              href={config.bcd.gui + '/' + collection.address}
+              href={`${config.bcd.gui}/${config.network}/${collection.address}`}
               color="brand.darkGray"
               isExternal
               ml={2}
@@ -303,8 +164,8 @@ export default function CollectionDisplay({
       <SimpleGrid columns={{ sm: 1, md: 2, lg: 3, xl: 4 }} gap={8} pb={8}>
         {tokens.map(token => {
           return (
-            <TokenTile
-              key={token.id}
+            <TokenCard
+              key={address + token.id}
               address={address}
               config={config}
               {...token}

diff --git a/src/components/Collections/Catalog/CollectionTab.tsx b/src/components/Collections/Catalog/CollectionTab.tsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import { Flex, Text } from '@chakra-ui/react';
+import {
+    Collection
+} from '../../../reducer/slices/collections';
+
+interface CollectionTabProps extends Collection {
+    selected: boolean;
+    onSelect: (address: string) => void;
+}
+
+export default function CollectionTab({
+    address,
+    metadata,
+    selected,
+    onSelect
+}: CollectionTabProps) {
+    return (
+        <Flex
+            align="center"
+            py={2}
+            px={4}
+            bg={selected ? 'gray.100' : 'white'}
+            color={selected ? 'black' : 'gray.600'}
+            _hover={{
+                cursor: 'pointer',
+                color: selected ? 'black' : 'gray.800'
+            }}
+            onClick={() => onSelect(address)}
+            role="group"
+        >
+            <Flex
+                align="center"
+                justify="center"
+                w={8}
+                h={8}
+                bg={selected ? 'brand.blue' : 'gray.100'}
+                color={selected ? 'white' : 'gray.400'}
+                borderRadius="100%"
+                fontWeight="600"
+                _groupHover={{
+                    bg: selected ? 'brand.blue' : 'gray.200'
+                }}
+            >
+                <Text>{metadata?.name ? metadata.name[0] : '?'}</Text>
+            </Flex>
+            <Text pl={4} fontWeight={selected ? '600' : '600'}>
+                {metadata?.name || address}
+            </Text>
+        </Flex>
+    );
+}
diff --git a/src/components/Collections/Catalog/CollectionsDropdown.tsx b/src/components/Collections/Catalog/CollectionsDropdown.tsx
@@ -59,9 +59,9 @@ export default function CollectionsDropdown() {
             </Text>
             {Object.keys(state.collections)
               .filter(address => address !== state.globalCollection)
-              .map(address => (
+              .map((address, idx) => (
                 <MenuItemOption
-                  key={address}
+                  key={address + idx}
                   value={address}
                   selected={address === state.selectedCollection}
                   onClick={() => dispatch(selectCollection(address))}