diff --git a/package.json b/package.json
index dd78c7802..234933d1e 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-prettier": "^3.4.1",
"eslint-plugin-promise": "^5.1.1",
+ "eslint-utils": "^3.0.0",
"husky": "^7.0.0",
"lint-staged": "^11.0.0",
"npm-run-all": "^4.1.5",
diff --git a/web/.yarnrc.yml b/web/.yarnrc.yml
index 4175cf252..c6e883c59 100644
--- a/web/.yarnrc.yml
+++ b/web/.yarnrc.yml
@@ -1,3 +1,2 @@
nodeLinker: node-modules
-cacheFolder: $HOME/.yarn_cache
diff --git a/web/codegen.yaml b/web/codegen.yaml
new file mode 100644
index 000000000..9a47307ab
--- /dev/null
+++ b/web/codegen.yaml
@@ -0,0 +1,7 @@
+schema: https://api.thegraph.com/subgraphs/name/alcercu/kleros-core
+documents: './src/hooks/queries/*.ts'
+generates:
+ src/graphql/generated.ts:
+ plugins:
+ - typescript
+ - typescript-operations
diff --git a/web/netlify.toml b/web/netlify.toml
index 55b1192ea..68fbd9418 100644
--- a/web/netlify.toml
+++ b/web/netlify.toml
@@ -4,5 +4,5 @@
NETLIFY_USE_YARN = "true"
NETLIFY_YARN_WORKSPACES = "true"
YARN_ENABLE_GLOBAL_CACHE = "true"
-YARN_CACHE_FOLDER = "$HOME/.yarn_cache"
+# YARN_CACHE_FOLDER = "$HOME/.yarn_cache"
# YARN_VERSION = "3.2.0"
diff --git a/web/package.json b/web/package.json
index ac18d1f46..05decd02d 100644
--- a/web/package.json
+++ b/web/package.json
@@ -2,7 +2,7 @@
"name": "@kleros/kleros-v2-web",
"version": "0.1.0",
"source": "src/index.html",
- "browserslist": "> 0.5%, last 2 versions, not dead, not ios_saf < 13",
+ "browserslist": "> 0.5%, not dead",
"repository": "",
"author": "",
"license": "MIT",
@@ -14,6 +14,7 @@
"layout": "./src/layout",
"consts": "./src/consts",
"hooks": "./src/hooks",
+ "queries": "./src/hooks/queries",
"pages": "./src/pages",
"styles": "./src/styles",
"svgs": "./src/assets/svgs"
@@ -25,16 +26,18 @@
"start": "parcel",
"build": "parcel build",
"check-style": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
- "check-types": "tsc --noEmit"
+ "check-types": "tsc --noEmit",
+ "generate": "graphql-codegen"
},
"devDependencies": {
- "@parcel/transformer-svg-react": "^2.2.1",
- "@types/react": "^17.0.38",
- "@types/react-dom": "^17.0.11",
+ "@parcel/transformer-svg-react": "^2.5.0",
+ "@types/react": "^18.0.0",
+ "@types/react-dom": "^18.0.0",
"@types/styled-components": "^5.1.21",
- "@typescript-eslint/eslint-plugin": "^5.10.1",
- "@typescript-eslint/parser": "^5.10.1",
- "eslint": "^8.7.0",
+ "@typescript-eslint/eslint-plugin": "^5.27.0",
+ "@typescript-eslint/parser": "^5.27.0",
+ "@typescript-eslint/utils": "^5.27.0",
+ "eslint": "^8.16.0",
"eslint-config-prettier": "^8.3.0",
"eslint-import-resolver-parcel": "^1.10.6",
"eslint-plugin-import": "^2.25.4",
@@ -42,19 +45,31 @@
"eslint-plugin-react": "^7.28.0",
"eslint-plugin-react-hooks": "^4.3.0",
"eslint-plugin-security": "^1.4.0",
+ "eslint-utils": "^3.0.0",
"lru-cache": "^7.8.0",
- "parcel": "^2.4.1",
+ "parcel": "^2.6.0",
"prettier": "^2.5.1",
"typescript": "^4.5.5"
},
"dependencies": {
+ "@graphql-codegen/cli": "^2.6.2",
+ "@graphql-codegen/typescript": "^2.4.9",
+ "@graphql-codegen/typescript-operations": "^2.3.6",
"@kleros/kleros-v2-contracts": "workspace:^",
- "@kleros/ui-components-library": "^0.1.5",
+ "@kleros/ui-components-library": "^1.1.0",
+ "chart.js": "^3.7.1",
+ "chartjs-adapter-moment": "^1.0.0",
"core-js": "^3.21.1",
+ "ethers": "^5.6.5",
+ "graphql": "^16.4.0",
+ "graphql-request": "^4.2.0",
+ "moment": "^2.29.3",
"react": "^18.0.0",
+ "react-chartjs-2": "^4.1.0",
"react-dom": "^18.0.0",
"react-is": "^18.0.0",
"react-router-dom": "6",
- "styled-components": "^5.3.5"
+ "styled-components": "^5.3.5",
+ "swr": "^1.3.0"
}
}
diff --git a/web/src/app.tsx b/web/src/app.tsx
index 4a771358d..fd5b8be0c 100644
--- a/web/src/app.tsx
+++ b/web/src/app.tsx
@@ -1,24 +1,43 @@
import React from "react";
-import { Routes, Route } from "react-router-dom";
import StyledComponentsProvider from "context/StyledComponentsProvider";
+import { SWRConfig } from "swr";
+import { request } from "graphql-request";
+import { Routes, Route } from "react-router-dom";
import Layout from "layout/index";
import Home from "./pages/home";
-const App: React.FC = () => (
-
-
- }>
- } />
- Cases} />
- Courts} />
- Dashboard} />
- Justice not found here ¯\_( ͡° ͜ʖ ͡°)_/¯}
- />
-
-
-
-);
+const fetcherBuilder =
+ (url: string) =>
+ ({ query, variables }: { query: string; variables?: any }) => {
+ console.log("fetch");
+ return request(url, query, variables);
+ };
+
+const App: React.FC = () => {
+ return (
+
+
+
+ }>
+ } />
+ Cases} />
+ Courts} />
+ Dashboard} />
+ Justice not found here ¯\_( ͡° ͜ʖ ͡°)_/¯}
+ />
+
+
+
+
+ );
+};
export default App;
diff --git a/web/src/assets/svgs/icons/bookmark.svg b/web/src/assets/svgs/icons/bookmark.svg
new file mode 100644
index 000000000..fdb0da0bf
--- /dev/null
+++ b/web/src/assets/svgs/icons/bookmark.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/calendar.svg b/web/src/assets/svgs/icons/calendar.svg
new file mode 100644
index 000000000..642995bf0
--- /dev/null
+++ b/web/src/assets/svgs/icons/calendar.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/chat.svg b/web/src/assets/svgs/icons/chat.svg
new file mode 100644
index 000000000..411718aeb
--- /dev/null
+++ b/web/src/assets/svgs/icons/chat.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/ethereum.svg b/web/src/assets/svgs/icons/ethereum.svg
new file mode 100644
index 000000000..c570a3c65
--- /dev/null
+++ b/web/src/assets/svgs/icons/ethereum.svg
@@ -0,0 +1,3 @@
+
diff --git a/web/src/assets/svgs/icons/french-flag.svg b/web/src/assets/svgs/icons/french-flag.svg
new file mode 100644
index 000000000..1e72458c1
--- /dev/null
+++ b/web/src/assets/svgs/icons/french-flag.svg
@@ -0,0 +1,5 @@
+
diff --git a/web/src/assets/svgs/icons/law-balance.svg b/web/src/assets/svgs/icons/law-balance.svg
new file mode 100644
index 000000000..307ccb85a
--- /dev/null
+++ b/web/src/assets/svgs/icons/law-balance.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/phone.svg b/web/src/assets/svgs/icons/phone.svg
new file mode 100644
index 000000000..4164619d2
--- /dev/null
+++ b/web/src/assets/svgs/icons/phone.svg
@@ -0,0 +1,5 @@
+
diff --git a/web/src/assets/svgs/icons/pile-coins.svg b/web/src/assets/svgs/icons/pile-coins.svg
new file mode 100644
index 000000000..97660f56b
--- /dev/null
+++ b/web/src/assets/svgs/icons/pile-coins.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/pnk.svg b/web/src/assets/svgs/icons/pnk.svg
new file mode 100644
index 000000000..3b726787d
--- /dev/null
+++ b/web/src/assets/svgs/icons/pnk.svg
@@ -0,0 +1,10 @@
+
diff --git a/web/src/assets/svgs/icons/redistributed-pnk.svg b/web/src/assets/svgs/icons/redistributed-pnk.svg
new file mode 100644
index 000000000..cc9081d4d
--- /dev/null
+++ b/web/src/assets/svgs/icons/redistributed-pnk.svg
@@ -0,0 +1,34 @@
+
diff --git a/web/src/assets/svgs/icons/snapshot-color.svg b/web/src/assets/svgs/icons/snapshot-color.svg
new file mode 100644
index 000000000..683389dd3
--- /dev/null
+++ b/web/src/assets/svgs/icons/snapshot-color.svg
@@ -0,0 +1,3 @@
+
diff --git a/web/src/assets/svgs/icons/user.svg b/web/src/assets/svgs/icons/user.svg
new file mode 100644
index 000000000..d9f6d1df3
--- /dev/null
+++ b/web/src/assets/svgs/icons/user.svg
@@ -0,0 +1,3 @@
+
diff --git a/web/src/assets/svgs/menu-icons/dark-mode.svg b/web/src/assets/svgs/menu-icons/dark-mode.svg
index c3f24c6fc..ca7106896 100644
--- a/web/src/assets/svgs/menu-icons/dark-mode.svg
+++ b/web/src/assets/svgs/menu-icons/dark-mode.svg
@@ -1,3 +1,3 @@
-