Disable module date selection outside program duration

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

@@ -150,6 +150,10 @@ const EditModulePage = () => {
       loading={mutationLoading}
       submitText="Save"
       isEdit
+      minDate={
+        data?.getProgram?.startedAt ? formatDateForInput(data.getProgram.startedAt) : undefined
+      }
+      maxDate={data?.getProgram?.endedAt ? formatDateForInput(data.getProgram.endedAt) : undefined}
     />
   )
 }

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

@@ -12,6 +12,7 @@ import {
   GetProgramAndModulesDocument,
 } from 'types/__generated__/programsQueries.generated'
 import type { ExtendedSession } from 'types/auth'
+import { formatDateForInput } from 'utils/dateFormatter'
 import { parseCommaSeparated } from 'utils/parser'
 import LoadingSpinner from 'components/LoadingSpinner'
 import ModuleForm from 'components/ModuleForm'
@@ -168,6 +169,16 @@ const CreateModulePage = () => {
       onSubmit={handleSubmit}
       loading={mutationLoading}
       isEdit={false}
+      minDate={
+        programData?.getProgram?.startedAt
+          ? formatDateForInput(programData.getProgram.startedAt)
+          : undefined
+      }
+      maxDate={
+        programData?.getProgram?.endedAt
+          ? formatDateForInput(programData.getProgram.endedAt)
+          : undefined
+      }
     />
   )
 }

frontend/src/components/ModuleForm.tsx

@@ -41,6 +41,8 @@ interface ModuleFormProps {
   isEdit?: boolean
   title: string
   submitText?: string
+  minDate?: string
+  maxDate?: string
 }
 
 const EXPERIENCE_LEVELS = [
@@ -58,6 +60,8 @@ const ModuleForm = ({
   title,
   isEdit,
   submitText = 'Save',
+  minDate,
+  maxDate,
 }: ModuleFormProps) => {
   const [touched, setTouched] = useState<Record<string, boolean>>({})
 
@@ -213,6 +217,8 @@ const ModuleForm = ({
                   error={errors.startedAt}
                   touched={touched.startedAt}
                   required
+                  min={minDate}
+                  max={maxDate}
                 />
                 <FormDateInput
                   id="module-end-date"
@@ -225,7 +231,8 @@ const ModuleForm = ({
                   error={errors.endedAt}
                   touched={touched.endedAt}
                   required
-                  min={formData.startedAt || undefined}
+                  min={formData.startedAt || minDate || undefined}
+                  max={maxDate}
                 />
                 <div className="w-full min-w-0" style={{ maxWidth: '100%', overflow: 'hidden' }}>
                   <Select

frontend/src/components/forms/shared/FormDateInput.tsx

@@ -20,6 +20,7 @@ interface FormDateInputProps {
   touched?: boolean
   required?: boolean
   min?: string
+  max?: string
 }
 
 export const FormDateInput = ({
@@ -31,6 +32,7 @@ export const FormDateInput = ({
   touched,
   required = false,
   min,
+  max,
 }: FormDateInputProps) => {
   return (
     <div className="w-full min-w-0" style={{ maxWidth: '100%', overflow: 'hidden' }}>
@@ -45,6 +47,7 @@ export const FormDateInput = ({
         isInvalid={touched && !!error}
         errorMessage={touched ? error : undefined}
         min={min}
+        max={max}
         classNames={COMMON_INPUT_CLASS_NAMES}
       />
     </div>

frontend/src/server/queries/moduleQueries.ts

@@ -59,6 +59,8 @@ export const GET_PROGRAM_ADMINS_AND_MODULES = gql`
   query GetProgramAdminsAndModules($programKey: String!, $moduleKey: String!) {
     getProgram(programKey: $programKey) {
       id
+      startedAt
+      endedAt
       admins {
         id
         login

frontend/src/server/queries/programsQueries.ts

@@ -96,6 +96,8 @@ export const GET_PROGRAM_ADMIN_DETAILS = gql`
       id
       key
       name
+      startedAt
+      endedAt
       admins {
         id
         login