Merge pull request #398 from provenance-io/vm/390/update-governance-e…

…ndpoints Vm/390/update governance endpoints
provenance-io · Oct 31, 2022 · b0a462a · b0a462a
2 parents 7805fbc + bfc8093
commit b0a462a
Show file tree

Hide file tree

Showing 53 changed files with 3,061 additions and 2,808 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,7 @@
 ### Bugs
 
 ### Features
+- Update governance to use new endpoints #390
 
 ## 3.3.1
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,7 +11,8 @@
   "private": false,
   "sideEffects": false,
   "dependencies": {
-    "@provenanceio/wallet-lib": "2.4.3",
+    "@provenanceio/wallet-utils": "2.0.0",
+    "@provenanceio/walletconnect-js": "1.2.9",
     "@reduxjs/toolkit": "1.8.1",
     "axios": "0.21.2",
     "bech32": "2.0.0",
@@ -53,6 +54,7 @@
     "@testing-library/react-hooks": "7.0.1",
     "@testing-library/user-event": "13.1.9",
     "@types/big.js": "6.1.3",
+    "@types/create-hash": "1.2.2",
     "@types/jest": "24.9.1",
     "@types/node": "12.20.43",
     "@types/react": "16.14.23",
@@ -61,6 +63,7 @@
     "@types/react-redux": "7.1.22",
     "@types/react-router-dom": "5.3.3",
     "@types/redux-actions": "2.6.2",
+    "@types/secp256k1": "4.0.3",
     "@types/styled-components": "5.1.22",
     "@typescript-eslint/eslint-plugin": "4.28.2",
     "@typescript-eslint/parser": "4.28.2",

diff --git a/src/App.js b/src/App.js
@@ -1,8 +1,8 @@
 import React, { useEffect } from 'react';
 import { ThemeProvider } from 'styled-components';
 import { BrowserRouter, Route, Switch, Redirect } from 'react-router-dom';
-import { WalletContextProvider } from '@provenanceio/wallet-lib';
-import { useApp, useAssets, useColorScheme } from 'redux/hooks';
+import { useWalletConnect } from '@provenanceio/walletconnect-js';
+import { useAssets, useColorScheme, useApp } from 'redux/hooks';
 import { Navigation, Footer, SpriteSheet, BaseStyle } from 'Components';
 import { GlobalStyle } from 'theme';
 import { isProd } from 'consts';
@@ -39,9 +39,13 @@ import {
 } from 'Pages';
 
 const App = () => {
-  const { walletUrl } = useApp();
+  const {
+    walletConnectState: { signedJWT },
+  } = useWalletConnect();
   const { activeTheme } = useColorScheme();
 
+  const { setAuthToken } = useApp();
+
   const { assetMetadata, assetMetadataLoading, getAssetMetadata, assetMetadataFailed } =
     useAssets();
 
@@ -51,51 +55,55 @@ const App = () => {
     }
   }, [assetMetadata, assetMetadataLoading, getAssetMetadata, assetMetadataFailed]);
 
