test: cross chain vote selection (#394)

* test: cross chain vote selection * ref: handle loading state for stateForNetwork * feat: * * feat: improved my votes page * feat: testnet deployment snax chain * feat: snapshot contract update * feat: QA * fix: table * feat: implemented multicall * fix: nominate self mutation * feat: ui fixes * test: fix test * ref: provider url * ref: multicall hook * feat: added chain icon * ref: added return statement * feat: modal prevent leaving without saving * feat: added longpress behaviour to my votes card * feat: added long press button * feat: open vote card when user selects candidate * fix: table * feat: rounded table * feat: updated ci, contracts and abis * ci: implemented new testnet * feat: fix voting * ref: fixing deps * feat: added release governance workflow * fix: reverted gov workflow
Synthetixio · Aug 21, 2024 · 9153540 · 9153540
1 parent b16d56f
commit 9153540
Show file tree

Hide file tree

Showing 68 changed files with 1,369 additions and 968 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -141,7 +141,7 @@ jobs:
 
       - run:
           name: Run anvil localhost:8545
-          command: 'anvil --fork-url https://optimism-sepolia.infura.io/v3/$INFURA_KEY --fork-block-number 15053625'
+          command: 'anvil --fork-url https://testnet.snaxchain.io'
           background: true
 
       - run:
@@ -308,7 +308,7 @@ workflows:
       - tests
       - liquidity-cy
       - governance-e2e:
-          name: governance-e2e-op-sepolia
+          name: governance-e2e-snax-testnet
       - liquidity-e2e:
           name: liquidity-e2e-base-mainnet
           chainId: 8453
@@ -323,7 +323,7 @@ workflows:
           requires: [
               tests,
               liquidity-cy,
-              governance-e2e-op-sepolia,
+              governance-e2e-snax-testnet,
               liquidity-e2e-base-mainnet,
               #liquidity-e2e-sepolia,
             ]

diff --git a/governance/cypress/cypress/e2e/Councils - Administration.e2e.js b/governance/cypress/cypress/e2e/Councils - Administration.e2e.js
@@ -1,5 +1,7 @@
 it('Councils - Administration', () => {
   cy.task('changePeriod', { council: 'spartan', period: 'admin' });
+  cy.task('changePeriod', { council: 'ambassador', period: 'admin' });
+  cy.task('changePeriod', { council: 'treasury', period: 'admin' });
   cy.task('mineBlock');
   cy.connectWallet();
   cy.viewport(1300, 900);
@@ -13,10 +15,11 @@ it('Councils - Administration', () => {
   cy.get('[data-cy="council-tab-vote-circle"]').should('not.exist');
   cy.get('[data-cy="view-council-button-spartan"]').click();
   cy.get('[data-cy="election-closed-tag"]').should('exist');
+  cy.get('[data-cy="council-image-council-tabs-spartan"]').should('have.css', 'width', '28px');
   cy.get('[data-cy="user-action-box-unselected"]')
     .should('have.css', 'top', '105px')
     .and('have.css', 'position', 'sticky');
-  cy.get('[data-cy="council-image-council-tabs-spartan"]')
+  cy.get('[data-cy="council-image-council-tabs-spartan-circle"]')
     .should('have.css', 'width', '40px')
     .and('have.css', 'height', '40px');
   cy.get('[data-cy="council-information-spartan"]').should('have.css', 'gap', '8px');
@@ -38,5 +41,8 @@ it('Councils - Administration', () => {
   cy.get('[data-cy="sort-arrow-down"]').should('exist');
   cy.viewport(600, 500);
   cy.visit('#/councils');
-  cy.get('[data-cy="my-votes-summary-text"]').should('have.css', 'font-size', '14px');
+  cy.get('[data-cy="my-votes-summary-text"]').should('have.css', 'font-size', '12px');
+  cy.get('[data-cy="council-select-mobile"]').should('have.css', 'font-size', '16px');
+  cy.get('[data-cy="menu-button-flex-council-select"]').should('have.css', 'height', '48px');
+  cy.get('[data-cy="my-votes-button"]').should('have.css', 'height', '48px');
 });
diff --git a/governance/cypress/cypress/e2e/Councils - Nomination.e2e.js b/governance/cypress/cypress/e2e/Councils - Nomination.e2e.js
@@ -1,5 +1,7 @@
 it('Councils - Administration', () => {
   cy.task('changePeriod', { council: 'spartan', period: 'nomination' });
+  cy.task('changePeriod', { council: 'ambassador', period: 'nomination' });
+  cy.task('changePeriod', { council: 'treasury', period: 'nomination' });
   cy.task('mineBlock');
   cy.connectWallet();
   cy.viewport(1300, 900);
@@ -33,6 +35,9 @@ it('Councils - Administration', () => {
   );
   cy.get('[data-cy="council-nomination-select-spartan"]').click();
   cy.get('[data-cy="nominate-self-cast-nomination-button"]').click();
+  cy.get('[data-cy="nominate-self-modal"]')
+    .should('have.css', 'top', '105px')
+    .and('have.css', 'position', 'sticky');
   cy.get('[data-cy="nominate-self-done-button"]').click();
   cy.get('[data-cy="empty-state-user-action-box"]').contains(
     'Click on a nominee to see their profile details'
@@ -46,11 +51,13 @@ it('Councils - Administration', () => {
   cy.get('[data-cy="nominate-self-button-user-profile-details"]').click();
   cy.get('[data-cy="withdraw-vote-select"]').click();
   cy.get('[data-cy="edit-nomination-button"]').click();
+  cy.get('[data-cy="edit-nomination"]').should('have.css', 'height', '612px');
   cy.get('[data-cy="confirm-edit-nomination-button"]').click();
   cy.get('[data-cy="empty-state-user-action-box"]').contains(
     'Click on a nominee to see their profile details'
   );
   cy.get('[data-cy="user-table-view-button-0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266"]').should(
     'not.exist'
   );
+  cy.get('[data-cy="user-list-item-button-nomination"]').should('not.exist');
 });
diff --git a/governance/cypress/cypress/e2e/Councils - Voting.e2e.js b/governance/cypress/cypress/e2e/Councils - Voting.e2e.js
@@ -1,7 +1,9 @@
 it('Councils - Administration', () => {
-  cy.task('changePeriod', { council: 'spartan', period: 'admin' });
   cy.task('prepareVotingPower', { council: 'spartan' });
-  // cy.task('changePeriod', { council: 'spartan', period: 'voting' });
+  cy.task('mineBlock');
+  cy.task('prepareVotingPower', { council: 'ambassador' });
+  cy.task('mineBlock');
+  cy.task('prepareVotingPower', { council: 'treasury' });
   cy.task('mineBlock');
   cy.connectWallet();
   cy.viewport(1300, 900);
@@ -10,7 +12,7 @@ it('Councils - Administration', () => {
   cy.get('[data-cy="council-period-badge"]').contains('Voting Open');
   cy.get('[data-cy="account-menu-button"]').click();
   cy.get('[data-cy="network-controller-switch"]').click();
-  cy.get('[data-cy="network-menu-button-11155420"]').click();
+  cy.get('[data-cy="network-menu-button-13001"]').click();
   cy.get('[data-cy="council-tab-vote-circle"]').should('not.exist');
   cy.get('[data-cy="vote-council-button-spartan"]').click();
   cy.get('[data-cy="period-countdown"]').should('exist');
@@ -39,7 +41,7 @@ it('Councils - Administration', () => {
     '[data-cy="user-blockies-council-tabs-0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266"]'
   ).should('exist');
   cy.wait(3000);
-  cy.get('[data-cy="my-votes-voting-power"]').contains('100.00');
+  cy.get('[data-cy="my-votes-voting-power"]').contains('30.00');
   cy.get('[data-cy="cast-my-vote-button"]').click();
   cy.wait(3000);
   cy.window().then((win) => {
@@ -50,8 +52,8 @@ it('Councils - Administration', () => {
     '[data-cy="user-blockies-council-tabs-0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266"]'
   ).should('exist');
   cy.wait(3000);
-  cy.get('[data-cy="remove-vote-button"]').click();
+  cy.get('[data-cy="remove-vote-button-spartan"]').click();
   cy.get('[data-cy="cast-my-vote-button"]').click();
   cy.wait(3000);
-  cy.get('[data-cy="council-tab-vote-circle"]').should('exist');
+  cy.get('[data-cy="my-votes-total-votes"]').contains('0/3');
 });
diff --git a/governance/cypress/cypress/support/e2e.js b/governance/cypress/cypress/support/e2e.js
@@ -1,11 +1,8 @@
 import '@cypress/code-coverage/support';
-import { onLogAdded } from '@snx-cy/onLogAdded';
 import { ethers } from 'ethers';
 import { metamask } from '../lib/metamask';
 
 beforeEach(() => {
-  cy.on('log:added', onLogAdded);
-
   cy.intercept('https://analytics.synthetix.io/matomo.js', { statusCode: 204 }).as('matomo');
 
   [

diff --git a/governance/cypress/cypress/tasks/prepareVotingPower.js b/governance/cypress/cypress/tasks/prepareVotingPower.js
@@ -8,8 +8,6 @@ export async function prepareVotingPower({ council }) {
     '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80',
     provider
   );
-  // already done with current fork
-  // await proxy.connect(signer).setSnapshotContract(SnapshotRecordContract(11155420)?.address, true);
   const block = await provider.getBlock('latest');
   await proxy
     .connect(signer)
@@ -20,12 +18,16 @@ export async function prepareVotingPower({ council }) {
       block.timestamp,
       block.timestamp + 10000
     );
-  // already done with current fork
-  // const id = await proxy
-  //   .connect(signer)
-  //   .takeVotePowerSnapshot(SnapshotRecordContract(11155420)?.address);
-  // console.log('ID', id);
-  SnapshotRecordContract(11155420)
+
+  // let id = '';
+  // try {
+  //   id = await proxy
+  //     .connect(signer)
+  //     .takeVotePowerSnapshot(SnapshotRecordContract(2192, council)?.address);
+  // } catch (error) {
+  //   console.info('takeVotePowerSnapshot failed');
+  // }
+  await SnapshotRecordContract(13001, council)
     .connect(signer)
     .setBalanceOfOnPeriod(await signer.getAddress(), 100, 1);
   return null;

diff --git a/governance/cypress/package.json b/governance/cypress/package.json
@@ -4,13 +4,12 @@
   "main": "index.ts",
   "version": "0.0.1",
   "scripts": {
-    "anvil:op-sepolia": "anvil --fork-url https://optimism-sepolia.infura.io/v3/$INFURA_KEY --fork-block-number 15053625",
+    "anvil:snax": "anvil --fork-url https://testnet.snaxchain.io --fork-block-number 296528",
     "e2e": "cypress open --e2e --browser chrome"
   },
   "devDependencies": {
     "@chakra-ui/react": "^2.8.2",
     "@cypress/code-coverage": "^3.12.39",
-    "@snx-cy/onLogAdded": "workspace:*",
     "@snx-cy/printBrowserLogs": "workspace:*",
     "@synthetixio/v3-theme": "workspace:*",
     "cypress": "13.11.0",

diff --git a/governance/subgraph/tests/election-module.test.ts b/governance/subgraph/tests/election-module.test.ts
@@ -5,7 +5,6 @@ import {
   clearStore,
   beforeAll,
   afterAll,
-  logStore,
 } from 'matchstick-as/assembly/index';
 import { Address, BigInt, Bytes } from '@graphprotocol/graph-ts';
 import {

diff --git a/governance/ui/.env.example b/governance/ui/.env.example
@@ -1,6 +1,8 @@
 INFURA_KEY=xxx
 WC_PROJECT_ID=xxx
 BOARDROOM_KEY=xxx
-DEV=true
-DEV_RPC_MOTHERSHIP=http://127.0.0.1:19000/
+DEV=false
+DEV_RPC_MOTHERSHIP=http://127.0.0.1:19000
 TESTNET=false
+CI=true
+CI_RPC_MOTHERSHIP=http://127.0.0.1:8545
diff --git a/governance/ui/src/components/CouncilCard/CouncilCard.tsx b/governance/ui/src/components/CouncilCard/CouncilCard.tsx
@@ -95,7 +95,7 @@ export function CouncilCard({ council }: CouncilCardProps) {
             <Skeleton isLoaded={!isLoading} height="24px" mt={1} placeholder="0000">
               <Fade in>
                 <Text fontSize="24px" lineHeight="32px" fontWeight={700} textAlign="end">
-                  0000
+                  TODO
                 </Text>
               </Fade>
             </Skeleton>

diff --git a/governance/ui/src/components/CouncilImage/CouncilImage.tsx b/governance/ui/src/components/CouncilImage/CouncilImage.tsx
@@ -3,9 +3,10 @@ import { FlexProps, Flex, Image, ImageProps } from '@chakra-ui/react';
 interface CouncilImageProps extends FlexProps {
   imageUrl: string;
   imageProps?: ImageProps;
+  dataCy?: string;
 }
 
-export const CouncilImage = ({ imageUrl, imageProps, ...props }: CouncilImageProps) => {
+export const CouncilImage = ({ imageUrl, imageProps, dataCy, ...props }: CouncilImageProps) => {
   return (
     <Flex
       borderRadius="50%"
@@ -18,9 +19,10 @@ export const CouncilImage = ({ imageUrl, imageProps, ...props }: CouncilImagePro
       alignItems="center"
       mr="3"
       bg="navy.700"
+      data-cy={dataCy?.concat('-circle')}
       {...props}
     >
-      <Image src={imageUrl} w="6" h="6" {...imageProps} />
+      <Image src={imageUrl} w="6" h="6" data-cy={dataCy} {...imageProps} />
     </Flex>
   );
 };
diff --git a/governance/ui/src/components/CouncilInformation/CouncilInformation.tsx b/governance/ui/src/components/CouncilInformation/CouncilInformation.tsx
@@ -1,16 +1,20 @@
-import { Flex, Heading, Text } from '@chakra-ui/react';
+import { Flex, Heading, Icon, Text } from '@chakra-ui/react';
 import councils, { CouncilSlugs } from '../../utils/councils';
 import { useGetCouncilMembers } from '../../queries/useGetCouncilMembers';
 import { CouncilImage } from '../CouncilImage';
-import { ExternalLinkIcon } from '@chakra-ui/icons';
 import { Link } from 'react-router-dom';
 
 export default function CouncilInformation({ activeCouncil }: { activeCouncil: CouncilSlugs }) {
   const { data: getCouncilMembers } = useGetCouncilMembers(activeCouncil);
   const council = councils.find((council) => council.slug === activeCouncil);
 
   return (
-    <Flex py="5" maxW="735px" w="100%" flexDirection={{ base: 'column', md: 'row' }}>
+    <Flex
+      py="5"
+      maxW={{ base: '100%', xl: '735px' }}
+      w="100%"
+      flexDirection={{ base: 'column', md: 'row' }}
+    >
       <Flex>
         <CouncilImage
           imageUrl={council?.image || ''}
@@ -28,13 +32,7 @@ export default function CouncilInformation({ activeCouncil }: { activeCouncil: C
         <Heading fontSize="lg" mb="2">
           {council?.title}
         </Heading>
-        <Text
-          w={{ base: '100%', md: '581px' }}
-          fontSize="14px"
-          lineHeight="20px"
-          fontFamily="heading"
-          color="gray.500"
-        >
+        <Text w="100%" fontSize="14px" lineHeight="20px" fontFamily="heading" color="gray.500">
           {council?.description}
         </Text>
         <Flex w="100%" mt="2" gap="2" data-cy={`council-information-${activeCouncil}`}>
@@ -60,7 +58,7 @@ export default function CouncilInformation({ activeCouncil }: { activeCouncil: C
           >
             Stipends: {council?.stipends}/month
           </Heading>
-          <Link to={council!.docLink} target="_blank" rel="noopener noreferrer">
+          <Link to={council?.docLink || ''} target="_blank" rel="noopener noreferrer">
             <Heading
               fontSize="xs"
               lineHeight="1rem"
@@ -71,7 +69,20 @@ export default function CouncilInformation({ activeCouncil }: { activeCouncil: C
               py="1"
               cursor="pointer"
             >
-              Learn more <ExternalLinkIcon />
+              Learn more{' '}
+              <Icon width="12px" height="12px" viewBox="0 0 12 12" fill="none">
+                <g clipPath="url(#clip0_7624_75578)">
+                  <path
+                    d="M7.78233 3.83246L3.98941 3.83246L3.98941 2.83261L9.48928 2.83262L9.48929 8.33249L8.48944 8.33249L8.48944 4.53957L3.52888 9.70711L2.82178 9L7.78233 3.83246Z"
+                    fill="white"
+                  />
+                </g>
+                <defs>
+                  <clipPath id="clip0_7624_75578">
+                    <rect width="12" height="12" fill="white" />
+                  </clipPath>
+                </defs>
+              </Icon>
             </Heading>
           </Link>
         </Flex>