Cudos dev

.env-dev

@@ -5,3 +5,4 @@ PORT=3000
 NEXT_PUBLIC_URL=http://localhost:3000
 NEXT_PUBLIC_WS_CHAIN_URL=ws://localhost:26657/websocket
 NEXT_PUBLIC_CHAIN_STATUS=testnet
+NEXT_PUBLIC_APP_DEPLOYMENT_VERSION='v1.2.3'

.env.sample

@@ -13,3 +13,4 @@ PORT=3000
 NEXT_PUBLIC_URL=http://localhost:3000
 NEXT_PUBLIC_RPC_WEBSOCKET=http://localhost:26657/websocket
 NEXT_PUBLIC_CHAIN_TYPE=testnet
+NEXT_PUBLIC_APP_DEPLOYMENT_VERSION='v1.2.3'

Dockerfile-dev → Dockerfile.dev

@@ -23,6 +23,7 @@ ARG NEXT_PUBLIC_GRAPHQL_WS
 ARG NEXT_PUBLIC_URL
 ARG NEXT_PUBLIC_WS_CHAIN_URL
 ARG NEXT_PUBLIC_CHAIN_STATUS
+ARG NEXT_PUBLIC_APP_DEPLOYMENT_VERSION
 ARG NODE_ENV
 ARG PORT=3000
 
@@ -33,6 +34,7 @@ ENV NEXT_PUBLIC_GRAPHQL_WS ${NEXT_PUBLIC_GRAPHQL_WS}
 ENV NEXT_PUBLIC_URL ${NEXT_PUBLIC_URL}
 ENV NEXT_PUBLIC_WS_CHAIN_URL ${NEXT_PUBLIC_WS_CHAIN_URL}
 ENV NEXT_PUBLIC_CHAIN_STATUS ${NEXT_PUBLIC_CHAIN_STATUS}
+ENV NEXT_PUBLIC_APP_DEPLOYMENT_VERSION ${NEXT_PUBLIC_APP_DEPLOYMENT_VERSION}
 ENV NODE_ENV ${NODE_ENV}
 ENV PORT ${PORT}
 ENV NODE_OPTIONS="--max-old-space-size=8192"

Dockerfile-prod → Dockerfile.prod

@@ -27,6 +27,7 @@ ARG NEXT_PUBLIC_WS_CHAIN_URL
 ARG NEXT_PUBLIC_RPC_WEBSOCKET
 ARG NEXT_PUBLIC_CHAIN_STATUS
 ARG NEXT_PUBLIC_CHAIN_TYPE
+ARG NEXT_PUBLIC_APP_DEPLOYMENT_VERSION
 ARG NODE_ENV
 ARG PORT=3000
 
@@ -38,6 +39,7 @@ ENV NEXT_PUBLIC_WS_CHAIN_URL ${NEXT_PUBLIC_WS_CHAIN_URL}
 ENV NEXT_PUBLIC_RPC_WEBSOCKET ${NEXT_PUBLIC_RPC_WEBSOCKET}
 ENV NEXT_PUBLIC_CHAIN_STATUS ${NEXT_PUBLIC_CHAIN_STATUS}
 ENV NEXT_PUBLIC_CHAIN_TYPE ${NEXT_PUBLIC_CHAIN_TYPE}
+ENV NEXT_PUBLIC_APP_DEPLOYMENT_VERSION ${NEXT_PUBLIC_APP_DEPLOYMENT_VERSION}
 ENV NODE_ENV ${NODE_ENV}
 ENV PORT ${PORT}
 ENV NODE_OPTIONS="--max-old-space-size=8192"

docker-compose-dev.yml

@@ -4,13 +4,14 @@ services:
     container_name: explorer-v2
     build:
       context: .
-      dockerfile: Dockerfile-dev
+      dockerfile: Dockerfile.dev
       args:
         NEXT_PUBLIC_GRAPHQL_URL: ${NEXT_PUBLIC_GRAPHQL_URL}
         NEXT_PUBLIC_GRAPHQL_WS: ${NEXT_PUBLIC_GRAPHQL_WS}
         NEXT_PUBLIC_URL: ${NEXT_PUBLIC_URL}
         NEXT_PUBLIC_WS_CHAIN_URL: ${NEXT_PUBLIC_WS_CHAIN_URL}
         NEXT_PUBLIC_CHAIN_STATUS: ${NEXT_PUBLIC_CHAIN_STATUS}
+        NEXT_PUBLIC_APP_DEPLOYMENT_VERSION: ${NEXT_PUBLIC_APP_DEPLOYMENT_VERSION}
         NODE_ENV: ${NODE_ENV}
         PORT: ${PORT}
     restart: always

docker-compose-prod.yml