+  useEffect(() => {
+    if (signedJWT) {
+      setAuthToken(signedJWT);
+    }
+  }, [setAuthToken, signedJWT]);
+
   return (
     <BrowserRouter basename={process.env.PUBLIC_URL || ''}>
-      <WalletContextProvider walletUrl={walletUrl}>
-        <GlobalStyle theme={activeTheme} />
-        <SpriteSheet />
-        <ThemeProvider theme={activeTheme}>
-          <BaseStyle>
-            <Navigation />
-            <Switch>
-              <Route exact path="/">
-                <Redirect to="/dashboard" />
-              </Route>
-              <Route path="/accounts/:addressId" component={Accounts} />
-              <Route path="/announcement/:announcementId" component={Announcement} />
-              <Route path="/announcements" component={Announcements} />
-              <Route path="/asset/:assetId" component={Asset} />
-              <Route path="/assets" component={Assets} />
-              <Route path="/blocks" component={Blocks} />
-              <Route path="/block/:blockHeight" component={Block} />
-              <Route path="/code/:codeId" component={Code} />
-              <Route path="/contract/:contractId" component={Contract} />
-              <Route path="/contracts" component={Contracts} />
-              <Route exact path="/dashboard" component={Dashboard} />
-              <Route path="/faucet">{isProd ? <Redirect to="/dashboard" /> : <Faucet />}</Route>
-              <Route path="/ibc" component={Ibc} />
-              <Route path="/icons">{isProd ? <Redirect to="/dashboard" /> : <Icons />}</Route>
-              <Route path="/network/name-tree" component={NameTree}></Route>
-              <Route path="/nft/:addr" component={Nft} />
-              <Route path="/nfts/:addr" component={Nfts} />
-              <Route path="/proposal/:proposalId" component={Proposal} />
-              <Route path="/proposals" component={Proposals} />
-              <Route path="/network/token-stats" component={TokenStats} />
-              <Route path="/network/gas" component={Gas} />
-              <Route path="/network/upgrades" component={Upgrades} />
-              <Route path="/network/params" component={Params} />
-              <Route path="/tx/:txHash/:block?" component={Tx} />
-              <Route path="/txs" component={Txs} />
-              <Route path="/validator/:validatorId" component={Validator} />
-              <Route path="/validators" component={Validators} />
-              <Route component={NoMatch404} />
-            </Switch>
-            <Footer />
-          </BaseStyle>
-        </ThemeProvider>
-      </WalletContextProvider>
+      <GlobalStyle theme={activeTheme} />
+      <SpriteSheet />
+      <ThemeProvider theme={activeTheme}>
+        <BaseStyle>
+          <Navigation />
+          <Switch>
+            <Route exact path="/">
+              <Redirect to="/dashboard" />
+            </Route>
+            <Route path="/accounts/:addressId" component={Accounts} />
+            <Route path="/announcement/:announcementId" component={Announcement} />
+            <Route path="/announcements" component={Announcements} />
+            <Route path="/asset/:assetId" component={Asset} />
+            <Route path="/assets" component={Assets} />
+            <Route path="/blocks" component={Blocks} />
+            <Route path="/block/:blockHeight" component={Block} />
+            <Route path="/code/:codeId" component={Code} />
+            <Route path="/contract/:contractId" component={Contract} />
+            <Route path="/contracts" component={Contracts} />
+            <Route exact path="/dashboard" component={Dashboard} />
+            <Route path="/faucet">{isProd ? <Redirect to="/dashboard" /> : <Faucet />}</Route>
+            <Route path="/ibc" component={Ibc} />
+            <Route path="/icons">{isProd ? <Redirect to="/dashboard" /> : <Icons />}</Route>
+            <Route path="/network/name-tree" component={NameTree}></Route>
+            <Route path="/nft/:addr" component={Nft} />
+            <Route path="/nfts/:addr" component={Nfts} />
+            <Route path="/proposal/:proposalId" component={Proposal} />
+            <Route path="/proposals" component={Proposals} />
+            <Route path="/network/token-stats" component={TokenStats} />
+            <Route path="/network/gas" component={Gas} />
+            <Route path="/network/upgrades" component={Upgrades} />
+            <Route path="/network/params" component={Params} />
+            <Route path="/tx/:txHash" component={Tx} />
+            <Route path="/txs" component={Txs} />
+            <Route path="/validator/:validatorId" component={Validator} />
+            <Route path="/validators" component={Validators} />
+            <Route component={NoMatch404} />
+          </Switch>
+          <Footer />
+        </BaseStyle>
+      </ThemeProvider>
     </BrowserRouter>
   );
 };

diff --git a/src/Components/Button/Button.tsx b/src/Components/Button/Button.tsx
@@ -9,10 +9,10 @@ interface ButtonProps {
   iconSize?: string;
   iconColor?: string;
   iconOptions?: object; // see Components/Sprite for available options
-  onClick?: () => void;
+  onClick?: (arg?: any) => void;
   children: React.ReactNode;
   disabled?: boolean;
-  type?: "button" | "submit" | "reset" | undefined;
+  type?: 'button' | 'submit' | 'reset' | undefined;
 }
 
 const StyledButton = styled.button<ButtonProps>`
@@ -58,7 +58,7 @@ const Button = ({
   iconSize = '2.2rem',
   iconColor = 'ICON_WHITE',
   iconOptions,
-  onClick = () => {},
+  onClick = (arg?: any) => {},
   children,
   disabled = false,
   type,
@@ -67,7 +67,7 @@ const Button = ({
     className={className}
     onClick={onClick}
     color={color.toUpperCase()}
-    onKeyPress={e => {
+    onKeyPress={(e) => {
       if (e.key === 'Enter') {
         onClick();
       }
@@ -84,5 +84,4 @@ const Button = ({
   </StyledButton>
 );
 
-
 export default Button;
diff --git a/src/Components/DropdownBtn/DropdownBtn.js b/src/Components/DropdownBtn/DropdownBtn.js
@@ -79,7 +79,7 @@ const ListItem = styled.li`
   }
 `;
 
-const DropdownBtn = ({ className, color, initial, onClick, options }) => {
+const DropdownBtn = ({ className, color, initial, onClick, options, type }) => {
   const $color = color.toUpperCase();
   const [showDropdown, toggleDropdown, , deactivateDropdown] = useToggle();
   const containerRef = useOnClickOutside(deactivateDropdown);
@@ -105,10 +105,10 @@ const DropdownBtn = ({ className, color, initial, onClick, options }) => {
   return (
     <Container className={className} ref={containerRef}>
       <ButtonGroup>
-        <Button color={color} onClick={handleAction}>
+        <Button color={color} onClick={handleAction} type={type}>
           {initial}
         </Button>
-        <SelectArrow $color={$color} onClick={toggleDropdown}>
+        <SelectArrow $color={$color} onClick={toggleDropdown} type={type}>
           <Sprite icon="CARET" size="0.9rem" color={theme[`BUTTON_${$color}_FONT`]} />
         </SelectArrow>
       </ButtonGroup>
@@ -129,6 +129,7 @@ DropdownBtn.propTypes = {
   initial: PropTypes.string.isRequired,
   onClick: PropTypes.func.isRequired,
   options: PropTypes.array.isRequired,
+  type: PropTypes.string,
 };
 
 DropdownBtn.defaultProps = {