diff --git a/App.tsx b/App.tsx index e9e080d08..a6808708a 100644 --- a/App.tsx +++ b/App.tsx @@ -1,11 +1,14 @@ import { Router } from "solid-app-router"; import type { Component } from "solid-js"; -import Layout from "./scenes/layout"; +import { Routes } from "./Routes"; +import { Layout } from "./scenes/layout/components/Layout"; const App: Component = () => { return ( - routes here + + + ); }; diff --git a/Routes.tsx b/Routes.tsx new file mode 100644 index 000000000..73186f96e --- /dev/null +++ b/Routes.tsx @@ -0,0 +1,32 @@ +import { Routes as SolidAppRoutes, Route } from "solid-app-router"; +import { lazy } from "solid-js"; +import HelloData from "./scenes/tournament/components/TournamentsPage.data"; + +const TournamentsPage = lazy( + () => import("./scenes/tournament/components/TournamentsPage") +); + +export function Routes() { + return ( + + {/* }> + } /> + } /> + } /> + */} + } + data={HelloData} + > + <>overview} /> + <>map pool} /> + <>bracket} /> + <>teams} /> + <>streams} /> + + <>home!} /> + <>Not found} /> + + ); +} diff --git a/index.html b/index.html index f5440792c..0c4a15e7a 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - + sendou.ink diff --git a/package-lock.json b/package-lock.json index 0a44e85bf..8a7884a00 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,14 +1,15 @@ { - "name": "vite-template-solid", + "name": "sendou.ink", "version": "0.0.0", "lockfileVersion": 2, "requires": true, "packages": { "": { - "name": "vite-template-solid", + "name": "sendou.ink", "version": "0.0.0", "license": "MIT", "dependencies": { + "@trpc/client": "^9.13.0", "normalize.css": "^8.0.1", "solid-app-router": "^0.1.11", "solid-js": "^1.1.3" @@ -397,6 +398,17 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.16.3", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.3.tgz", + "integrity": "sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==", + "dependencies": { + "regenerator-runtime": "^0.13.4" + }, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.16.0", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.16.0.tgz", @@ -444,6 +456,26 @@ "node": ">=6.9.0" } }, + "node_modules/@trpc/client": { + "version": "9.13.0", + "resolved": "https://registry.npmjs.org/@trpc/client/-/client-9.13.0.tgz", + "integrity": "sha512-HnXGi141+dZ/M02NXZI5FdFPSr2p8kkYn8qI2h2VrrOC05H6qZHZdmVnoOCRF5qdmDO/PY6b7eQzXSMr+ApeiA==", + "dependencies": { + "@babel/runtime": "^7.9.0" + }, + "peerDependencies": { + "@trpc/server": "9.13.0" + } + }, + "node_modules/@trpc/server": { + "version": "9.13.0", + "resolved": "https://registry.npmjs.org/@trpc/server/-/server-9.13.0.tgz", + "integrity": "sha512-UooZvh9mCsP43fEC9DVsjxGwj/XzBhiHcvmPe5QbOVME+s1s18oUIcliGp8KX5bHJSA3C2Yuqu72jLhB2kuxtg==", + "peer": true, + "dependencies": { + "tslib": "^2.1.0" + } + }, "node_modules/ansi-styles": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", @@ -1030,6 +1062,11 @@ "url": "https://opencollective.com/postcss/" } }, + "node_modules/regenerator-runtime": { + "version": "0.13.9", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz", + "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==" + }, "node_modules/resolve": { "version": "1.20.0", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", @@ -1140,6 +1177,12 @@ "integrity": "sha512-nsZd8ZeNUzukXPlJmTBwUAuABDe/9qtVDelJeT/qW0ow3ZS3BsQJtNkan1802aM9Uf68/Y8ljw86Hu0h5IUW3w==", "dev": true }, + "node_modules/tslib": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz", + "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==", + "peer": true + }, "node_modules/typescript": { "version": "4.4.4", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", @@ -1479,6 +1522,14 @@ "@babel/plugin-transform-typescript": "^7.16.0" } }, + "@babel/runtime": { + "version": "7.16.3", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.3.tgz", + "integrity": "sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==", + "requires": { + "regenerator-runtime": "^0.13.4" + } + }, "@babel/template": { "version": "7.16.0", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.16.0.tgz", @@ -1517,6 +1568,23 @@ "to-fast-properties": "^2.0.0" } }, + "@trpc/client": { + "version": "9.13.0", + "resolved": "https://registry.npmjs.org/@trpc/client/-/client-9.13.0.tgz", + "integrity": "sha512-HnXGi141+dZ/M02NXZI5FdFPSr2p8kkYn8qI2h2VrrOC05H6qZHZdmVnoOCRF5qdmDO/PY6b7eQzXSMr+ApeiA==", + "requires": { + "@babel/runtime": "^7.9.0" + } + }, + "@trpc/server": { + "version": "9.13.0", + "resolved": "https://registry.npmjs.org/@trpc/server/-/server-9.13.0.tgz", + "integrity": "sha512-UooZvh9mCsP43fEC9DVsjxGwj/XzBhiHcvmPe5QbOVME+s1s18oUIcliGp8KX5bHJSA3C2Yuqu72jLhB2kuxtg==", + "peer": true, + "requires": { + "tslib": "^2.1.0" + } + }, "ansi-styles": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", @@ -1916,6 +1984,11 @@ "source-map-js": "^0.6.2" } }, + "regenerator-runtime": { + "version": "0.13.9", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz", + "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==" + }, "resolve": { "version": "1.20.0", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", @@ -1998,6 +2071,12 @@ "integrity": "sha512-nsZd8ZeNUzukXPlJmTBwUAuABDe/9qtVDelJeT/qW0ow3ZS3BsQJtNkan1802aM9Uf68/Y8ljw86Hu0h5IUW3w==", "dev": true }, + "tslib": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz", + "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==", + "peer": true + }, "typescript": { "version": "4.4.4", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", diff --git a/package.json b/package.json index 99e2a8cec..4a9835c3c 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "vite-plugin-solid": "^2.0.3" }, "dependencies": { + "@trpc/client": "^9.13.0", "normalize.css": "^8.0.1", "solid-app-router": "^0.1.11", "solid-js": "^1.1.3" diff --git a/scenes/layout/index.tsx b/scenes/layout/index.tsx deleted file mode 100644 index 82c1258df..000000000 --- a/scenes/layout/index.tsx +++ /dev/null @@ -1 +0,0 @@ -export { Layout as default } from "./components/Layout"; diff --git a/scenes/tournament/components/TournamentsPage.data.ts b/scenes/tournament/components/TournamentsPage.data.ts new file mode 100644 index 000000000..79fadab4a --- /dev/null +++ b/scenes/tournament/components/TournamentsPage.data.ts @@ -0,0 +1,19 @@ +import { useData } from "solid-app-router"; +import { createResource } from "solid-js"; +import { trpcClient } from "../../../utils/trpc"; + +function fetchHello(input: string) { + return trpcClient.query("hello", input); +} + +export default function HelloData({ + params, +}: { + params: { identifier: string }; +}) { + const [user] = createResource(() => params.identifier, fetchHello); + + return user; +} + +export const useHelloData = () => useData<() => string>(); diff --git a/scenes/tournament/components/TournamentsPage.tsx b/scenes/tournament/components/TournamentsPage.tsx new file mode 100644 index 000000000..54acfb9d4 --- /dev/null +++ b/scenes/tournament/components/TournamentsPage.tsx @@ -0,0 +1,14 @@ +import { Outlet, useData } from "solid-app-router"; + +export default function TournamentsPage() { + const user = useData<() => string>(); + + return ( + <> + response: "{user()}" +

+ +

+ + ); +} diff --git a/server/index.ts b/server/index.ts index 317b295d4..861deac1e 100644 --- a/server/index.ts +++ b/server/index.ts @@ -1,5 +1,6 @@ import { EventEmitter } from "events"; import express from "express"; +import cors from "cors"; import * as trpc from "@trpc/server"; import { z } from "zod"; import * as trpcExpress from "@trpc/server/adapters/express/dist/trpc-server-adapters-express.cjs"; @@ -121,6 +122,8 @@ async function main() { // express implementation const app = express(); + app.use(cors()); + app.use((req, _res, next) => { // request logger console.log("⬅️ ", req.method, req.path, req.body ?? req.query); diff --git a/server/package-lock.json b/server/package-lock.json index 66b7d03ae..eacb46bb8 100644 --- a/server/package-lock.json +++ b/server/package-lock.json @@ -10,10 +10,12 @@ "license": "ISC", "dependencies": { "@trpc/server": "^9.13.0", + "cors": "^2.8.5", "express": "^4.17.1", "zod": "^3.11.6" }, "devDependencies": { + "@types/cors": "^2.8.12", "@types/express": "^4.17.13", "ts-node": "^10.4.0" } @@ -90,6 +92,12 @@ "@types/node": "*" } }, + "node_modules/@types/cors": { + "version": "2.8.12", + "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.12.tgz", + "integrity": "sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==", + "dev": true + }, "node_modules/@types/express": { "version": "4.17.13", "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.13.tgz", @@ -251,6 +259,18 @@ "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz", "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=" }, + "node_modules/cors": { + "version": "2.8.5", + "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz", + "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==", + "dependencies": { + "object-assign": "^4", + "vary": "^1" + }, + "engines": { + "node": ">= 0.10" + } + }, "node_modules/create-require": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", @@ -495,6 +515,14 @@ "node": ">= 0.6" } }, + "node_modules/object-assign": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/on-finished": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", @@ -815,6 +843,12 @@ "@types/node": "*" } }, + "@types/cors": { + "version": "2.8.12", + "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.12.tgz", + "integrity": "sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==", + "dev": true + }, "@types/express": { "version": "4.17.13", "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.13.tgz", @@ -949,6 +983,15 @@ "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz", "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=" }, + "cors": { + "version": "2.8.5", + "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz", + "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==", + "requires": { + "object-assign": "^4", + "vary": "^1" + } + }, "create-require": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", @@ -1139,6 +1182,11 @@ "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz", "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==" }, + "object-assign": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" + }, "on-finished": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", diff --git a/server/package.json b/server/package.json index 55bed5374..27094af9c 100644 --- a/server/package.json +++ b/server/package.json @@ -12,10 +12,12 @@ "license": "ISC", "dependencies": { "@trpc/server": "^9.13.0", + "cors": "^2.8.5", "express": "^4.17.1", "zod": "^3.11.6" }, "devDependencies": { + "@types/cors": "^2.8.12", "@types/express": "^4.17.13", "ts-node": "^10.4.0" } diff --git a/utils/trpc.ts b/utils/trpc.ts new file mode 100644 index 000000000..f84558ad0 --- /dev/null +++ b/utils/trpc.ts @@ -0,0 +1,6 @@ +import type { AppRouter } from "../server"; +import { createTRPCClient } from "@trpc/client"; + +export const trpcClient = createTRPCClient({ + url: "http://localhost:2021/trpc", +});