Skip to content

Commit 33b5270

Browse files
alcercualcercu
authored
Merge branch 'dev' into fix(web)/router-fix
2 parents 61f653f + 0919bd1 commit 33b5270

File tree

19 files changed

+444
-56
lines changed

19 files changed

+444
-56
lines changed

‎.github/workflows/deploy-bots.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ jobs:
1313
egress-policy: audit # TODO: change to 'egress-policy: block' after couple of runs
1414

1515
- uses: actions/checkout@ac593985615ec2ede58e132d2e21d2b1cbd6127c
16-
- uses: actions/setup-python@57ded4d7d5e986d7296eab16560982c6dd7c923b
16+
- uses: actions/setup-python@bd6b4b6205c4dbad673328db7b31b7fab9e241c0
1717
- uses: aws-actions/setup-sam@2993f015a7af30461b7641a256042fe0c6fc0c2e
1818
- uses: aws-actions/configure-aws-credentials@67fbcbb121271f7775d2e7715933280b06314838
1919
with:

‎.github/workflows/deploy-subgraph.yml

+48
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
name: Deploy the Subgraph
2+
3+
on:
4+
workflow_dispatch:
5+
inputs:
6+
network:
7+
description: The network to deploy the subgraph to
8+
required: true
9+
default: 'arbitrum-goerli'
10+
type: choice
11+
options:
12+
- arbitrum-goerli
13+
- arbitrum
14+
15+
permissions:
16+
contents: read
17+
18+
jobs:
19+
buildAndDeploy:
20+
runs-on: ubuntu-latest
21+
environment: kleros-org-subgraph
22+
steps:
23+
- name: Harden Runner
24+
uses: step-security/harden-runner@128a63446a954579617e875aaab7d2978154e969 # v2.4.0
25+
with:
26+
egress-policy: audit
27+
28+
- name: Checkout code
29+
uses: actions/checkout@ee0669bd1cc54295c223e0bb666b733df41de1c5 # v2.7.0
30+
31+
- name: Set up Node.js
32+
uses: actions/setup-node@7c12f8017d5436eb855f1ed4399f037a36fbd9e8 # v2.5.2
33+
with:
34+
node-version: 16
35+
36+
- name: Install the dependencies
37+
run: yarn install
38+
39+
- name: Build the subgraph
40+
run: |
41+
yarn codegen
42+
yarn build
43+
44+
- name: Authenticate with TheGraph
45+
run: yarn graph auth "${{ secrets.SUBGRAPH_AUTH_TOKEN }}" --product hosted-service
46+
47+
- name: Deploy the subgraph
48+
run: yarn deploy:${{ inputs.network }}

‎.github/workflows/scorecards.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,6 @@ jobs:
8484

8585
# Upload the results to GitHub's code scanning dashboard.
8686
- name: "Upload to code-scanning"
87-
uses: github/codeql-action/upload-sarif@29b1f65c5e92e24fe6b6647da1eaabe529cec70f # v2.1.27
87+
uses: github/codeql-action/upload-sarif@83f0fe6c4988d98a455712a27f0255212bba9bd4 # v2.1.27
8888
with:
8989
sarif_file: results.sarif

‎subgraph/README.md

+17-4
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@
1010
## Build
1111

