From 9cab68d6226927d5572d617f97ca8e1d3eb01b01 Mon Sep 17 00:00:00 2001 From: Igor Konovalov Date: Tue, 5 Oct 2021 19:45:18 +0300 Subject: [PATCH 1/3] [IMPROVE]: fixed some linter problems, added prettier, changed global css to scss, added node types for next --- package.json | 2 + pages/_app.tsx | 4 +- pages/api/getAssets.js | 34 ++++--- pages/api/getBoard.js | 20 +++-- pages/api/updateCoordinate.js | 36 +++++--- pages/index.tsx | 127 ++++++++++++++++++--------- prettier.config.js | 6 ++ styles/{globals.css => globals.scss} | 1 - yarn.lock | 10 +++ 9 files changed, 164 insertions(+), 76 deletions(-) create mode 100644 prettier.config.js rename styles/{globals.css => globals.scss} (98%) diff --git a/package.json b/package.json index b9359ba..352f351 100644 --- a/package.json +++ b/package.json @@ -33,10 +33,12 @@ }, "devDependencies": { "@typechain/ethers-v5": "^7.0.1", + "@types/node": "^16.10.2", "@types/react": "^17.0.19", "eslint": "7.32.0", "eslint-config-next": "11.1.0", "ethers": "^5.4.5", + "prettier": "2.4.1", "typechain": "^5.1.2", "typescript": "^4.3.5" } diff --git a/pages/_app.tsx b/pages/_app.tsx index af2e7ce..5087c23 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,8 +1,8 @@ import { Web3ReactProvider } from "@web3-react/core"; import type { AppProps } from "next/app"; import getLibrary from "../getLibrary"; -import 'semantic-ui-css/semantic.min.css'; -import "../styles/globals.css"; +import "semantic-ui-css/semantic.min.css"; +import "../styles/globals.scss"; function NextWeb3App({ Component, pageProps }: AppProps) { return ( diff --git a/pages/api/getAssets.js b/pages/api/getAssets.js index 98ea68f..52dfaa7 100644 --- a/pages/api/getAssets.js +++ b/pages/api/getAssets.js @@ -1,24 +1,32 @@ import axios from "axios"; -export default async (req, res) => { - const openseaAssetURL = "https://api.opensea.io/api/v1/assets?order_direction=desc&order_by=sale_price" - console.log("getAssets from opensea: " + JSON.stringify(req.query, null, 2)) - if (req.method == 'GET' && req.query.owner) { +const getAccess = async (req, res) => { + const openseaAssetURL = + "https://api.opensea.io/api/v1/assets?order_direction=desc&order_by=sale_price"; + console.log("getAssets from opensea: " + JSON.stringify(req.query, null, 2)); + + if (req.method == "GET" && req.query.owner) { console.log("getting Assets from opensea..."); - axios({ - method: 'GET', - url: openseaAssetURL, - params: { owner: req.query.owner, - limit: req.query.limit }, - headers: {'X-API-KEY': process.env.OPENSEA_API_KEY} - }).then((response) => { + + try { + await axios({ + method: "GET", + url: openseaAssetURL, + params: { + owner: req.query.owner, + limit: req.query.limit, + }, + }); + console.log("getAssets result: " + response.data); res.status(200).json({ assets: response.data.assets }); - }).catch(error => { + } catch (error) { console.log(error); res.status(500).json({ error: error }); - }) + } } else { res.status(500).json({ error: "Could not GET owner." }); } }; + +export default getAccess; diff --git a/pages/api/getBoard.js b/pages/api/getBoard.js index 9b014eb..b4729e4 100644 --- a/pages/api/getBoard.js +++ b/pages/api/getBoard.js @@ -1,15 +1,19 @@ -import { query as q } from 'faunadb'; -import { faunaClient } from '../../lib/fauna'; +import { query as q } from "faunadb"; +import { faunaClient } from "../../lib/fauna"; import { MAX_SIZE } from "../../util"; -export default async (req, res) => { - console.log("getBoard: " + JSON.stringify(req.method, null, 2)) - if (req.method == 'GET') { - console.log("getting Board...") +const getBoard = async (req, res) => { + console.log("getBoard: " + JSON.stringify(req.method, null, 2)); + if (req.method == "GET") { + console.log("getting Board..."); let query = await faunaClient.query( - q.Paginate(q.Match(q.Index("all_coordinates")), { size: MAX_SIZE * MAX_SIZE }) + q.Paginate(q.Match(q.Index("all_coordinates")), { + size: MAX_SIZE * MAX_SIZE, + }) ); - console.log("getBoard result length: " + query.data.length) + console.log("getBoard result length: " + query.data.length); res.status(200).json({ coordinates: query.data }); } }; + +export default getBoard; diff --git a/pages/api/updateCoordinate.js b/pages/api/updateCoordinate.js index 5a3867d..cd23541 100644 --- a/pages/api/updateCoordinate.js +++ b/pages/api/updateCoordinate.js @@ -1,24 +1,36 @@ -import {query as q} from 'faunadb'; -import { faunaClient } from '../../lib/fauna'; +import { query as q } from "faunadb"; +import { faunaClient } from "../../lib/fauna"; -export default async (req, res) => { +const updateCoordinate = async (req, res) => { console.log("updateCoordinate: " + JSON.stringify(req.body, null, 2)); - if (req.method == 'POST') { - console.log("updating Coordinate...") + if (req.method == "POST") { + console.log("updating Coordinate..."); let query = await faunaClient.query( // update OR create a coordinate based on the token_id - q.Let({ - match: q.Match(q.Index('unique_token_id'), req.body.token_id), - data: { token_id: req.body.token_id, owner: req.body.owner, color: req.body.color, image_uri: req.body.image_uri } + q.Let( + { + match: q.Match(q.Index("unique_token_id"), req.body.token_id), + data: { + token_id: req.body.token_id, + owner: req.body.owner, + color: req.body.color, + image_uri: req.body.image_uri, + }, }, q.If( - q.Exists(q.Var('match')), - q.Update(q.Select(['ref'], q.Get(q.Var('match'))), { data: q.Var('data') }), - q.Create(q.Collection('coordinates'), { data: q.Var('data') }) + q.Exists(q.Var("match")), + q.Update(q.Select(["ref"], q.Get(q.Var("match"))), { + data: q.Var("data"), + }), + q.Create(q.Collection("coordinates"), { data: q.Var("data") }) ) ) ); - console.log("updateCoordinate result: " + JSON.stringify(query.data, null, 2)) + console.log( + "updateCoordinate result: " + JSON.stringify(query.data, null, 2) + ); res.status(200).json({ data: query }); } }; + +export default updateCoordinate; diff --git a/pages/index.tsx b/pages/index.tsx index 67ad79d..251423f 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,8 +1,7 @@ import { useWeb3React } from "@web3-react/core"; import Head from "next/head"; -import Link from "next/link"; +import Image from "next/image"; import Account from "../components/Account"; -import ETHBalance from "../components/ETHBalance"; import XYBalance from "../components/XYBalance"; import useEagerConnect from "../hooks/useEagerConnect"; @@ -10,9 +9,7 @@ import Game from "../components/Game"; function Home() { const { account, library } = useWeb3React(); - const triedToEagerConnect = useEagerConnect(); - const isConnected = typeof account === "string" && !!library; return ( @@ -23,35 +20,67 @@ function Home() {
-
+

X,Y Project

-

- OpenSea  |   - Etherscan  |   - Twitter  |   + OpenSea +   |   + + Etherscan + +   |   + Twitter +   |   Discord

- - + + +   - + + +   - - + + +

-
-

The X,Y Project is a full set of X,Y Coordinates stored on chain, representing a 128x128 grid.

-

Use X,Y Project in any way you want. For example: maps, tiles, locations, games, virtual worlds, and more.

+

+ The X,Y Project is a full set of X,Y Coordinates stored on chain, + representing a 128x128 grid. +

+

+ Use X,Y Project in any way you want. For example: maps, tiles, + locations, games, virtual worlds, and more. +

-

- -

- Claim your Free X,Y Project NFTs (until they are all minted) -

- +

Claim your Free X,Y Project NFTs (until they are all minted)

{isConnected && (
@@ -59,7 +88,6 @@ function Home() {
)} - {!isConnected && (
@@ -67,25 +95,44 @@ function Home() {
)} - <> -
- Brought to you by the team @ NFTYverse API -

- This website is Open-Source -



-
+
+ Brought to you by the team @{" "} + + NFTYverse API + +
+
+ This website is{" "} + + Open-Source + +
+
+
+
+
X,Y Project is a fun, community-focused metaverse NFT project. - Please feel free to use it in any way you want. - Claim X,Y corodinates, issue blockchain transactions, and use the NFTs at your own risk. - Full website functionality requries Metamask or a similar wallet plugin. - We do not track or store your information. - Ownership data is cached and pulled directly from the public Ethereum blockchain. - All information on this website is provided "AS IS". - The website is open source, free to use and makes no warranties, express, implied or otherwise, regarding its accuracy, completeness or performance. - Enjoy the X,Y Project and drop us a line on Twitter or Discord if you have any questions! + Please feel free to use it in any way you want. Claim X,Y + corodinates, issue blockchain transactions, and use the NFTs at your + own risk. Full website functionality requries Metamask or a similar + wallet plugin. We do not track or store your information. Ownership + data is cached and pulled directly from the public Ethereum + blockchain. All information on this website is provided "AS + IS". The website is open source, free to use and makes no + warranties, express, implied or otherwise, regarding its accuracy, + completeness or performance. Enjoy the X,Y Project and drop us a + line on Twitter or{" "} + Discord if you + have any questions!
-


+
+
+
diff --git a/prettier.config.js b/prettier.config.js new file mode 100644 index 0000000..0d04fcf --- /dev/null +++ b/prettier.config.js @@ -0,0 +1,6 @@ +module.exports = { + trailingComma: "es5", + tabWidth: 2, + semi: true, + singleQuote: false, +}; \ No newline at end of file diff --git a/styles/globals.css b/styles/globals.scss similarity index 98% rename from styles/globals.css rename to styles/globals.scss index 0cd8cbb..c2a2058 100644 --- a/styles/globals.css +++ b/styles/globals.scss @@ -88,6 +88,5 @@ body { } .terms { width: 80%; - align: center; margin: auto; } diff --git a/yarn.lock b/yarn.lock index bd63c33..26201ca 100644 --- a/yarn.lock +++ b/yarn.lock @@ -590,6 +590,11 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.41.tgz#d0b939d94c1d7bd53d04824af45f1139b8c45615" integrity sha512-dueRKfaJL4RTtSa7bWeTK1M+VH+Gns73oCgzvYfHZywRCoPSd8EkXBL0mZ9unPTveBn+D9phZBaxuzpwjWkW0g== +"@types/node@^16.10.2": + version "16.10.2" + resolved "https://registry.yarnpkg.com/@types/node/-/node-16.10.2.tgz#5764ca9aa94470adb4e1185fe2e9f19458992b2e" + integrity sha512-zCclL4/rx+W5SQTzFs9wyvvyCwoK9QtBpratqz2IYJ3O8Umrn0m3nsTv0wQBk9sRGpvUe9CwPDrQFB10f1FIjQ== + "@types/prettier@^2.1.1": version "2.3.2" resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.3.2.tgz#fc8c2825e4ed2142473b4a81064e6e081463d1b3" @@ -3146,6 +3151,11 @@ prelude-ls@^1.2.1: resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g== +prettier@2.4.1: + version "2.4.1" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.4.1.tgz#671e11c89c14a4cfc876ce564106c4a6726c9f5c" + integrity sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA== + prettier@^2.1.2: version "2.3.2" resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.3.2.tgz#ef280a05ec253712e486233db5c6f23441e7342d" From d460db5c5b24369db7326b037279dbc9e8cc6b02 Mon Sep 17 00:00:00 2001 From: Igor Konovalov Date: Tue, 5 Oct 2021 19:50:33 +0300 Subject: [PATCH 2/3] [FIX]: added opensea to known image hosts in next.config --- next.config.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/next.config.js b/next.config.js index da1bb77..318f931 100644 --- a/next.config.js +++ b/next.config.js @@ -1,3 +1,6 @@ module.exports = { reactStrictMode: true, + images: { + domains: ['storage.opensea.io'], + }, }; From ab3940ef3794317fd38e707a6db74197bc36b492 Mon Sep 17 00:00:00 2001 From: Igor Konovalov Date: Wed, 6 Oct 2021 19:20:49 +0300 Subject: [PATCH 3/3] [IMPROVE]: provided base url, fixed some more lint troubles --- components/Account.tsx | 6 ++++-- pages/_app.tsx | 2 +- pages/index.tsx | 3 +++ styles/{globals.scss => globals.css} | 1 + tsconfig.json | 3 ++- 5 files changed, 11 insertions(+), 4 deletions(-) rename styles/{globals.scss => globals.css} (99%) diff --git a/components/Account.tsx b/components/Account.tsx index a17eebf..b5f1aab 100644 --- a/components/Account.tsx +++ b/components/Account.tsx @@ -23,8 +23,10 @@ const Account = ({ triedToEagerConnect }: Props) => { // initialize metamask onboarding const onboarding = useRef(); - useLayoutEffect(() => { - onboarding.current = new MetaMaskOnboarding(); + useEffect(() => { + if (typeof window !== 'undefined') { + onboarding.current = new MetaMaskOnboarding(); + } }, []); // manage connecting state for injected connector diff --git a/pages/_app.tsx b/pages/_app.tsx index 5087c23..f31d8c9 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -2,7 +2,7 @@ import { Web3ReactProvider } from "@web3-react/core"; import type { AppProps } from "next/app"; import getLibrary from "../getLibrary"; import "semantic-ui-css/semantic.min.css"; -import "../styles/globals.scss"; +import "styles/globals.css"; function NextWeb3App({ Component, pageProps }: AppProps) { return ( diff --git a/pages/index.tsx b/pages/index.tsx index 251423f..edfcb98 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -41,6 +41,7 @@ function Home() { @@ -53,6 +54,7 @@ function Home() { @@ -65,6 +67,7 @@ function Home() { diff --git a/styles/globals.scss b/styles/globals.css similarity index 99% rename from styles/globals.scss rename to styles/globals.css index c2a2058..c10ee9b 100644 --- a/styles/globals.scss +++ b/styles/globals.css @@ -1,3 +1,4 @@ +:global html, body { padding: 0; diff --git a/tsconfig.json b/tsconfig.json index 93a83a4..816e09a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -12,7 +12,8 @@ "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, - "jsx": "preserve" + "jsx": "preserve", + "baseUrl": ".", }, "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], "exclude": ["node_modules"]