Added tokens, NFTs, and transactions (multiversx#3)

* Added Tokens and NFTs to Dashboard.tsx
buidly · Jun 12, 2024 · 8e57b1a · 8e57b1a
1 parent a95a230
commit 8e57b1a
Show file tree

Hide file tree

Showing 135 changed files with 1,829 additions and 3,852 deletions.
diff --git a/README.md b/README.md
@@ -1,9 +1,9 @@
 # @multiversx/template-dapp
 
-The **MultiversX dApp Template**, built using [React.js](https://reactjs.org/) and [Typescript](https://www.typescriptlang.org/).
+The **MultiversX Lite Wallet dApp**, built using [React.js](https://reactjs.org/) and [Typescript](https://www.typescriptlang.org/).
 It's a basic implementation of [@multiversx/sdk-dapp](https://www.npmjs.com/package/@multiversx/sdk-dapp), providing the basics for MultiversX authentication and TX signing.
 
-See [Dapp template](https://template-dapp.multiversx.com/) for live demo.
+See [Lite Wallet dApp](https://lite-wallet-dapp.multiversx.com/) for live demo.
 
 ## Requirements
 

diff --git a/index.html b/index.html
@@ -42,7 +42,7 @@
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:site" content="@MultiversX" />
     <meta name="twitter:creator" content="@MultiversX" />
-    <meta name="twitter:title" content="MultiversX dApp Template" />
+    <meta name="twitter:title" content="MultiversX Lite Wallet dApp" />
     <meta
       name="twitter:description"
       content="A basic implementation of MultiversX dApp providing the basics for MultiversX authentication and TX signing."
@@ -54,7 +54,7 @@
 
     <!-- Other Cards -->
     <meta property="og:url" content="https://template-dapp.multiversx.com" />
-    <meta property="og:title" content="MultiversX dApp Template" />
+    <meta property="og:title" content="MultiversX Lite Wallet dApp" />
     <meta
       property="og:description"
       content="A basic implementation of MultiversX dApp providing the basics for MultiversX authentication and TX signing."
@@ -64,7 +64,7 @@
       content="https://template-dapp.multiversx.com/preview.jpg"
     />
 
-    <title>Template dApp</title>
+    <title>Lite Wallet dApp</title>
   </head>
   <body class="bg-slate-200">
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/package.json b/package.json
@@ -1,23 +1,28 @@
 {
-  "name": "@multiversx/mx-template-dapp",
-  "description": "MultiversX Dapp Template",
+  "name": "@multiversx/mx-lite-wallet-dapp",
+  "description": "MultiversX Lite Wallet DApp",
   "version": "1.0.0",
   "author": "MultiversX",
   "license": "GPL-3.0-or-later",
-  "repository": "@multiversx/mx-template-dapp",
+  "repository": "@multiversx/mx-lite-wallet-dapp",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "6.5.1",
     "@fortawesome/free-solid-svg-icons": "6.5.1",
     "@fortawesome/react-fontawesome": "0.2.0",
     "@multiversx/sdk-core": "13.0.1",
-    "@multiversx/sdk-dapp": "2.32.0",
+    "@multiversx/sdk-dapp": "2.33.2",
+    "@multiversx/sdk-dapp-form": "^0.10.10",
     "@multiversx/sdk-network-providers": "2.2.1",
+    "@reduxjs/toolkit": "1.9.1",
     "axios": "1.6.5",
     "classnames": "2.3.2",
     "moment": "2.29.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-router-dom": "6.16.0"
+    "react-qr-code": "^2.0.14",
+    "react-redux": "8.0.5",
+    "react-router-dom": "6.16.0",
+    "redux-persist": "6.0.0"
   },
   "scripts": {
     "lint": "eslint --ext js,ts,tsx src",
@@ -51,8 +56,15 @@
     "@types/react": "18.2.23",
     "@types/react-dom": "18.2.8",
     "@types/react-router-dom": "5.3.3",
+    "@typescript-eslint/eslint-plugin": "^7.13.0",
+    "@typescript-eslint/parser": "^7.13.0",
     "@vitejs/plugin-basic-ssl": "^1.0.1",
     "@vitejs/plugin-react": "4.1.0",
+    "@wdio/cli": "^8.33.1",
+    "@wdio/concise-reporter": "8.32.4",
+    "@wdio/local-runner": "^8.32.4",
+    "@wdio/mocha-framework": "^8.32.4",
+    "@wdio/spec-reporter": "^8.32.4",
     "autoprefixer": "10.4.16",
     "eslint": "8.50.0",
     "eslint-config-prettier": "9.0.0",
@@ -75,17 +87,12 @@
     "prettier": "3.0.3",
     "tailwindcss": "3.3.3",
     "ts-jest": "29.1.1",
+    "ts-node": "10.9.2",
     "typescript": "5.2.2",
     "vite": "4.4.9",
     "vite-plugin-node-polyfills": "0.14.1",
     "vite-plugin-svgr": "4.0.0",
-    "vite-tsconfig-paths": "4.2.1",
-    "@wdio/local-runner": "^8.32.4",
-    "@wdio/mocha-framework": "^8.32.4",
-    "@wdio/spec-reporter": "^8.32.4",
-    "@wdio/cli": "^8.33.1",
-    "ts-node": "10.9.2",
-    "@wdio/concise-reporter": "8.32.4"
+    "vite-tsconfig-paths": "4.2.1"
   },
   "resolutions": {
     "**/*/nth-check": "2.0.1"

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,5 +1,5 @@
 {
-  "name": "MultiversX dApp Template",
+  "name": "MultiversX Lite Wallet dApp",
   "short_name": "MultiversX dApp",
   "description": "Easily add or update assets for a Token or NFT Collection on the MultiversX Blockchain",
   "icons": [

diff --git a/public/site.webmanifest b/public/site.webmanifest
@@ -1,5 +1,5 @@
 {
-  "name": "MultiversX dApp Template",
+  "name": "MultiversX Lite Wallet dApp",
   "short_name": "MultiversX dApp",
   "icons": [
     {

diff --git a/src/App.tsx b/src/App.tsx
@@ -1,4 +1,5 @@
 import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
+import { PersistGate } from 'redux-persist/integration/react';
 
 import {
   AxiosInterceptorContext, // using this is optional
@@ -21,6 +22,8 @@ import { RouteNamesEnum } from 'localConstants';
 import { PageNotFound, Unlock } from 'pages';
 import { routes } from 'routes';
 import { BatchTransactionsContextProvider } from 'wrappers';
+import { Provider } from 'react-redux';
+import { persistor, store } from './redux/store';
 
 const AppContent = () => {
   return (
@@ -72,18 +75,30 @@ const AppContent = () => {
   );
 };
 
-export const App = () => {
+export const MainApp = () => {
   return (
     <AxiosInterceptorContext.Provider>
       <AxiosInterceptorContext.Interceptor
         authenticatedDomains={sampleAuthenticatedDomains}
       >
-        <Router>
-          <BatchTransactionsContextProvider>
-            <AppContent />
-          </BatchTransactionsContextProvider>
-        </Router>
+        <BatchTransactionsContextProvider>
+          <AppContent />
+        </BatchTransactionsContextProvider>
       </AxiosInterceptorContext.Interceptor>
     </AxiosInterceptorContext.Provider>
   );
 };
+
+export const ProviderApp = () => (
+  <Provider store={store}>
+    <PersistGate persistor={persistor} loading={null}>
+      <MainApp />
+    </PersistGate>
+  </Provider>
+);
+
+export const App = () => (
+  <Router>
+    <ProviderApp />
+  </Router>
+);
diff --git a/src/components/ContractAddress/ContractAddress.tsx b/src/components/ContractAddress/ContractAddress.tsx
diff --git a/src/components/ContractAddress/index.ts b/src/components/ContractAddress/index.ts
diff --git a/src/components/Copy/Copy.tsx b/src/components/Copy/Copy.tsx
@@ -0,0 +1,30 @@
+import { useState } from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faCheck, faCopy } from '@fortawesome/free-solid-svg-icons';
+
+export const Copy = ({
+  value,
+  className = ''
+}: {
+  value: string;
+  className?: string;
+}) => {
+  const [confirm, setConfirm] = useState(false);
+
+  const copy = () => {
+    navigator.clipboard.writeText(value);
+    setConfirm(true);
+    setTimeout(() => setConfirm(false), 2000);
+  };
+
+  return (
+    <span
+      className={`ml-0.5 inline-block cursor-pointer px-1 hover:text-white ${className} ${
+        confirm ? 'text-white' : 'text-gray-400'
+      }`}
+      onClick={copy}
+    >
+      <FontAwesomeIcon icon={confirm ? faCheck : faCopy} />
+    </span>
+  );
+};
diff --git a/src/components/Copy/index.tsx b/src/components/Copy/index.tsx
@@ -0,0 +1 @@
+export * from './Copy';
diff --git a/src/components/Layout/Footer/index.ts → src/components/Layout/Footer/index.tsx b/src/components/Layout/Footer/index.ts → src/components/Layout/Footer/index.tsx
diff --git a/src/components/Layout/Header/index.ts → src/components/Layout/Header/index.tsx b/src/components/Layout/Header/index.ts → src/components/Layout/Header/index.tsx
diff --git a/src/components/Layout/Layout.tsx b/src/components/Layout/Layout.tsx
@@ -1,6 +1,6 @@
 import type { PropsWithChildren } from 'react';
 import { useLocation } from 'react-router-dom';
-import { AuthenticatedRoutesWrapper } from 'components/sdkDappComponents';
+import { AuthenticatedRoutesWrapper } from 'components';
 import { RouteNamesEnum } from 'localConstants/routes';
 import { routes } from 'routes/routes';
 import { Footer } from './Footer';

diff --git a/src/components/OutputContainer/OutputContainer.tsx b/src/components/OutputContainer/OutputContainer.tsx
@@ -1,6 +1,6 @@
 import type { PropsWithChildren } from 'react';
 import classNames from 'classnames';
-import { Loader } from 'components/sdkDappComponents';
+import { Loader } from 'components';
 import { WithClassnameType } from 'types';
 
 interface OutputContainerPropsType

diff --git a/src/components/OutputContainer/components/PingPongOutput.tsx b/src/components/OutputContainer/components/PingPongOutput.tsx
diff --git a/src/components/OutputContainer/components/TransactionOutput.tsx b/src/components/OutputContainer/components/TransactionOutput.tsx
diff --git a/src/components/OutputContainer/components/TransactionsOutput.tsx b/src/components/OutputContainer/components/TransactionsOutput.tsx
diff --git a/src/components/OutputContainer/components/index.ts b/src/components/OutputContainer/components/index.ts
diff --git a/src/components/OutputContainer/index.ts b/src/components/OutputContainer/index.ts
@@ -1,2 +1 @@
 export * from './OutputContainer';
-export * from './components';
diff --git a/src/components/TransactionsTracker/TransactionsTracker.ts b/src/components/TransactionsTracker/TransactionsTracker.ts
@@ -1,5 +1,5 @@
 import { useTransactionsTracker } from '@multiversx/sdk-dapp/hooks/transactions/useTransactionsTracker';
-import { useBatchTransactionsTracker } from 'hooks/sdkDappHooks';
+import { useBatchTransactionsTracker } from 'hooks';
 
 export const TransactionsTracker = () => {
   useTransactionsTracker({

diff --git a/src/components/index.ts b/src/components/index.ts
@@ -1,10 +1,10 @@
-export * from './Layout';
-export * from './sdkDappComponents';
+export * from './Button';
 export * from './Card';
+export * from './Copy';
+export * from './Label';
+export * from './Layout';
+export * from './MissingNativeAuthError';
 export * from './MxLink';
-export * from './Button';
 export * from './OutputContainer';
 export * from './TransactionsTracker';
-export * from './ContractAddress';
-export * from './MissingNativeAuthError';
-export * from './Label';
+export * from './sdkDapp.components';
Original file line number	Diff line number	Diff line change
		@@ -1,2 +1 @@
		export * from './OutputContainer';
		export * from './components';