Improve truffle-box.json

.gitignore

@@ -1,2 +1,4 @@
 node_modules/
 build/
+.idea/
+.vscode/

README.md

@@ -14,7 +14,6 @@
   <img alt="Travis (.com)" src="https://img.shields.io/travis/com/rouftom/truffle-react-material">
   <img alt="GitHub release (latest by date)" src="https://img.shields.io/github/v/release/rouftom/truffle-react-material">
   <img alt="GitHub code size in bytes" src="https://img.shields.io/github/languages/code-size/rouftom/truffle-react-material">
-  <img alt="Snyk Vulnerabilities for GitHub Repo" src="https://img.shields.io/snyk/vulnerabilities/github/rouftom/truffle-react-material">
 </p>
 
 ---
@@ -102,8 +101,11 @@ First, create a new empty directory and go to it.
 
 ## Extra
 
-    😊 Do you like this box? Buy me a coffee
+    😊 Do you like this library ? Buy me a coffee or support me with a star on Github
 
-* Btc address: `1A2VNHSLGDyYsKWniJBe8cCqYWC52NvNZx`
+<a href="https://www.buymeacoffee.com/Lnp9rkM" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 40px !important;width: 180px !important;" ></a>
 
-* Eth address: `0xFe444a01D9494Ec04f61797e15193C8016D666A5`
+* Btc address: `bc1qettgagenn9nc8ks7ghntjfme96yvvkfhntk774`
+
+
+* Eth address: `0xB0413d8D0336E263e289A915c383e152155881E0`

client/src/ui/Home.jsx

@@ -8,32 +8,26 @@ import {
   ThemeProvider, Stack
 } from "@mui/material";
 import {AppTheme} from "../lib/theme";
-import {Web3Context} from "../lib/Web3Context";
 import {MyContractContext} from "../lib/MyContractContext";
 
 const Home = (props) => {
-  const web3Context = useContext(Web3Context);
   const MyContract = useContext(MyContractContext);
 
   const handleAction = () => {
     // Do some actions here...
   };
 
   useEffect(() => {
-    try {
-      MyContract
-        .deployed()
-        .then(async function(instance) {
-          // Do something with instance...
-          // Get accounts
-          //const accounts = await web3Context.eth.getAccounts();
-        });
-    } catch (e) {
+    MyContract
+      .deployed()
+      .then(async function(instance) {
+        // Do something with instance...
+      }).catch(e => {
       console.error(e);
       alert(
         `Failed to load web3, accounts, or contract. Check console for details.`
       );
-    }
+    });
   },)
 
   return (

client/src/ui/HomeAppBarLayout.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useContext, useEffect, useMemo, useCallback } from "react";
+import React, { useState, useContext, useEffect, useCallback } from "react";
 import { AppTheme } from "../lib/theme";
 import {Web3Context} from "../lib/Web3Context";
 import AccountCircle from "@mui/icons-material/AccountCircle";
@@ -23,6 +23,7 @@ function HomeAppBarLayout(props) {
   const [anchorEl, setAanchorEl] = useState(null);
   const [mobileMoreAnchorEl, setMobileMoreAnchorEl] = useState(null);
 
+  // eslint-disable-next-line
   const initConfig = useCallback(() => {
     web3Context.eth.getCoinbase((error, coinbaseAddress) => {
       if (error) {
@@ -32,7 +33,7 @@ function HomeAppBarLayout(props) {
         setAccount(coinbaseAddress);
       }
     })
-  });
+  }, [account, web3Context.eth]);
 
   useEffect(() => {
     setTimeout(() => {

truffle-box.json

@@ -1,10 +1,6 @@
 {
   "ignore": [
-		"README.md",
-		".gitignore",
-		"box-img-lg.png",
-		"box-img-sm.png",
-		".github"
+		"README.md", ".gitignore", "box-img-lg.png", "box-img-sm.png", ".github"
   ],
 	"commands": {
 		"Compile": "truffle compile --contracts_build_directory=./client/src/build",
@@ -15,6 +11,6 @@
 		"Build for production": "cd client && npm run build"
 	},
 	"hooks": {
-		"post-unpack": "cd client && npm ci"
+		"post-unpack": "cd client && npm ci --legacy-deps"
 	}
 }