From 714ec0cdfc63cfef45e53b026864336aa2d88a00 Mon Sep 17 00:00:00 2001 From: Pedro Pupo Sa da Costa Date: Sat, 12 Aug 2023 22:06:07 +0100 Subject: [PATCH] refactor: isolate question editor --- .env.local | 13 -- .gitignore | 3 +- apps/docs/.storybook/preview.tsx | 21 +- .../components/edit-question-body.tsx | 63 ------ .../components/edit-question-header.tsx | 99 ---------- .../components/edit-variant-modal-as-code.tsx | 62 ------ .../components/edit-variant-modal-one-two.tsx | 106 ---------- .../components/edit-variant-modal-simple.tsx | 114 ----------- .../components/edit-variant-modal.tsx | 161 --------------- .../[questionId]/components/edit-variants.tsx | 186 ------------------ ...input-autocomplete-learning-objectives.tsx | 69 ------- .../input-comma-seperated-values.tsx | 70 ------- .../components/review-pr-modal.tsx | 140 ------------- .../questions/[questionId]/edit.page.tsx | 48 +---- .../types/edit-question-form-values.ts | 3 - libs/react/components/project.json | 2 +- libs/react/components/tsconfig.json | 14 +- libs/react/components/tsconfig.lib.json | 12 ++ libs/react/components/tsconfig.spec.json | 4 +- libs/react/containers/project.json | 2 +- .../containers/src/__tests__/decorators.tsx | 45 +++-- .../containers/src/__tests__/setup-tests.ts | 14 +- libs/react/containers/src/index.ts | 1 + ...input-autocomplete-learning-objectives.tsx | 4 +- .../src/questions/question-editor/index.ts | 1 + .../question-editor.stories.tsx | 22 +-- .../question-editor/question-editor.test.tsx | 75 ++++--- .../question-editor/question-editor.tsx | 1 - libs/react/containers/tsconfig.json | 7 +- libs/react/containers/tsconfig.lib.json | 14 +- libs/react/containers/tsconfig.spec.json | 13 +- libs/trpc/client/src/index.ts | 37 +--- libs/trpc/client/src/trpc-next.ts | 39 ++++ libs/trpc/client/tsconfig.json | 4 +- .../mock/src/__mocks__/trpc-next.mock.tsx | 6 + libs/trpc/mock/tsconfig.json | 2 +- nx.json | 44 +---- pnpm-lock.yaml | 11 ++ tsconfig.base.json | 63 ++---- 39 files changed, 199 insertions(+), 1396 deletions(-) delete mode 100644 .env.local delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-question-body.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-question-header.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-variant-modal-as-code.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-variant-modal-one-two.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-variant-modal-simple.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-variant-modal.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/edit-variants.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/input-autocomplete-learning-objectives.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/input-comma-seperated-values.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/components/review-pr-modal.tsx delete mode 100644 apps/next-app/pages/questions/[questionId]/types/edit-question-form-values.ts create mode 100644 libs/react/components/tsconfig.lib.json create mode 100644 libs/react/containers/src/questions/question-editor/index.ts create mode 100644 libs/trpc/client/src/trpc-next.ts create mode 100644 libs/trpc/mock/src/__mocks__/trpc-next.mock.tsx diff --git a/.env.local b/.env.local deleted file mode 100644 index b102f4cd8..000000000 --- a/.env.local +++ /dev/null @@ -1,13 +0,0 @@ -ENV_FILE_NAME=LOCAL -NEXT_PUBLIC_BASE_URL=https://localhost:4200 -PROVIDER_ANALYTICS_POSTGRES_URL="postgres://default:this0is0a0secret0password@localhost:5432/verceldb" -PROVIDER_ANALYTICS_POSTGRES_PRISMA_URL="postgres://default:this0is0a0secret0password@localhost:5432/verceldb?pgbouncer=true&connect_timeout=15" -PROVIDER_ANALYTICS_POSTGRES_URL_NON_POOLING="postgres://default:this0is0a0secret0password@localhost:5432/verceldb" -PROVIDER_ANALYTICS_POSTGRES_USER="default" -PROVIDER_ANALYTICS_POSTGRES_PASSWORD="this0is0a0secret0password" -PROVIDER_ANALYTICS_POSTGRES_DATABASE="verceldb" -PROVIDER_QUESTION_BANK_REDIS_UPSTASH_URL="http://localhost:8079" -PROVIDER_QUESTION_BANK_REDIS_UPSTASH_TOKEN="this0is0a0secret0password" -PROVIDER_GITHUB_TOKEN=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 -PROVIDER_GITHUB_PROJECT_OWNER=PupoSDC -PROVIDER_GITHUB_PROJECT_NAME=chair-flight diff --git a/.gitignore b/.gitignore index ea64697ac..11c301427 100644 --- a/.gitignore +++ b/.gitignore @@ -38,8 +38,9 @@ Thumbs.db # Next.js .next -.env* +.env.* !.env.example + *.tsbuildinfo .vercel diff --git a/apps/docs/.storybook/preview.tsx b/apps/docs/.storybook/preview.tsx index 79781b387..8d42bf4a8 100644 --- a/apps/docs/.storybook/preview.tsx +++ b/apps/docs/.storybook/preview.tsx @@ -7,19 +7,22 @@ import { Preview } from "@storybook/react"; import { themes } from "@storybook/theming"; import { initialize, mswDecorator, mswLoader } from "msw-storybook-addon"; import { useDarkMode } from "storybook-dark-mode"; -import { trpc } from "@chair-flight/trpc/client"; import { theme } from "@chair-flight/react/components"; +import { trpc } from "@chair-flight/trpc/client"; import type { TypographyProps } from "@mui/joy"; import "@fontsource/public-sans"; initialize({ onUnhandledRequest: ({ method, url }) => { - if (url.pathname.startsWith("/trpc")) { + if (url.pathname.includes("/trpc")) { console.error(`Unhandled ${method} request to ${url}. - This exception has been only logged in the console, however, it's strongly recommended to resolve this error as you don't want unmocked data in Storybook stories. + This exception has been only logged in the console, however, it's strongly + recommended to resolve this error as you don't want unmocked data in + Storybook stories. - If you wish to mock an error response, please refer to this guide: https://mswjs.io/docs/recipes/mocking-error-responses + If you wish to mock an error response, please refer to this guide: + https://mswjs.io/docs/recipes/mocking-error-responses `); } }, @@ -90,11 +93,6 @@ const preview: Preview = { ), - mswDecorator, - (Story) => { - const Component = trpc.withTRPC(Story); - return ; - }, (Story) => ( @@ -102,6 +100,11 @@ const preview: Preview = { ), + (Story) => { + const Component = trpc.withTRPC(Story); + return ; + }, + mswDecorator, ], }; diff --git a/apps/next-app/pages/questions/[questionId]/components/edit-question-body.tsx b/apps/next-app/pages/questions/[questionId]/components/edit-question-body.tsx deleted file mode 100644 index 73230f4a8..000000000 --- a/apps/next-app/pages/questions/[questionId]/components/edit-question-body.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { useState } from "react"; -import { Controller, useFormContext } from "react-hook-form"; -import { Box, FormControl, FormLabel, Select, Option, Button } from "@mui/joy"; -import { getNewVariant } from "@chair-flight/core/app"; -import { HookFormTextArea } from "@chair-flight/react/components"; -import { useFormHistory } from "@chair-flight/react/containers"; -import { InputAutocompleteLearningObjectives } from "./input-autocomplete-learning-objectives"; -import type { EditQuestionFormValues } from "../types/edit-question-form-values"; -import type { QuestionVariantType } from "@chair-flight/base/types"; -import type { FunctionComponent } from "react"; - -export const EditQuestionBody: FunctionComponent = () => { - const form = useFormContext(); - const history = useFormHistory(form.watch("question.id")); - - const [newVariantType, setNewVariantType] = - useState("simple"); - - const addNewVariant = () => { - const newVariant = getNewVariant(newVariantType); - form.setValue(`question.variants.${newVariant.id}`, newVariant); - history.save(); - }; - - return ( - history.save()}> - - Learning Objectives - ( - - )} - /> - - - - Create New Variant - - -