1212
```bash
13-
$ yarn
13+
# update subgraph.yml using the contract deployment artifacts
14+
$ yarn update:arbitrum-goerli
1415

1516
$ yarn codegen
1617

@@ -19,16 +20,28 @@ $ yarn build
1920

2021
## Deployment to The Graph (hosted service)
2122

22-
### Authentication
23+
### Using a personal account for development
24+
25+
#### Authentication
2326

2427
Get an API key from the thegraph.com, then authenticate.
2528

2629
```bash
2730
$ yarn run graph auth --product hosted-service
2831
```
2932

30-
### Deployment
33+
#### Deployment
3134

3235
```bash
33-
yarn deploy
36+
yarn deploy:arbitrum-goerli
3437
```
38+
39+
### Using the Kleros organization account
40+
Go to the [Deploy Subgraph Action](https://github.com/kleros/kleros-v2/actions/workflows/deploy-subgraph.yml) and click the Run workflow button:
41+
42+
<img width="1265" alt="image" src="https://github.com/kleros/kleros-v2/assets/22213980/da39f584-baaf-42a2-8c6a-6544aee29420">
43+
44+
Pick the appropriate network. There should be a corresponding yarn script in the form of `deploy:<network>` on the master branch.
45+
46+
Then reach out to a maintainer and request his approval.
47+
<img width="1265" alt="image" src="https://github.com/kleros/gtcr-subgraph/assets/22213980/3cea54fb-8382-42c4-a44a-37b4bfbeecee">

‎subgraph/package.json

+4-2
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,12 @@
22
"name": "@kleros/kleros-v2-subgraph",
33
"license": "MIT",
44
"scripts": {
5-
"update": "./scripts/update.sh",
5+
"update:arbitrum-goerli": "./scripts/update.sh arbitrumGoerli arbitrum-goerli",
6+
"update:arbitrum": "./scripts/update.sh arbitrum arbitrum",
67
"codegen": "graph codegen",
78
"build": "graph build",
8-
"deploy": "graph deploy --product hosted-service kleros/kleros-v2-core-arbitrum-goerli",
9+
"deploy:arbitrum-goerli": "graph deploy --product hosted-service kleros/kleros-v2-core-arbitrum-goerli",
10+
"deploy:arbitrum": "graph deploy --product hosted-service kleros/kleros-v2-core-arbitrum",
911
"create-local": "graph create --node http://localhost:8020/ kleros/kleros-v2-core-local",
1012
"remove-local": "graph remove --node http://localhost:8020/ kleros/kleros-v2-core-local",
1113
"deploy-local": "graph deploy --node http://localhost:8020/ --ipfs http://localhost:5001 kleros/kleros-v2-core-local --version-label v$(date +%s)",

‎web/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@
7272
"react-chartjs-2": "^4.3.1",
7373
"react-dom": "^18.2.0",
7474
"react-error-boundary": "^3.1.4",
75+
"react-identicons": "^1.2.5",
7576
"react-is": "^18.2.0",
7677
"react-jazzicon": "^1.0.4",
7778
"react-loading-skeleton": "^3.2.0",

‎web/src/components/ConnectButton.tsx

+15-10
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,26 @@ import { useConnect } from "hooks/useConnect";
77
import { SUPPORTED_CHAINS } from "consts/chains";
88

99
const AccountDisplay: React.FC = () => {
10-
const { account, chainId } = useWeb3();
11-
const chainName = chainId ? SUPPORTED_CHAINS[chainId].chainName : undefined;
12-
const shortAddress = account ? shortenAddress(account) : undefined;
1310
return (
1411
<StyledContainer>
15-
<small>{chainName}</small>
16-
<label>{shortAddress}</label>
12+
<ChainDisplay />
13+
<AddressDisplay />
1714
</StyledContainer>
1815
);
1916
};
2017

18+
export const ChainDisplay: React.FC = () => {
19+
const { chainId } = useWeb3();
20+
const chainName = chainId ? SUPPORTED_CHAINS[chainId].chainName : undefined;
21+
return <small>{chainName}</small>;
22+
};
23+
24+
export const AddressDisplay: React.FC = () => {
25+
const { account } = useWeb3();
26+
const shortAddress = account ? shortenAddress(account) : undefined;
27+
return <label>{shortAddress}</label>;
28+
};
29+
2130
const StyledContainer = styled.div`
2231
width: fit-content;
2332
height: 34px;
@@ -42,11 +51,7 @@ const StyledContainer = styled.div`
4251
const ConnectButton: React.FC = () => {
4352
const { active } = useWeb3();
4453
const { activate, connecting } = useConnect();
45-
return active ? (
46-
<AccountDisplay />
47-
) : (
48-
<Button disabled={connecting} small text={"Connect"} onClick={activate} />
49-
);
54+
return active ? <AccountDisplay /> : <Button disabled={connecting} small text={"Connect"} onClick={activate} />;
5055
};
5156

5257
export default ConnectButton;

‎web/src/hooks/useFocusOutside.ts

+3-6
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,9 @@
11
import React, { useEffect } from "react";
22

3-
export function useFocusOutside(
4-
ref: React.RefObject<HTMLDivElement>,
5-
callback: () => void
6-
) {
3+
export function useFocusOutside(ref: React.RefObject<HTMLDivElement>, callback: () => void) {
74
useEffect(() => {
8-
function handleEvent(event: any) {
9-
if (ref.current && !ref.current.contains(event.target)) {
5+
function handleEvent(event: FocusEvent | MouseEvent) {
6+
if (ref.current && !ref.current.contains(event.target as Node)) {
107
callback();
118
}
129
}

‎web/src/layout/Header/index.tsx

+2-6
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@ import styled from "styled-components";
33
import { Link } from "react-router-dom";
44
import HamburgerIcon from "svgs/header/hamburger.svg";
55
import KlerosCourtLogo from "svgs/header/kleros-court.svg";
6-
import { useFocusOutside } from "hooks/useFocusOutside";
76
import LightButton from "components/LightButton";
87
import NavBar from "./navbar";
8+
import { useFocusOutside } from "hooks/useFocusOutside";
99

1010
const Container = styled.div`
1111
position: sticky;
@@ -61,11 +61,7 @@ const Header: React.FC = () => {
6161
</Link>
6262
<div ref={containerRef}>
6363
<NavBar />
64-
<StyledLightButton
65-
text=""
66-
Icon={HamburgerIcon}
67-
onClick={toggleIsOpen}
68-
/>
64+
<StyledLightButton text="" Icon={HamburgerIcon} onClick={toggleIsOpen} />
6965
</div>
7066
</OpenContext.Provider>
7167
</Container>

‎web/src/layout/Header/navbar/Menu/Settings/General.tsx

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
import React from "react";
2+
import styled from "styled-components";
3+
import Identicon from "react-identicons";
4+
import ConnectButton, { AddressDisplay, ChainDisplay } from "components/ConnectButton";
5+
import { useWeb3 } from "hooks/useWeb3";
6+
7+
const Container = styled.div`
8+
display: flex;
9+
flex-direction: column;
10+
justify-content: center;
11+
margin-top: 32px;
12+
`;
13+
14+
const StyledChainContainer = styled.div`
15+
display: flex;
16+
height: 34px;
17+
gap: 0.5rem;
18+
justify-content: center;
19+
align-items: center;
20+
:before {
21+
content: "";
22+
width: 8px;
23+
height: 8px;
24+
border-radius: 50%;
25+
background-color: ${({ theme }) => theme.success};
26+
}
27+
> small {
28+
color: ${({ theme }) => theme.success};
29+
}
30+
`;
31+
32+
const StyledAddressContainer = styled.div`
33+
display: flex;
34+
justify-content: center;
35+
margin-top: 12px;
36+
padding-bottom: 32px;
37+
`;
38+
39+
const StyledIdenticon = styled.div`
40+
display: flex;
41+
justify-content: center;
42+
margin-top: 32px;
43+
`;
44+
45+
const StyledConnectButtonContainer = styled.div`
46+
display: flex;
47+
justify-content: center;
48+
padding: 16px;
49+
`;
50+
51+
const General: React.FC = () => {
52+
const { account } = useWeb3();
53+
54+
return account ? (
55+
<Container>
56+
<StyledChainContainer>
57+
<ChainDisplay />
58+
</StyledChainContainer>
59+
{account && (
60+
<StyledIdenticon>
61+
<Identicon size="24" string={account} />
62+
</StyledIdenticon>
63+
)}
64+
<StyledAddressContainer>
65+
<AddressDisplay />
66+
</StyledAddressContainer>
67+
</Container>
68+
) : (
69+
<StyledConnectButtonContainer>
70+
<ConnectButton />
71+
</StyledConnectButtonContainer>
72+
);
73+
};
74+
75+
export default General;

‎web/src/layout/Header/navbar/Menu/Settings/SendMeNotifications/FormNotifs/FormEmail.tsx

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React, { Dispatch, SetStateAction, useEffect, useMemo } from "react";
2+
import styled from "styled-components";
3+
import { Field } from "@kleros/ui-components-library";
4+
5+
const StyledField = styled(Field)`
6+
display: flex;
7+
width: 100%;
8+
margin-top: 34px;
9+
`;
10+
11+
interface IFormEmail {
12+
emailInput: string;
13+
emailIsValid: boolean;
14+
setEmailInput: Dispatch<SetStateAction<string>>;
15+
setEmailIsValid: Dispatch<SetStateAction<boolean>>;
16+
}
17+
18+
const FormEmail: React.FC<IFormEmail> = ({ emailInput, setEmailInput, setEmailIsValid, emailIsValid }) => {
19+
useEffect(() => {
20+
setEmailIsValid(/^[\w-.]+@([\w-]+\.)+[\w-]{2,4}$/.test(emailInput));
21+
}, [emailInput]);
22+
23+
const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
24+
event.preventDefault();
25+
setEmailInput(event.target.value);
26+
};
27+
28+
const fieldVariant = useMemo(() => {
29+
if (emailInput === "") {
30+
return undefined;
31+
}
32+
return emailIsValid ? "success" : "error";
33+
}, [emailInput, emailIsValid]);
34+
35+
return (
36+
<StyledField
37+
variant={fieldVariant}
38+
value={emailInput}
39+
onChange={handleInputChange}
40+
placeholder="[email protected]"
41+
/>
42+
);
43+
};
44+
45+
export default FormEmail;

0 commit comments

Comments
 (0)