@@ -4,13 +4,14 @@ services:
     container_name: explorer-v2
     build:
       context: .
-      dockerfile: Dockerfile-prod
+      dockerfile: Dockerfile.prod
       args:
         NEXT_PUBLIC_GRAPHQL_URL: ${NEXT_PUBLIC_GRAPHQL_URL}
         NEXT_PUBLIC_GRAPHQL_WS: ${NEXT_PUBLIC_GRAPHQL_WS}
         NEXT_PUBLIC_URL: ${NEXT_PUBLIC_URL}
         NEXT_PUBLIC_WS_CHAIN_URL: ${NEXT_PUBLIC_WS_CHAIN_URL}
         NEXT_PUBLIC_CHAIN_STATUS: ${NEXT_PUBLIC_CHAIN_STATUS}
+        NEXT_PUBLIC_APP_DEPLOYMENT_VERSION: ${NEXT_PUBLIC_APP_DEPLOYMENT_VERSION}
         NODE_ENV: ${NODE_ENV}
         PORT: ${PORT}
     restart: always

next.config.js

@@ -2,6 +2,7 @@ const nextTranslate = require('next-translate');
 
 module.exports = nextTranslate({
   poweredByHeader: false,
+  productionBrowserSourceMaps: true,
   webpack: (config) => {
     config.module.rules.push({
       test: /\.svg$/,

public/locales/en/common.json

@@ -62,6 +62,7 @@
   "errorDetails": "If you have time please report it to our github at <0>{{issue}}</0> with the url that caused the error.",
   "errorHome": "Click here to go back home",
   "maintainBy": "Maintained By <0>{{name}}</0>",
+  "appVersion": "App version: <0>{{appVersion}}</0>",
   "txListFormat": "Transactions Format",
   "compact": "Compact",
   "detailed": "Detailed",

public/locales/en/message_contents.json

@@ -62,5 +62,22 @@
   "txMigrateContract": "<0>{{admin}}</0> migrated contract <1>{{contract}}</1> to <1>{{newCodeId}}</1>",
   "txUpdateContractAdmin": "<0>{{admin}}</0> updated contract <1>{{contract}}</1> admin to <2>{{newAdmin}}</2>",
   "txClearContractAdmin": "<0>{{admin}}</0> cleared admin on contract <1>{{contract}}</1>",
-  "MsgSendToCosmosClaim": "<0>{{ethSender}}</0> sent <1>{{amount}}</1> to <2>{{receiver}}</2>"
+  "MsgSendToCosmosClaim": "<0>{{ethSender}}</0> sent <1>{{amount}}</1> to <2>{{receiver}}</2>",
+  "MsgSendToEth": "<0>{{sender}}</0> sent <1>{{amount}}</1> to <2>{{ethDest}}</2>",
+  "MsgCancelSendToEth": "<0>{{sender}}</0> cancelled Send to ETH TX with ID: <1>{{id}}</1>",
+  "txCreateAddress": "<0>{{creator}}</0> created an addressbook record with the following details - <1></1>",
+  "txUpdateAddress": "<0>{{creator}}</0> updated an addressbook record. New details - <1></1>",
+  "txDeleteAddress": "<0>{{creator}}</0> deleted the following addressbook record - <1></1>",
+  "txCreateCollection": "<0>{{creator}}</0> created '<3>{{collectionId}}</3>' collection. <1></1><2></2>",
+  "txPublishCollection": "<0>{{creator}}</0> published '<3>{{collectionId}}</3>' collection. <1></1><2></2>",
+  "txUpdateRoyalties": "<0>{{creator}}</0> updated royalties for collection with ID: '<3>{{collectionId}}</3>' <1></1><2></2>",
+  "txVerifyCollection": "Marketplace admin: <1>{{admin}}</1> verified collection with ID: <2>{{collectionId}}</2> created by: <0>{{creator}}</0>",
+  "txUnverifyCollection": "Marketplace admin: <1>{{admin}}</1> unverified collection with ID: <2>{{collectionId}}</2> created by: <0>{{creator}}</0>",
+  "txAddAdmin": "<0>{{creator}}</0> added <1>{{address}}</1> as marketplace admin",
+  "txRemoveAdmin": "<0>{{creator}}</0> removed <1>{{address}}</1> from marketplace admins",
+  "txMintNft": "<0>{{creator}}</0> minted an NFT to <1>{{recipient}}</1> <2></2>",
+  "txPublishNft": "<0>{{creator}}</0> published for sale NFT with ID: <3>{{tokenId}}</3> from collection ID: <2>{{denomId}}</2> for <1>{{price}}</1>",
+  "txRemoveNft": "<0>{{creator}}</0> removed from sale NFT with ID: <1>{{id}}</1>",
+  "txUpdatePrice": "<0>{{creator}}</0> updated the price of NFT with ID: <2>{{id}}</2>. New price: <1>{{price}}</1>",
+  "txBuyNft": "<0>{{buyer}}</0> purchased NFT with ID: <3>{{id}}</3> from <1>{{seller}}</1> for <2>{{price}}</2>"
 }

public/locales/en/message_labels.json

@@ -63,5 +63,36 @@
   "txMigrateContract": "Migrate Contract",
   "txUpdateContractAdmin": "Update Contract Admin",
   "txClearContractAdmin": "Clear Contract Admin",
-  "MsgSendToCosmosClaim": "Gravity Bridge - Ethereum to Cosmos"
+  "MsgSendToCosmosClaim": "Gravity Bridge - Ethereum to Cosmos",
+  "MsgCancelSendToEth": "Gravity Bridge - Cancel Send To Eth",
+  "MsgSendToEth": "Gravity Bridge - Cosmos to Ethereum",
+  "txCreateAddress": "New Address Book Record",
+  "txUpdateAddress": "Update Address Book Record",
+  "txDeleteAddress": "Delete Address Book Record",
+  "txCreateCollection": "Create NFT Collection",
+  "txPublishCollection": "Publish NFT Collection",
+  "txUpdateRoyalties": "Update NFT Collection Royalties",
+  "txVerifyCollection": "Verify NFT Collection",
+  "txUnverifyCollection": "Unverify NFT Collection",
+  "txAddAdmin": "Add Marketplace Admin",
+  "txRemoveAdmin": "Remove Marketplace Admin",
+  "txMintNft": "Mint NFT",
+  "txPublishNft": "Publish NFT for sale",
+  "txRemoveNft": "Remove NFT from sale",
+  "txUpdatePrice": "Update NFT price",
+  "txBuyNft": "Buy NFT",
+  "MsgCreateGroup":"Create Group",
+  "MsgCreateGroupPolicy":"Create Group Policy",
+  "MsgCreateGroupWithPolicy":"Create Group with Policy",
+  "MsgExec":"Execute Group Proposal",
+  "MsgLeaveGroup":"Leave Group",
+  "MsgSubmitProposal":"Submit Group Proposal",
+  "MsgUpdateGroupAdmin":"Update Group Admin",
+  "MsgUpdateGroupMembers":"Update Group Members",
+  "MsgUpdateGroupMetadata":"Update Group Metadata",
+  "MsgUpdateGroupPolicyAdmin":"Update Group Policy Admin",
+  "MsgUpdateGroupPolicyDecisionPolicy":"Update Group Decision Policy",
+  "MsgUpdateGroupPolicyMetadata":"Update Group Policy Metadata",
+  "MsgVote":"Group Proposal Vote",
+  "MsgWithdrawProposal":"Withdraw Proposal"
 }

src/components/addressbook_details/index.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { AddressBookDetailsValue } from '@src/models/msg/types';
+import StyledTypographyPair from '../styled_typography_pair';
+
+const AddressBookDetails = ({ content }: { content: AddressBookDetailsValue }) => {
+  return (
+    <>
+      {content.network ? <StyledTypographyPair text="Network:" content={content.network} /> : null}
+      {content.label ? <StyledTypographyPair text="Label:" content={content.label} /> : null}
+      {content.value ? <StyledTypographyPair text="Value:" content={content.value} /> : null}
+    </>
+  );
+};
+
+export default AddressBookDetails;

src/components/addressbook_details/styles.ts

@@ -0,0 +1,5 @@
+export const addressBookDetails = {
+  gap: '10px',
+  width: '100%',
+  display: 'flex',
+};

src/components/footer/__snapshots__/index.test.tsx.snap

@@ -317,7 +317,7 @@ exports[`component: layout/footer matches snapshot 1`] = `
     <p
       className="MuiTypography-root footer__closing--text MuiTypography-body1"
     >
-      common:maintainBy
+      common:appVersion
     </p>
   </div>
 </div>

src/components/footer/index.tsx

@@ -145,7 +145,7 @@ const Footer: React.FC<{className?: string}> = ({ className }) => {
           {' '}
           {year}
         </Typography>
-        <Typography className="footer__closing--text">
+        {/* <Typography className="footer__closing--text">
           <Trans
             i18nKey="common:maintainBy"
             components={[
@@ -158,6 +158,20 @@ const Footer: React.FC<{className?: string}> = ({ className }) => {
               name: generalConfig.maintainer.name,
             }}
           />
+        </Typography> */}
+        <Typography className="footer__closing--text">
+          <Trans
+            i18nKey="common:appVersion"
+            components={[
+              (
+                // eslint-disable-next-line
+                <a target="_blank" rel="noreferrer" href={`https://github.com/CudoVentures/big-dipper-2.0-cosmos/releases/tag/${process.env.NEXT_PUBLIC_APP_DEPLOYMENT_VERSION}`} />
+              ),
+            ]}
+            values={{
+              appVersion: process.env.NEXT_PUBLIC_APP_DEPLOYMENT_VERSION,
+            }}
+          />
         </Typography>
       </div>
     </div>

