swap types with generated types

Author: rudransh-shrivastava

frontend/src/app/my/mentorship/programs/[programKey]/page.tsx

@@ -6,13 +6,13 @@ import { useParams, useSearchParams, useRouter } from 'next/navigation'
 import { useSession } from 'next-auth/react'
 import { useEffect, useMemo, useState } from 'react'
 import { ErrorDisplay, handleAppError } from 'app/global-error'
-import { UPDATE_PROGRAM_STATUS_MUTATION } from 'server/mutations/programsMutations'
+import { ProgramStatusEnum } from 'types/__generated__/graphql'
+import { UpdateProgramStatusDocument } from 'types/__generated__/programsMutations.generated'
 import {
   GetProgramAndModulesDocument,
   GetProgramAndModulesQuery,
 } from 'types/__generated__/programsQueries.generated'
 import type { ExtendedSession } from 'types/auth'
-import { ProgramStatusEnum } from 'types/mentorship'
 import { formatDate } from 'utils/dateFormatter'
 import DetailsCard from 'components/CardDetailsPage'
 import LoadingSpinner from 'components/LoadingSpinner'
@@ -30,8 +30,7 @@ const ProgramDetailsPage = () => {
   const [modules, setModules] = useState<GetProgramAndModulesQuery['getProgramModules']>([])
   const [isRefetching, setIsRefetching] = useState(false)
 
-  // TODO: update type
-  const [updateProgram] = useMutation(UPDATE_PROGRAM_STATUS_MUTATION, {
+  const [updateProgram] = useMutation(UpdateProgramStatusDocument, {
     onError: handleAppError,
   })
 
@@ -142,7 +141,7 @@ const ProgramDetailsPage = () => {
 
   return (
     <DetailsCard
-      modules={modules}
+      modules={modules} //TODO: update type
       status={program.status}
       setStatus={updateStatus}
       canUpdateStatus={canUpdateStatus}

frontend/src/app/snapshots/[id]/page.tsx

@@ -10,8 +10,6 @@ import {
   GetSnapshotDetailsDocument,
   GetSnapshotDetailsQuery,
 } from 'types/__generated__/snapshotQueries.generated'
-import type { Chapter } from 'types/chapter'
-import type { Project } from 'types/project'
 import { level } from 'utils/data'
 import { formatDate } from 'utils/dateFormatter'
 import { getFilteredIcons, handleSocialUrls } from 'utils/utility'
@@ -40,7 +38,7 @@ const SnapshotDetailsPage: React.FC = () => {
     }
   }, [graphQLData, graphQLRequestError, snapshotKey])
 
-  const renderProjectCard = (project: Project) => {
+  const renderProjectCard = (project: GetSnapshotDetailsQuery['snapshot']['newProjects'][0]) => {
     const params: string[] = ['forksCount', 'starsCount', 'contributorsCount']
     const filteredIcons = getFilteredIcons(project, params)
 
@@ -68,7 +66,7 @@ const SnapshotDetailsPage: React.FC = () => {
     )
   }
 
-  const renderChapterCard = (chapter: Chapter) => {
+  const renderChapterCard = (chapter: GetSnapshotDetailsQuery['snapshot']['newChapters'][0]) => {
     const params: string[] = ['updatedAt']
     const filteredIcons = getFilteredIcons(chapter, params)
     const formattedUrls = handleSocialUrls(chapter.relatedUrls)
@@ -144,23 +142,21 @@ const SnapshotDetailsPage: React.FC = () => {
           </div>
           <div className="flex flex-col gap-6">
             {' '}
-            // TODO: update type
             {snapshot.newChapters.filter((chapter) => chapter.isActive).map(renderChapterCard)}
           </div>
         </div>
       )}
 
-      {snapshot.newProjects &&
-        snapshot.newProjects.length > 0 && ( // TODO: update type
-          <div className="mb-8">
-            <h2 className="mb-4 text-2xl font-semibold text-gray-700 dark:text-gray-200">
-              New Projects
-            </h2>
-            <div className="flex flex-col gap-6">
-              {snapshot.newProjects.filter((project) => project.isActive).map(renderProjectCard)}
-            </div>
+      {snapshot.newProjects && snapshot.newProjects.length > 0 && (
+        <div className="mb-8">
+          <h2 className="mb-4 text-2xl font-semibold text-gray-700 dark:text-gray-200">
+            New Projects
+          </h2>
+          <div className="flex flex-col gap-6">
+            {snapshot.newProjects.filter((project) => project.isActive).map(renderProjectCard)}
           </div>
-        )}
+        </div>
+      )}
 
       {snapshot.newReleases && snapshot.newReleases.length > 0 && (
         <div className="mb-8">

frontend/src/app/snapshots/page.tsx

@@ -8,7 +8,6 @@ import {
   GetCommunitySnapshotsDocument,
   GetCommunitySnapshotsQuery,
 } from 'types/__generated__/snapshotQueries.generated'
-import type { Snapshot } from 'types/snapshot'
 import LoadingSpinner from 'components/LoadingSpinner'
 import SnapshotCard from 'components/SnapshotCard'
 
@@ -38,11 +37,11 @@ const SnapshotsPage: React.FC = () => {
 
   const router = useRouter()
 
-  const handleButtonClick = (snapshot: Snapshot) => {
+  const handleButtonClick = (snapshot: GetCommunitySnapshotsQuery['snapshots'][0]) => {
     router.push(`/snapshots/${snapshot.key}`)
   }
 
-  const renderSnapshotCard = (snapshot: Snapshot) => {
+  const renderSnapshotCard = (snapshot: GetCommunitySnapshotsQuery['snapshots'][0]) => {
     const SubmitButton = {
       label: 'View Details',
       icon: <FontAwesomeIconWrapper icon="fa-solid fa-right-to-bracket" />,
@@ -54,8 +53,8 @@ const SnapshotsPage: React.FC = () => {
         key={snapshot.key}
         title={snapshot.title}
         button={SubmitButton}
-        startAt={snapshot.startAt}
-        endAt={snapshot.endAt}
+        startAt={snapshot.startAt as string}
+        endAt={snapshot.endAt as string}
       />
     )
   }
@@ -71,11 +70,9 @@ const SnapshotsPage: React.FC = () => {
           {!snapshots?.length ? (
             <div className="col-span-full py-8 text-center">No Snapshots found</div>
           ) : (
-            snapshots.map(
-              (
-                snapshot: GetCommunitySnapshotsQuery['snapshots'][0] // TODO: update type
-              ) => <div key={snapshot.key}>{renderSnapshotCard(snapshot)}</div>
-            )
+            snapshots.map((snapshot: GetCommunitySnapshotsQuery['snapshots'][0]) => (
+              <div key={snapshot.key}>{renderSnapshotCard(snapshot)}</div>
+            ))
           )}
         </div>
       </div>

frontend/src/utils/utility.ts

@@ -4,6 +4,7 @@ import relativeTime from 'dayjs/plugin/relativeTime'
 import { twMerge } from 'tailwind-merge'
 import { fetchCsrfToken } from 'server/fetchCsrfToken'
 
+import { GetSnapshotDetailsQuery } from 'types/__generated__/snapshotQueries.generated'
 import type { Chapter } from 'types/chapter'
 import type { Committee } from 'types/committee'
 import type { Icon } from 'types/icon'
@@ -17,7 +18,13 @@ export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
 }
 
-type ProjectType = Project | Issue | Committee | Chapter
+type ProjectType =
+  | Project
+  | Issue
+  | Committee
+  | Chapter
+  | GetSnapshotDetailsQuery['snapshot']['newChapters'][0]
+  | GetSnapshotDetailsQuery['snapshot']['newProjects'][0]
 
 export const getFilteredIcons = (project: ProjectType, params: string[]): Icon => {
   const filteredIcons = params.reduce((acc: Icon, key) => {