From 107355648816cbf98fa8ee28f4b703254376cf97 Mon Sep 17 00:00:00 2001 From: GalvinGao Date: Thu, 24 Aug 2023 11:02:40 -0400 Subject: [PATCH] feat: add researches --- package.json | 1 - src/layouts/RootLayout.tsx | 17 ++- src/pages/Dashboard.tsx | 57 -------- src/pages/Login.tsx | 4 +- .../__generated__/DashboardQuery.graphql.ts | 137 ------------------ .../DashboardResearchFragment.graphql.ts | 58 -------- src/pages/research/ResearchDetailPage.tsx | 32 ++++ src/pages/research/ResearchIndexPage.tsx | 66 +++++++++ .../ResearchDetailPageQuery.graphql.ts | 105 ++++++++++++++ .../ResearchIndexPageQuery.graphql.ts | 114 +++++++++++++++ src/router.tsx | 13 +- vite.config.ts | 10 +- yarn.lock | 11 +- 13 files changed, 349 insertions(+), 276 deletions(-) delete mode 100644 src/pages/Dashboard.tsx delete mode 100644 src/pages/__generated__/DashboardQuery.graphql.ts delete mode 100644 src/pages/__generated__/DashboardResearchFragment.graphql.ts create mode 100644 src/pages/research/ResearchDetailPage.tsx create mode 100644 src/pages/research/ResearchIndexPage.tsx create mode 100644 src/pages/research/__generated__/ResearchDetailPageQuery.graphql.ts create mode 100644 src/pages/research/__generated__/ResearchIndexPageQuery.graphql.ts diff --git a/package.json b/package.json index ee71879..94979e5 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,6 @@ "@rjsf/core": "^5.12.1", "@rjsf/mui": "^5.12.1", "@rjsf/utils": "^5.12.1", - "@rjsf/validator-ajv6": "^5.12.1", "@rjsf/validator-ajv8": "^5.12.1", "@sentry/react": "^7.64.0", "@sentry/vite-plugin": "^2.7.0", diff --git a/src/layouts/RootLayout.tsx b/src/layouts/RootLayout.tsx index 76a07c0..8c1c6fd 100644 --- a/src/layouts/RootLayout.tsx +++ b/src/layouts/RootLayout.tsx @@ -24,7 +24,7 @@ export const RootLayout: FC = () => { useEffectOnce(() => { const token = getToken() if (token) { - navigate("/dashboard") + navigate("/research") } else { navigate("/auth/login") } @@ -42,16 +42,19 @@ export const RootLayout: FC = () => { RogueStats - -
- {import.meta.env.VITE_BUILD_GIT_COMMIT || "未知构建"} -
+ + {import.meta.env.VITE_BUILD_GIT_COMMIT || "未知构建"}
{token && } - + + @@ -81,7 +84,7 @@ const AccountButton: FC = () => { return ( <> - + { - const data = useLazyLoadQuery( - graphql` - query DashboardQuery { - researches { - id - ...DashboardResearchFragment - } - - me { - name - } - } - `, - {}, - ) - - return ( -
-

Hi, {data.me.name}

-

正在进行的 RogueStats 课题

- {data.researches.map(research => ( - - ))} -
- ) -} - -const ResearchCard: FC<{ - research: DashboardResearchFragment$key -}> = ({ research }) => { - const data = useFragment( - graphql` - fragment DashboardResearchFragment on Research { - id - name - schema - } - `, - research, - ) - - return ( - -

{data.name}

-
- - ) -} diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx index de14163..0b612aa 100644 --- a/src/pages/Login.tsx +++ b/src/pages/Login.tsx @@ -45,7 +45,7 @@ export const LoginPage: FC = () => { useEffectOnce(() => { if (getToken()) { - navigate("/dashboard") + navigate("/research") } }) @@ -67,7 +67,7 @@ export const LoginPage: FC = () => { }, onCompleted: data => { toast.success(`已登录为 ${data.login.name}`) - navigate("/dashboard") + navigate("/research") }, onError: error => { console.debug(error) diff --git a/src/pages/__generated__/DashboardQuery.graphql.ts b/src/pages/__generated__/DashboardQuery.graphql.ts deleted file mode 100644 index 74cbd87..0000000 --- a/src/pages/__generated__/DashboardQuery.graphql.ts +++ /dev/null @@ -1,137 +0,0 @@ -/** - * @generated SignedSource<<8e0c3f47be3727aa89234f4237255f98>> - * @lightSyntaxTransform - * @nogrep - */ - -/* tslint:disable */ -/* eslint-disable */ -// @ts-nocheck - -import { ConcreteRequest, Query } from 'relay-runtime'; -import { FragmentRefs } from "relay-runtime"; -export type DashboardQuery$variables = {}; -export type DashboardQuery$data = { - readonly me: { - readonly name: string; - }; - readonly researches: ReadonlyArray<{ - readonly id: string; - readonly " $fragmentSpreads": FragmentRefs<"DashboardResearchFragment">; - }>; -}; -export type DashboardQuery = { - response: DashboardQuery$data; - variables: DashboardQuery$variables; -}; - -const node: ConcreteRequest = (function(){ -var v0 = { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "id", - "storageKey": null -}, -v1 = { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "name", - "storageKey": null -}; -return { - "fragment": { - "argumentDefinitions": [], - "kind": "Fragment", - "metadata": null, - "name": "DashboardQuery", - "selections": [ - { - "alias": null, - "args": null, - "concreteType": "Research", - "kind": "LinkedField", - "name": "researches", - "plural": true, - "selections": [ - (v0/*: any*/), - { - "args": null, - "kind": "FragmentSpread", - "name": "DashboardResearchFragment" - } - ], - "storageKey": null - }, - { - "alias": null, - "args": null, - "concreteType": "User", - "kind": "LinkedField", - "name": "me", - "plural": false, - "selections": [ - (v1/*: any*/) - ], - "storageKey": null - } - ], - "type": "Query", - "abstractKey": null - }, - "kind": "Request", - "operation": { - "argumentDefinitions": [], - "kind": "Operation", - "name": "DashboardQuery", - "selections": [ - { - "alias": null, - "args": null, - "concreteType": "Research", - "kind": "LinkedField", - "name": "researches", - "plural": true, - "selections": [ - (v0/*: any*/), - (v1/*: any*/), - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "schema", - "storageKey": null - } - ], - "storageKey": null - }, - { - "alias": null, - "args": null, - "concreteType": "User", - "kind": "LinkedField", - "name": "me", - "plural": false, - "selections": [ - (v1/*: any*/), - (v0/*: any*/) - ], - "storageKey": null - } - ] - }, - "params": { - "cacheID": "0dff52d6daad79fde2a6077065d60999", - "id": null, - "metadata": {}, - "name": "DashboardQuery", - "operationKind": "query", - "text": "query DashboardQuery {\n researches {\n id\n ...DashboardResearchFragment\n }\n me {\n name\n id\n }\n}\n\nfragment DashboardResearchFragment on Research {\n id\n name\n schema\n}\n" - } -}; -})(); - -(node as any).hash = "bde3c7355d8d050c150271ea83b2994c"; - -export default node; diff --git a/src/pages/__generated__/DashboardResearchFragment.graphql.ts b/src/pages/__generated__/DashboardResearchFragment.graphql.ts deleted file mode 100644 index bfc10f8..0000000 --- a/src/pages/__generated__/DashboardResearchFragment.graphql.ts +++ /dev/null @@ -1,58 +0,0 @@ -/** - * @generated SignedSource<> - * @lightSyntaxTransform - * @nogrep - */ - -/* tslint:disable */ -/* eslint-disable */ -// @ts-nocheck - -import { Fragment, ReaderFragment } from 'relay-runtime'; -import { FragmentRefs } from "relay-runtime"; -export type DashboardResearchFragment$data = { - readonly id: string; - readonly name: string; - readonly schema: any; - readonly " $fragmentType": "DashboardResearchFragment"; -}; -export type DashboardResearchFragment$key = { - readonly " $data"?: DashboardResearchFragment$data; - readonly " $fragmentSpreads": FragmentRefs<"DashboardResearchFragment">; -}; - -const node: ReaderFragment = { - "argumentDefinitions": [], - "kind": "Fragment", - "metadata": null, - "name": "DashboardResearchFragment", - "selections": [ - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "id", - "storageKey": null - }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "name", - "storageKey": null - }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "schema", - "storageKey": null - } - ], - "type": "Research", - "abstractKey": null -}; - -(node as any).hash = "f839de13126c87032888858cbb1f3276"; - -export default node; diff --git a/src/pages/research/ResearchDetailPage.tsx b/src/pages/research/ResearchDetailPage.tsx new file mode 100644 index 0000000..5ef0b29 --- /dev/null +++ b/src/pages/research/ResearchDetailPage.tsx @@ -0,0 +1,32 @@ +import { Card } from "@mui/material" +import validator from "@rjsf/validator-ajv8" +import { FC } from "react" +import { graphql, useLazyLoadQuery } from "react-relay" +import { useParams } from "react-router-dom" +import { Form } from "../../components/rjsf/Form" +import { ResearchDetailPageQuery } from "./__generated__/ResearchDetailPageQuery.graphql" + +export const ResearchDetailPage: FC = () => { + const { id } = useParams<{ id: string }>() + if (!id) throw new Error("id is required") + + const data = useLazyLoadQuery( + graphql` + query ResearchDetailPageQuery($id: ID!) { + research(id: $id) { + id + name + schema + } + } + `, + { id }, + ) + + return ( + +

{data.research.name}

+ + + ) +} diff --git a/src/pages/research/ResearchIndexPage.tsx b/src/pages/research/ResearchIndexPage.tsx new file mode 100644 index 0000000..1147eee --- /dev/null +++ b/src/pages/research/ResearchIndexPage.tsx @@ -0,0 +1,66 @@ +import { ChevronRight } from "@mui/icons-material" +import { ButtonBase, Card, CircularProgress } from "@mui/material" +import clsx from "clsx" +import { Suspense } from "react" +import { graphql, useLazyLoadQuery } from "react-relay" +import { Link, Outlet, useMatch } from "react-router-dom" +import { ResearchIndexPageQuery } from "./__generated__/ResearchIndexPageQuery.graphql" + +export const ResearchIndexPage = () => { + const matches = useMatch("/research/:id") + const data = useLazyLoadQuery( + graphql` + query ResearchIndexPageQuery { + researches { + id + name + } + + me { + name + } + } + `, + {}, + ) + + return ( +
+

Hi, {data.me.name}

+

正在进行的 RogueStats 课题

+ +
+
+ {data.researches.map(research => ( + + + +
{research.name}
+ + {matches?.params.id === research.id && ( + + )} + + + + ))} +
+ +
+ }> + + +
+
+
+ ) +} diff --git a/src/pages/research/__generated__/ResearchDetailPageQuery.graphql.ts b/src/pages/research/__generated__/ResearchDetailPageQuery.graphql.ts new file mode 100644 index 0000000..e5a4cd1 --- /dev/null +++ b/src/pages/research/__generated__/ResearchDetailPageQuery.graphql.ts @@ -0,0 +1,105 @@ +/** + * @generated SignedSource<<85bfda51d349bdd9c1101ef52c2557a6>> + * @lightSyntaxTransform + * @nogrep + */ + +/* tslint:disable */ +/* eslint-disable */ +// @ts-nocheck + +import { ConcreteRequest, Query } from 'relay-runtime'; +export type ResearchDetailPageQuery$variables = { + id: string; +}; +export type ResearchDetailPageQuery$data = { + readonly research: { + readonly id: string; + readonly name: string; + readonly schema: any; + }; +}; +export type ResearchDetailPageQuery = { + response: ResearchDetailPageQuery$data; + variables: ResearchDetailPageQuery$variables; +}; + +const node: ConcreteRequest = (function(){ +var v0 = [ + { + "defaultValue": null, + "kind": "LocalArgument", + "name": "id" + } +], +v1 = [ + { + "alias": null, + "args": [ + { + "kind": "Variable", + "name": "id", + "variableName": "id" + } + ], + "concreteType": "Research", + "kind": "LinkedField", + "name": "research", + "plural": false, + "selections": [ + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "id", + "storageKey": null + }, + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "name", + "storageKey": null + }, + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "schema", + "storageKey": null + } + ], + "storageKey": null + } +]; +return { + "fragment": { + "argumentDefinitions": (v0/*: any*/), + "kind": "Fragment", + "metadata": null, + "name": "ResearchDetailPageQuery", + "selections": (v1/*: any*/), + "type": "Query", + "abstractKey": null + }, + "kind": "Request", + "operation": { + "argumentDefinitions": (v0/*: any*/), + "kind": "Operation", + "name": "ResearchDetailPageQuery", + "selections": (v1/*: any*/) + }, + "params": { + "cacheID": "b5e6146dd3450565b87bb7b8890a74d9", + "id": null, + "metadata": {}, + "name": "ResearchDetailPageQuery", + "operationKind": "query", + "text": "query ResearchDetailPageQuery(\n $id: ID!\n) {\n research(id: $id) {\n id\n name\n schema\n }\n}\n" + } +}; +})(); + +(node as any).hash = "ccebad1bf7ce856216a3aca0aac71ef4"; + +export default node; diff --git a/src/pages/research/__generated__/ResearchIndexPageQuery.graphql.ts b/src/pages/research/__generated__/ResearchIndexPageQuery.graphql.ts new file mode 100644 index 0000000..f2fdcfd --- /dev/null +++ b/src/pages/research/__generated__/ResearchIndexPageQuery.graphql.ts @@ -0,0 +1,114 @@ +/** + * @generated SignedSource<> + * @lightSyntaxTransform + * @nogrep + */ + +/* tslint:disable */ +/* eslint-disable */ +// @ts-nocheck + +import { ConcreteRequest, Query } from 'relay-runtime'; +export type ResearchIndexPageQuery$variables = {}; +export type ResearchIndexPageQuery$data = { + readonly me: { + readonly name: string; + }; + readonly researches: ReadonlyArray<{ + readonly id: string; + readonly name: string; + }>; +}; +export type ResearchIndexPageQuery = { + response: ResearchIndexPageQuery$data; + variables: ResearchIndexPageQuery$variables; +}; + +const node: ConcreteRequest = (function(){ +var v0 = { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "id", + "storageKey": null +}, +v1 = { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "name", + "storageKey": null +}, +v2 = { + "alias": null, + "args": null, + "concreteType": "Research", + "kind": "LinkedField", + "name": "researches", + "plural": true, + "selections": [ + (v0/*: any*/), + (v1/*: any*/) + ], + "storageKey": null +}; +return { + "fragment": { + "argumentDefinitions": [], + "kind": "Fragment", + "metadata": null, + "name": "ResearchIndexPageQuery", + "selections": [ + (v2/*: any*/), + { + "alias": null, + "args": null, + "concreteType": "User", + "kind": "LinkedField", + "name": "me", + "plural": false, + "selections": [ + (v1/*: any*/) + ], + "storageKey": null + } + ], + "type": "Query", + "abstractKey": null + }, + "kind": "Request", + "operation": { + "argumentDefinitions": [], + "kind": "Operation", + "name": "ResearchIndexPageQuery", + "selections": [ + (v2/*: any*/), + { + "alias": null, + "args": null, + "concreteType": "User", + "kind": "LinkedField", + "name": "me", + "plural": false, + "selections": [ + (v1/*: any*/), + (v0/*: any*/) + ], + "storageKey": null + } + ] + }, + "params": { + "cacheID": "307391406e65240128dd3e73628fb8e4", + "id": null, + "metadata": {}, + "name": "ResearchIndexPageQuery", + "operationKind": "query", + "text": "query ResearchIndexPageQuery {\n researches {\n id\n name\n }\n me {\n name\n id\n }\n}\n" + } +}; +})(); + +(node as any).hash = "cb1d3ec39a408aec69dccd0558cc4ee0"; + +export default node; diff --git a/src/router.tsx b/src/router.tsx index 10d51ca..8e9605f 100644 --- a/src/router.tsx +++ b/src/router.tsx @@ -1,8 +1,9 @@ import { createBrowserRouter } from "react-router-dom" import { RootLayout } from "./layouts/RootLayout" import { NotFoundPage } from "./pages/404" -import { Dashboard } from "./pages/Dashboard" import { LoginPage } from "./pages/Login" +import { ResearchDetailPage } from "./pages/research/ResearchDetailPage" +import { ResearchIndexPage } from "./pages/research/ResearchIndexPage" export const router = createBrowserRouter([ { @@ -10,8 +11,14 @@ export const router = createBrowserRouter([ element: , children: [ { - path: "/dashboard", - element: , + path: "/research", + element: , + children: [ + { + path: "/research/:id", + element: , + }, + ], }, ], }, diff --git a/vite.config.ts b/vite.config.ts index d2221cd..454aa78 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -24,7 +24,7 @@ export default defineConfig(({ mode }) => ({ rollupOptions: { output: { manualChunks: { - core: [ + "vendor-core": [ "react", "react-dom", "react-relay", @@ -33,6 +33,14 @@ export default defineConfig(({ mode }) => ({ "relay-runtime", "react-hot-toast", "@rjsf/core", + "@rjsf/mui", + "@rjsf/validator-ajv8", + "@mui/material", + "@mui/icons-material", + "@mui/styled-engine", + "@sentry/react", + "@sentry/browser", + "ajv", ], }, }, diff --git a/yarn.lock b/yarn.lock index e6a4415..1f12744 100644 --- a/yarn.lock +++ b/yarn.lock @@ -692,15 +692,6 @@ lodash-es "^4.17.21" react-is "^18.2.0" -"@rjsf/validator-ajv6@^5.12.1": - version "5.12.1" - resolved "https://registry.yarnpkg.com/@rjsf/validator-ajv6/-/validator-ajv6-5.12.1.tgz#43be9b7760b499b6266d165e8921f7fee977905f" - integrity sha512-NzywRc+lX7POq3iSGgjXAiMMYuQnoLoGbC32DYgmQ2st+LOuws5Yc6ToG5dX05uEuL95MOjnOk+f+3vSPiLL1A== - dependencies: - ajv "^6.12.6" - lodash "^4.17.21" - lodash-es "^4.17.21" - "@rjsf/validator-ajv8@^5.12.1": version "5.12.1" resolved "https://registry.yarnpkg.com/@rjsf/validator-ajv8/-/validator-ajv8-5.12.1.tgz#58c15a56c26a6ce8f6763c16ed9747f8c7207480" @@ -1020,7 +1011,7 @@ ajv-formats@^2.1.1: dependencies: ajv "^8.0.0" -ajv@^6.10.0, ajv@^6.12.4, ajv@^6.12.6: +ajv@^6.10.0, ajv@^6.12.4: version "6.12.6" resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4" integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==