From 39d0acb9435bda92f592aa6b9133430cebbef0ea Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mikko=20Pyykk=C3=B6?= Date: Fri, 5 Aug 2022 17:45:26 +0300 Subject: [PATCH 1/7] migrate from apollo codegen to graphql-codegen --- frontend/codegen.yml | 39 + frontend/components/CertificateButton.tsx | 23 +- frontend/components/CompletedCourseCard.tsx | 1 - frontend/components/CourseImage.tsx | 5 +- .../components/CreateEmailTemplateDialog.tsx | 30 +- .../Dashboard/PaginatedPointsList.tsx | 6 +- .../Dashboard/PointsListItemCard.tsx | 27 - .../Home/Completions/Completions.tsx | 36 - frontend/graphql/fragments/completion.ts | 39 + .../fragments/completionsRegistered.ts | 2 +- frontend/graphql/fragments/course.ts | 11 + frontend/graphql/fragments/user.ts | 24 + .../graphql/fragments/userCourseProgress.ts | 10 +- .../fragments/userCourseServiceProgress.ts | 10 +- .../graphql/fragments/userOrganization.ts | 43 + frontend/graphql/queries/courses.ts | 16 +- frontend/graphql/queries/currentUser.ts | 41 - frontend/graphql/queries/organizations.ts | 48 + frontend/graphql/queries/user.ts | 99 + frontend/package-lock.json | 36773 ++++++++++------ frontend/package.json | 12 +- frontend/pages/profile/index.tsx | 37 +- frontend/pages/register.tsx | 15 - frontend/pages/users/[id]/summary.tsx | 72 +- .../types/generated/AddEmailTemplate.ts | 36 - .../types/generated/AddManualCompletion.ts | 37 - .../static/types/generated/AllCompletions.ts | 96 - .../types/generated/AllCompletionsPrevious.ts | 96 - frontend/static/types/generated/AllCourses.ts | 66 - .../types/generated/AllCoursesDetails.ts | 35 - .../types/generated/AllEditorCourses.ts | 91 - .../AllEditorModulesWithTranslations.ts | 32 - .../types/generated/AllEmailTemplates.ts | 25 - frontend/static/types/generated/AllModules.ts | 26 - frontend/static/types/generated/CheckSlug.ts | 25 - .../generated/CompletionCourseDetails.ts | 22 - .../CompletionsRegisteredFragment.ts | 25 - .../static/types/generated/ConnectedUser.ts | 40 - .../static/types/generated/ConnectionTest.ts | 44 - .../static/types/generated/CourseDetails.ts | 116 - .../types/generated/CourseDetailsFromSlug.ts | 22 - .../generated/CourseDetailsFromSlugQuery.ts | 40 - .../types/generated/CourseEditorCourses.ts | 40 - .../generated/CourseEditorStudyModules.ts | 19 - .../static/types/generated/CourseIdBySluq.ts | 21 - .../CreateRegistrationAttemptDate.ts | 23 - .../generated/CurrentUserUserOverView.ts | 64 - .../types/generated/DeleteEmailTemplate.ts | 25 - .../static/types/generated/EmailTemplate.ts | 31 - .../generated/ExportUserCourseProgesses.ts | 46 - .../static/types/generated/HandlerCourses.ts | 19 - .../static/types/generated/Organizations.ts | 27 - .../types/generated/ProfileUserOverView.ts | 63 - .../ProgressUserCourseProgressFragment.ts | 30 - ...ogressUserCourseServiceProgressFragment.ts | 27 - .../generated/RecheckCompletionMutation.ts | 16 - .../RegisterCompletionUserOverView.ts | 54 - .../types/generated/ShowUserUserOverView.ts | 66 - .../types/generated/StudyModuleDetails.ts | 42 - .../types/generated/UpdateEmailTemplate.ts | 37 - .../static/types/generated/UserCompletions.ts | 53 - .../generated/UserCourseProgressFragment.ts | 25 - .../UserCourseServiceProgressFragment.ts | 20 - .../types/generated/UserCourseSettings.ts | 112 - .../UserCourseSettingsForUserPage.ts | 67 - .../generated/UserCourseStatsSubscribe.ts | 21 - .../generated/UserCourseStatsSubscriptions.ts | 29 - .../generated/UserCourseStatsUnsubscribe.ts | 21 - ...CourseSummaryUserCourseProgressFragment.ts | 30 - ...ummaryUserCourseServiceProgressFragment.ts | 27 - .../types/generated/UserDetailsContains.ts | 73 - .../types/generated/UserOrganizations.ts | 27 - .../static/types/generated/UserOverView.ts | 20 - frontend/static/types/generated/UserPoints.ts | 66 - .../types/generated/UserPointsFragment.ts | 62 - .../static/types/generated/UserSummary.ts | 144 - frontend/static/types/generated/addCourse.ts | 89 - .../static/types/generated/addStudyModule.ts | 37 - .../types/generated/addUserOrganization.ts | 22 - .../static/types/generated/checkModuleSlug.ts | 16 - .../static/types/generated/consentQuery.ts | 18 - .../static/types/generated/deleteCourse.ts | 22 - .../types/generated/deleteStudyModule.ts | 22 - .../types/generated/deleteUserOrganization.ts | 21 - .../static/types/generated/globalTypes.ts | 2334 +- frontend/static/types/generated/index.ts | 2585 ++ .../static/types/generated/updateCourse.ts | 109 - .../updateCreateAccountResearchConsent.ts | 21 - .../types/generated/updateStudyModule.ts | 37 - .../updateUpdateAccountResearchConsent.ts | 21 - .../static/types/generated/updateUserName.ts | 24 - .../types/generated/updateUserOrganization.ts | 25 - frontend/types/gql/gql.d.ts | 79 + frontend/types/gql/graphql.ts | 2658 ++ 94 files changed, 30132 insertions(+), 17748 deletions(-) create mode 100644 frontend/codegen.yml create mode 100644 frontend/graphql/fragments/completion.ts create mode 100644 frontend/graphql/fragments/course.ts create mode 100644 frontend/graphql/fragments/user.ts create mode 100644 frontend/graphql/fragments/userOrganization.ts delete mode 100644 frontend/graphql/queries/currentUser.ts create mode 100644 frontend/graphql/queries/organizations.ts create mode 100644 frontend/graphql/queries/user.ts delete mode 100644 frontend/static/types/generated/AddEmailTemplate.ts delete mode 100644 frontend/static/types/generated/AddManualCompletion.ts delete mode 100644 frontend/static/types/generated/AllCompletions.ts delete mode 100644 frontend/static/types/generated/AllCompletionsPrevious.ts delete mode 100644 frontend/static/types/generated/AllCourses.ts delete mode 100644 frontend/static/types/generated/AllCoursesDetails.ts delete mode 100644 frontend/static/types/generated/AllEditorCourses.ts delete mode 100644 frontend/static/types/generated/AllEditorModulesWithTranslations.ts delete mode 100644 frontend/static/types/generated/AllEmailTemplates.ts delete mode 100644 frontend/static/types/generated/AllModules.ts delete mode 100644 frontend/static/types/generated/CheckSlug.ts delete mode 100644 frontend/static/types/generated/CompletionCourseDetails.ts delete mode 100644 frontend/static/types/generated/CompletionsRegisteredFragment.ts delete mode 100644 frontend/static/types/generated/ConnectedUser.ts delete mode 100644 frontend/static/types/generated/ConnectionTest.ts delete mode 100644 frontend/static/types/generated/CourseDetails.ts delete mode 100644 frontend/static/types/generated/CourseDetailsFromSlug.ts delete mode 100644 frontend/static/types/generated/CourseDetailsFromSlugQuery.ts delete mode 100644 frontend/static/types/generated/CourseEditorCourses.ts delete mode 100644 frontend/static/types/generated/CourseEditorStudyModules.ts delete mode 100644 frontend/static/types/generated/CourseIdBySluq.ts delete mode 100644 frontend/static/types/generated/CreateRegistrationAttemptDate.ts delete mode 100644 frontend/static/types/generated/CurrentUserUserOverView.ts delete mode 100644 frontend/static/types/generated/DeleteEmailTemplate.ts delete mode 100644 frontend/static/types/generated/EmailTemplate.ts delete mode 100644 frontend/static/types/generated/ExportUserCourseProgesses.ts delete mode 100644 frontend/static/types/generated/HandlerCourses.ts delete mode 100644 frontend/static/types/generated/Organizations.ts delete mode 100644 frontend/static/types/generated/ProfileUserOverView.ts delete mode 100644 frontend/static/types/generated/ProgressUserCourseProgressFragment.ts delete mode 100644 frontend/static/types/generated/ProgressUserCourseServiceProgressFragment.ts delete mode 100644 frontend/static/types/generated/RecheckCompletionMutation.ts delete mode 100644 frontend/static/types/generated/RegisterCompletionUserOverView.ts delete mode 100644 frontend/static/types/generated/ShowUserUserOverView.ts delete mode 100644 frontend/static/types/generated/StudyModuleDetails.ts delete mode 100644 frontend/static/types/generated/UpdateEmailTemplate.ts delete mode 100644 frontend/static/types/generated/UserCompletions.ts delete mode 100644 frontend/static/types/generated/UserCourseProgressFragment.ts delete mode 100644 frontend/static/types/generated/UserCourseServiceProgressFragment.ts delete mode 100644 frontend/static/types/generated/UserCourseSettings.ts delete mode 100644 frontend/static/types/generated/UserCourseSettingsForUserPage.ts delete mode 100644 frontend/static/types/generated/UserCourseStatsSubscribe.ts delete mode 100644 frontend/static/types/generated/UserCourseStatsSubscriptions.ts delete mode 100644 frontend/static/types/generated/UserCourseStatsUnsubscribe.ts delete mode 100644 frontend/static/types/generated/UserCourseSummaryUserCourseProgressFragment.ts delete mode 100644 frontend/static/types/generated/UserCourseSummaryUserCourseServiceProgressFragment.ts delete mode 100644 frontend/static/types/generated/UserDetailsContains.ts delete mode 100644 frontend/static/types/generated/UserOrganizations.ts delete mode 100644 frontend/static/types/generated/UserOverView.ts delete mode 100644 frontend/static/types/generated/UserPoints.ts delete mode 100644 frontend/static/types/generated/UserPointsFragment.ts delete mode 100644 frontend/static/types/generated/UserSummary.ts delete mode 100644 frontend/static/types/generated/addCourse.ts delete mode 100644 frontend/static/types/generated/addStudyModule.ts delete mode 100644 frontend/static/types/generated/addUserOrganization.ts delete mode 100644 frontend/static/types/generated/checkModuleSlug.ts delete mode 100644 frontend/static/types/generated/consentQuery.ts delete mode 100644 frontend/static/types/generated/deleteCourse.ts delete mode 100644 frontend/static/types/generated/deleteStudyModule.ts delete mode 100644 frontend/static/types/generated/deleteUserOrganization.ts create mode 100644 frontend/static/types/generated/index.ts delete mode 100644 frontend/static/types/generated/updateCourse.ts delete mode 100644 frontend/static/types/generated/updateCreateAccountResearchConsent.ts delete mode 100644 frontend/static/types/generated/updateStudyModule.ts delete mode 100644 frontend/static/types/generated/updateUpdateAccountResearchConsent.ts delete mode 100644 frontend/static/types/generated/updateUserName.ts delete mode 100644 frontend/static/types/generated/updateUserOrganization.ts create mode 100644 frontend/types/gql/gql.d.ts create mode 100644 frontend/types/gql/graphql.ts diff --git a/frontend/codegen.yml b/frontend/codegen.yml new file mode 100644 index 000000000..ba65e0b26 --- /dev/null +++ b/frontend/codegen.yml @@ -0,0 +1,39 @@ +schema: + - schema.graphql + +documents: + - "{graphql,pages,components,lib}/**/*.{ts,tsx}" +config: + preResolveTypes: true + namingConvention: keep + avoidOptionals: + field: true + nonOptionalTypeName: true + skipTypeNameForRoot: true +generates: + .//types/gql/: + preset: gql-tag-operations-preset + presetConfig: + augmentedModuleName: "@apollo/client" + afterOneFileWrite: + - prettier --write + ./static/types/generated/globalTypes.ts: + plugins: + - typescript + - fragment-matcher + afterOneFileWrite: + - prettier --write + ./static/types/generated/index.ts: + pluckConfig: + modules: + - name: "@apollo/client" + identifier: gql + plugins: + - typescript + - typescript-operations + afterOneFileWrite: + - prettier --write + # ./static/type/generated/nodes.ts: + # plugins: + # - typescript + # - document-nodes diff --git a/frontend/components/CertificateButton.tsx b/frontend/components/CertificateButton.tsx index ce528ed1d..6a9789962 100644 --- a/frontend/components/CertificateButton.tsx +++ b/frontend/components/CertificateButton.tsx @@ -15,13 +15,14 @@ import DialogTitle from "@mui/material/DialogTitle" import AlertContext from "/contexts/AlertContext" import LoginStateContext from "/contexts/LoginStateContext" -import { UserOverViewQuery as CompletionsUserOverViewQuery } from "/graphql/queries/currentUser" +import { UserOverViewQuery } from "/graphql/queries/user" import { updateAccount } from "/lib/account" import { checkCertificate, createCertificate } from "/lib/certificates" import { UserDetailQuery } from "/lib/with-apollo-client/fetch-user-details" -import { UserOverViewQuery } from "/pages/profile" -import { ProfileUserOverView_currentUser_completions_course } from "/static/types/generated/ProfileUserOverView" -import { UserOverView_currentUser } from "/static/types/generated/UserOverView" +import { + CompletionCourseFragment, + CurrentUserUserOverViewQuery, +} from "/static/types/generated" import CompletionsTranslations from "/translations/completions" import { useTranslator } from "/util/useTranslator" @@ -48,7 +49,7 @@ const updateUserNameMutation = gql` ` interface CertificateProps { - course: ProfileUserOverView_currentUser_completions_course + course: NonNullable } type Status = @@ -132,9 +133,9 @@ const reducer = (state: CertificateState, action: Action): CertificateState => { status: "ERROR", error: action.payload, } + default: + return state } - - return state } const CertificateButton = ({ course }: CertificateProps) => { @@ -147,11 +148,7 @@ const CertificateButton = ({ course }: CertificateProps) => { const [lastName, setLastName] = useState(currentUser?.last_name ?? "") const [updateUserName] = useMutation(updateUserNameMutation, { - refetchQueries: [ - { query: UserDetailQuery }, - { query: UserOverViewQuery }, - { query: CompletionsUserOverViewQuery }, - ], + refetchQueries: [{ query: UserDetailQuery }, { query: UserOverViewQuery }], }) const [open, setOpen] = useState(false) @@ -204,7 +201,7 @@ const CertificateButton = ({ course }: CertificateProps) => { ...(currentUser || { email: "", id: "" }), first_name: firstName, last_name: lastName, - } as UserOverView_currentUser) + } as CurrentUserUserOverViewQuery["currentUser"]) dispatch({ type: "UPDATED_NAME", payload: res }) } diff --git a/frontend/components/CompletedCourseCard.tsx b/frontend/components/CompletedCourseCard.tsx index cbab6c318..457f58132 100644 --- a/frontend/components/CompletedCourseCard.tsx +++ b/frontend/components/CompletedCourseCard.tsx @@ -6,7 +6,6 @@ import Typography from "@mui/material/Typography" import { mapLangToLanguage } from "/components/DataFormatFunctions" import { ClickableDiv } from "/components/Surfaces/ClickableCard" -import { ProfileUserOverView_currentUser_completions } from "/static/types/generated/ProfileUserOverView" import CompletionsTranslations from "/translations/completions" import ProfileTranslations from "/translations/profile" import { useTranslator } from "/util/useTranslator" diff --git a/frontend/components/CourseImage.tsx b/frontend/components/CourseImage.tsx index 446773e42..9197a1b7d 100644 --- a/frontend/components/CourseImage.tsx +++ b/frontend/components/CourseImage.tsx @@ -3,7 +3,7 @@ import { memo } from "react" import styled from "@emotion/styled" import { Typography } from "@mui/material" -import { AllCourses_courses_photo } from "/static/types/generated/AllCourses" +import { CoursePhotoFragment } from "/static/types/generated" import { addDomain } from "/util/imageUtils" const ComponentStyle = ` @@ -22,8 +22,7 @@ const PlaceholderComponent = styled.div` justify-content: center; align-items: center; ` -interface CourseImageProps { - photo?: AllCourses_courses_photo | null +interface CourseImageProps extends CoursePhotoFragment { [k: string]: any } diff --git a/frontend/components/CreateEmailTemplateDialog.tsx b/frontend/components/CreateEmailTemplateDialog.tsx index 107831fe0..9235bcadd 100644 --- a/frontend/components/CreateEmailTemplateDialog.tsx +++ b/frontend/components/CreateEmailTemplateDialog.tsx @@ -25,9 +25,12 @@ import CustomSnackbar from "/components/CustomSnackbar" import Spinner from "/components/Spinner" import { UpdateCourseMutation } from "/graphql/mutations/courses" import { AddEmailTemplateMutation } from "/graphql/mutations/email-templates" -import { AddEmailTemplate } from "/static/types/generated/AddEmailTemplate" -import { CourseDetailsFromSlugQuery_course as CourseDetailsData } from "/static/types/generated/CourseDetailsFromSlugQuery" -import { updateCourse } from "/static/types/generated/updateCourse" +import { + AddEmailTemplateMutation as AddEmailTemplate, + AllCoursesDetailsQuery, + CourseDetailsFromSlugQueryQuery, +} from "/static/types/generated" +import { updateCourseMutation as updateCourse } from "/static/types/generated" export const AllCoursesDetails = gql` query AllCoursesDetails { @@ -49,8 +52,8 @@ export const AllCoursesDetails = gql` } ` -interface CreateEmailTemplateDialogParams { - course?: CourseDetailsData +interface CreateEmailTemplateDialogParams + extends CourseDetailsFromSlugQueryQuery { buttonText: string type?: string } @@ -64,12 +67,11 @@ const CreateEmailTemplateDialog = ({ const [nameInput, setNameInput] = useState("") const [templateType, setTemplateType] = useState(type) const [selectedCourse, setSelectedCourse] = useState< - CourseDetailsData | undefined - >(undefined) + keyof NonNullable | null + >(null) const [isErrorSnackbarOpen, setIsErrorSnackbarOpen] = useState(false) - const { loading, error, data } = useQuery<{ courses: CourseDetailsData[] }>( - AllCoursesDetails, - ) + const { loading, error, data } = + useQuery(AllCoursesDetails) const client = useApolloClient() if (loading) { @@ -90,8 +92,8 @@ const CreateEmailTemplateDialog = ({ const courseOptions = templateType === "completion" - ? data.courses - .filter((c) => c?.completion_email === null) + ? data!.courses + ?.filter((c) => c?.completion_email === null) .map((c, i) => { return ( ) }) - : data.courses.map((c, i) => { + : data!.courses?.map((c, i) => { return (