Front end mvp (#28)

* Bounty board front end mvp

* Fix node version error for deploy

* Adding back eslintconfig in package.json

* Fix for yarn version

* reward option type fix

* Configuring husky, close #38

* Making status optional for now

* Updated [id]/index to display correct fields, and updated mongoose validation to be consistent with consense validation fields

* Added [id]/edit conditional render to block edits on bounties that are not in draft state

* refactored previous commit to be logically cleaner by using toLowerCase instead of explicitly checking cases

* Small fix for default yarn lint command

* Updating husky pre-commit

* updated schema validation rules to be consistent with specification, plus requiring the status field. refactored variable names to pull from the correct form variable

* Added bounty.status state permissions to delete permissions in [id]/index. Created 400 error page

* Updating types and params

* Updating bounty type

* First attempt at single bounty filter

* Refactored single bounty view

* Starting filter and draft editing

* Removing POST because it is out of scope

* Yarn lock for react hook form

* Change of schema from date to string

Co-authored-by: Behold <Behold.3th@gmail.com>

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn workspace @bounty-board/react-app lint-staged

package.json

@@ -8,13 +8,19 @@
     "build": "yarn workspace @bounty-board/react-app build",
     "lint": "yarn workspace @bounty-board/react-app lint",
     "test": "yarn workspace @bounty-board/react-app test",
+    "react-app:lint-staged": "yarn workspace @bounty-board/react-app lint-staged",
     "react-app:type-check": "yarn workspace @bounty-board/react-app type-check",
     "react-app:format": "yarn workspace @bounty-board/react-app format",
     "react-app:test-all": "yarn workspace @bounty-board/react-app test-all",
     "truffle:test": "yarn workspace @bounty-board/escrow test",
     "truffle:start": "yarn workspace @bounty-board/escrow start",
     "truffle:coverage": "yarn workspace @bounty-board/escrow coverage"
   },
+  "husky": {
+    "hooks": {
+      "pre-commit": "react-app:lint-staged"
+    }
+  },
   "dependencies": {},
   "workspaces": {
     "packages": [
@@ -24,5 +30,8 @@
       "**/truffle",
       "**/truffle/**"
     ]
+  },
+  "devDependencies": {
+    "husky": "^7.0.1"
   }
 }

packages/react-app/.gitignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel

packages/react-app/.prettierignore

@@ -1,5 +1,4 @@
-node_modules
+# Ignore :
+build
 .next
-yarn.lock
-package-lock.json
-public
+node_modules

packages/react-app/.prettierrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+  tabWidth: 2,
+  printWidth: 80,
+  endOfLine: 'auto',
+  arrowParens: 'always',
+  semi: true,
+  useTabs: false,
+  singleQuote: true,
+  bracketSpacing: true,
+};

packages/react-app/next-env.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="next" />
 /// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />

packages/react-app/next-seo.config.ts

@@ -0,0 +1,32 @@
+const title = 'Bankless Bounty Board';
+const description =
+  'Bankless Bounty Board';
+const url = 'https://bountyboard.bankless.community';
+
+const SEO = {
+  title,
+  description,
+  canonical: url,
+  openGraph: {
+    type: 'website',
+    url,
+    title,
+    description,
+    images: [
+      {
+        url: `https://www.bankless.community/logo.svg`,
+        alt: title,
+        width: 2048,
+        height: 1170,
+      },
+    ],
+  },
+  twitter: {
+    cardType: 'summary_large_image',
+    handle: '@banklessdao',
+    site: '@banklessdao',
+  },
+  additionalLinkTags: [{ rel: 'icon', href: '/favicon.png' }],
+};
+
+export default SEO;

packages/react-app/package.json

@@ -15,64 +15,43 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "type-check": "tsc --pretty --noEmit",
-    "format": "prettier --write .",
-    "lint": "eslint . --ext ts --ext tsx --ext js",
-    "test": "jest",
-    "test-all": "yarn lint && yarn type-check && yarn test"
+    "type-check": "tsc --pretty --noEmit --skipLibCheck --esModuleInterop --strict --jsx preserve",
+    "export": "next export",
+    "lint": "next lint",
+    "format": "prettier --write src"
+  },
+  "lint-staged": {
+    "*.@(ts|tsx)": [
+      "yarn run type-check",
+      "yarn lint src --fix -d",
+      "yarn format"
+    ]
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.35",
-    "@fortawesome/free-solid-svg-icons": "^5.15.3",
-    "@fortawesome/react-fontawesome": "^0.1.14",
-    "@types/styled-components": "^5.1.9",
-    "@web3-react/core": "^6.1.9",
-    "@web3-react/injected-connector": "^6.0.7",
-    "@web3-react/network-connector": "^6.1.9",
-    "@web3-react/walletconnect-connector": "^6.2.0",
-    "ethers": "^5.1.3",
-    "mocha": "^9.0.0",
-    "mongodb": "^3.6.9",
-    "mongodb-client-encryption": "^1.2.6",
-    "next": "11.0.0",
-    "nock": "^13.1.0",
-    "polished": "^4.1.1",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react-player": "^2.9.0",
-    "styled-components": "^5.2.3",
-    "styled-components-carousel": "^0.2.0",
-    "uuid": "^8.3.2",
-    "web3modal": "^1.9.3"
+    "@chakra-ui/react": "^1.6.5",
+    "@emotion/react": "^11.1.5",
+    "@emotion/styled": "^11.3.0",
+    "@fontsource/lexend": "^4.5.0",
+    "@typescript-eslint/eslint-plugin": "^4.28.3",
+    "framer-motion": "^4.1.17",
+    "mongoose": "^5.13.4",
+    "next": "^11.0.0",
+    "next-seo": "^4.26.0",
+    "nprogress": "^0.2.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-hook-form": "^7.12.2",
+    "react-icons": "^4.2.0",
+    "swr": "^0.5.6"
   },
   "devDependencies": {
-    "@testing-library/react": "^11.2.7",
-    "@types/jest": "^26.0.23",
-    "@types/mongodb": "^3.6.19",
-    "@types/node": "^15.12.2",
-    "@types/react": "^17.0.11",
-    "@typescript-eslint/eslint-plugin": "^4.27.0",
-    "@typescript-eslint/parser": "^4.27.0",
-    "babel-jest": "^27.0.2",
-    "bufferutil": "^4.0.3",
-    "eslint": "^7.28.0",
-    "eslint-config-next": "^11.0.0",
-    "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-react": "^7.24.0",
-    "identity-obj-proxy": "^3.0.0",
-    "jest": "^27.0.4",
-    "jest-watch-typeahead": "^0.6.4",
+    "@types/node": "^16.4.7",
+    "@types/nprogress": "^0.2.0",
+    "@types/react": "^17.0.14",
+    "eslint": "^7.30.0",
+    "eslint-config-next": "^11.0.1",
     "lint-staged": "^11.0.0",
-    "prettier": "^2.3.1",
-    "ts-jest": "^27.0.3",
-    "typescript": "^4.3.4",
-    "utf-8-validate": "^5.0.5"
-  },
-  "browser": {
-    "bufferutil": false
-  },
-  "engines": {
-    "yarn": "1.x",
-    "node": "~14.17.0"
+    "prettier": "^2.3.2",
+    "typescript": "^4.3.5"
   }
 }