src/components/index.ts

@@ -33,6 +33,9 @@ import AvatarNameListMsg from './avatar_name_list_msg';
 import {
   ContractOverview, ContractMessages, ContractMessagesList, SingleContractMessageMobile,
 } from './cosmwasm';
+import AddressBookDetails from './addressbook_details';
+import RoyaltiesDetails from './royalties_details';
+import NftDetails from './nft_details';
 
 export {
   Layout,
@@ -71,4 +74,7 @@ export {
   ContractMessages,
   ContractMessagesList,
   SingleContractMessageMobile,
+  AddressBookDetails,
+  RoyaltiesDetails,
+  NftDetails,
 };

src/components/msg/addressbook/create_address/__snapshots__/index.test.tsx.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`screen: TransactionDetails/MsgCreateAddress matches snapshot 1`] = `
+<p
+  className="MuiTypography-root MuiTypography-body1"
+>
+  message_contents:txCreateAddress
+</p>
+`;

src/components/msg/addressbook/create_address/index.test.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { RecoilRoot } from 'recoil';
+import renderer from 'react-test-renderer';
+import { MockTheme } from '@tests/utils';
+import { MsgCreateAddress } from '@models';
+import CreateAddress from '.';
+
+// ==================================
+// mocks
+// ==================================
+
+jest.mock('@components', () => ({
+  Name: (props) => <div id="Name" {...props} />,
+}));
+
+// ==================================
+// unit tests
+// ==================================
+describe('screen: TransactionDetails/MsgCreateAddress', () => {
+  it('matches snapshot', () => {
+    const message = new MsgCreateAddress({
+      category: 'addressbook',
+      type: 'MsgCreateAddress',
+      creator: 'creatorAddress',
+      network: 'testNetwork',
+      label: 'testLabel',
+      value: 'testValue',
+    });
+    const component = renderer.create(
+      <RecoilRoot>
+        <MockTheme>
+          <CreateAddress
+            message={message}
+          />
+        </MockTheme>
+      </RecoilRoot>,
+    );
+    const tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+});

src/components/msg/addressbook/create_address/index.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import Trans from 'next-translate/Trans';
+import { Typography } from '@material-ui/core';
+import {
+  Name,
+  AddressBookDetails,
+} from '@components';
+import { MsgCreateAddress } from '@models';
+
+const CreateAddress = (props: {
+  message: MsgCreateAddress;
+}) => {
+  const { message } = props;
+  const { creator } = message;
+
+  return (
+    <Typography>
+      <Trans
+        i18nKey="message_contents:txCreateAddress"
+        components={[
+          (
+            <Name
+              address={creator}
+              name={creator}
+            />
+          ),
+          (
+            <AddressBookDetails
+              content={{
+                network: message.network,
+                label: message.label,
+                value: message.value,
+              }}
+            />
+          ),
+        ]}
+      />
+    </Typography>
+  );
+};
+
+export default CreateAddress;

src/components/msg/addressbook/delete_address/__snapshots__/index.test.tsx.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`screen: TransactionDetails/MsgDeleteAddress matches snapshot 1`] = `
+<p
+  className="MuiTypography-root MuiTypography-body1"
+>
+  message_contents:txDeleteAddress
+</p>
+`;

src/components/msg/addressbook/delete_address/index.test.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { RecoilRoot } from 'recoil';
+import renderer from 'react-test-renderer';
+import { MockTheme } from '@tests/utils';
+import { MsgDeleteAddress } from '@models';
+import CreateAddress from '.';
+
+// ==================================
+// mocks
+// ==================================
+
+jest.mock('@components', () => ({
+  Name: (props) => <div id="Name" {...props} />,
+}));
+
+// ==================================
+// unit tests
+// ==================================
+describe('screen: TransactionDetails/MsgDeleteAddress', () => {
+  it('matches snapshot', () => {
+    const message = new MsgDeleteAddress({
+      category: 'addressbook',
+      type: 'MsgDeleteAddress',
+      creator: 'creatorAddress',
+      network: 'testNetwork',
+      label: 'testLabel',
+      value: 'testValue',
+    });
+    const component = renderer.create(
+      <RecoilRoot>
+        <MockTheme>
+          <CreateAddress
+            message={message}
+          />
+        </MockTheme>
+      </RecoilRoot>,
+    );
+    const tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+});