Dev Tools UI

package.json

@@ -22,6 +22,7 @@
     "kleros-sdk",
     "subgraph",
     "web",
+    "web-devtools",
     "eslint-config",
     "prettier-config",
     "tsconfig"

web-devtools/.editorconfig

@@ -0,0 +1,15 @@
+root = true
+
+[*]
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+charset = utf-8
+
+[*.{html,js,.json,mjs,rjson,ts}]
+indent_style = space
+indent_size = 2
+
+[*.sol]
+indent_style = space
+indent_size = 4

web-devtools/.eslintrc.json

@@ -0,0 +1,165 @@
+{
+  "env": {
+    "es6": true,
+    "browser": true,
+    "node": true
+  },
+  "root": true,
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:import/recommended",
+    "plugin:import/react",
+    "plugin:security/recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:prettier/recommended",
+    "prettier"
+  ],
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly"
+  },
+  "plugins": [
+    "react",
+    "react-hooks",
+    "security",
+    "import"
+  ],
+  "ignorePatterns": [
+    "src/assets"
+  ],
+  "settings": {
+    "react": {
+      "version": "^16.12.0"
+    },
+    "import/resolver": {
+      "parcel": {
+        "rootDir": "src",
+        "extensions": [
+          ".js",
+          ".jsx",
+          ".ts",
+          ".tsx",
+          ".svg",
+          ".png",
+          ".jpeg"
+        ]
+      }
+    }
+  },
+  "rules": {
+    "max-len": [
+      "warn",
+      {
+        "code": 120
+      }
+    ],
+    "react/prop-types": 0,
+    "no-unused-vars": "off",
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        "varsIgnorePattern": "(^_+[0-9]*$)|([iI]gnored$)|(^ignored)",
+        "argsIgnorePattern": "(^_+[0-9]*$)|([iI]gnored$)|(^ignored)"
+      }
+    ],
+    "no-console": [
+      "error",
+      {
+        "allow": [
+          "warn",
+          "error",
+          "info",
+          "debug"
+        ]
+      }
+    ],
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-explicit-any": "off",
+    "security/detect-object-injection": "off",
+    "security/detect-non-literal-fs-filename": "off",
+    "import/extensions": [
+      "error",
+      "ignorePackages",
+      {
+        "js": "never",
+        "jsx": "never",
+        "ts": "never",
+        "tsx": "never"
+      }
+    ],
+    "import/no-unresolved": "off",
+    "import/order": [
+      "warn",
+      {
+        "groups": [
+          "builtin",
+          "external",
+          "internal",
+          "parent",
+          "sibling",
+          "index"
+        ],
+        "pathGroups": [
+          {
+            "pattern": "{react,styled-components}",
+            "group": "external",
+            "position": "before"
+          },
+          {
+            "pattern": "@kleros/**",
+            "group": "external",
+            "position": "after"
+          },
+          {
+            "pattern": "{svgs/**,assets/**}",
+            "group": "internal",
+            "position": "after"
+          },
+          {
+            "pattern": "{hooks/**,utils/**,consts/**,types/**,context/**,connectors/**,}",
+            "group": "internal",
+            "position": "after"
+          },
+          {
+            "pattern": "{queries/**,}",
+            "group": "internal",
+            "position": "after"
+          },
+          {
+            "pattern": "{src/**,}",
+            "group": "internal",
+            "position": "after"
+          },
+          {
+            "pattern": "{styles/**,}",
+            "group": "internal",
+            "position": "after"
+          },
+          {
+            "pattern": "{layout/**,pages/**,components/**,}",
+            "group": "internal",
+            "position": "after"
+          }
+        ],
+        "pathGroupsExcludedImportTypes": [
+          "builtin"
+        ],
+        "newlines-between": "always",
+        "alphabetize": {
+          "order": "asc",
+          "caseInsensitive": true
+        }
+      }
+    ]
+  }
+}

web-devtools/.gitignore

@@ -0,0 +1,37 @@
+/.yarn/*
+!/.yarn/versions
+!/.yarn/plugins
+!/.yarn/releases
+!/.yarn/sdks
+/.pnp.*
+node_modules
+
+# Parcel
+.parcel-cache
+development
+build
+dist
+parcel-bundle-reports
+
+# misc
+.eslintcache
+.DS_Store
+.env
+.env.test
+.env.testnet
+.env.devnet
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# generated code
+src/hooks/contracts/generated.ts
+src/graphql
+generatedGitInfo.json
+generatedNetlifyInfo.json
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

web-devtools/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Kleros
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

web-devtools/README.md

@@ -0,0 +1,3 @@
+# Dev Tools Frontend
+
+In construction

web-devtools/netlify.toml

@@ -0,0 +1,14 @@
+## Yarn 3 cache does not work out of the box as of Jan 2022. Context:
+## https://github.com/netlify/build/issues/1535#issuecomment-1021947989
+[build.environment]
+NETLIFY_USE_YARN = "true"
+NETLIFY_YARN_WORKSPACES = "true"
+YARN_ENABLE_GLOBAL_CACHE = "true"
+# YARN_CACHE_FOLDER = "$HOME/.yarn_cache"
+# YARN_VERSION = "3.2.0"
+
+[functions]
+directory = "web-devtools/netlify/functions/"
+
+[dev]
+framework = "nextjs"

web-devtools/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@kleros/kleros-v2-web-devtools",
+  "version": "0.1.0",
+  "source": "src/index.html",
+  "browserslist": "> 0.5%, not dead",
+  "repository": "",
+  "author": "",
+  "license": "MIT",
+  "packageManager": "yarn@4.0.2+sha256.825003a0f561ad09a3b1ac4a3b3ea6207af2796d54f62a9420520915721f5186",
+  "volta": {
+    "node": "20.11.0"
+  },
+  "scripts": {
+    "hi": "echo hello world"
+  },
+  "prettier": "@kleros/kleros-v2-prettier-config",
+  "devDependencies": {
+    "typescript": "^5.3.3"
+  },
+  "dependencies": {
+    "@kleros/kleros-sdk": "workspace:^",
+    "@kleros/ui-components-library": "^2.10.0",
+    "viem": "^1.21.4",
+    "wagmi": "^1.4.13"
+  }
+}

yarn.lock

@@ -6616,6 +6616,18 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@kleros/kleros-v2-web-devtools@workspace:web-devtools":
+  version: 0.0.0-use.local
+  resolution: "@kleros/kleros-v2-web-devtools@workspace:web-devtools"
+  dependencies:
+    "@kleros/kleros-sdk": "workspace:^"
+    "@kleros/ui-components-library": "npm:^2.10.0"
+    typescript: "npm:^5.3.3"
+    viem: "npm:^1.21.4"
+    wagmi: "npm:^1.4.13"
+  languageName: unknown
+  linkType: soft
+
 "@kleros/kleros-v2-web@workspace:web":
   version: 0.0.0-use.local
   resolution: "@kleros/kleros-v2-web@workspace:web"