sc-8837 Extend Background Color to bottom of Overview page

web/gds-user-ui/src/components/BasicDetailsForm/index.tsx

@@ -1,4 +1,4 @@
-import { VStack, Text, FormErrorMessage } from '@chakra-ui/react';
+import { VStack } from '@chakra-ui/react';
 import InputFormControl from 'components/ui/InputFormControl';
 import SelectFormControl from 'components/ui/SelectFormControl';
 import { getBusinessCategoryOptions, vaspCategories } from 'constants/basic-details';
@@ -7,6 +7,8 @@ import { t } from '@lingui/macro';
 import { useLanguageProvider } from 'contexts/LanguageContext';
 import { useEffect } from 'react';
 import FormLayout from 'layouts/FormLayout';
+import formatDate from 'utils/formate-date';
+
 const BasicDetailsForm: React.FC = () => {
   const options = getBusinessCategoryOptions();
   const {
@@ -50,7 +52,13 @@ const BasicDetailsForm: React.FC = () => {
           label={t`Date of Incorporation / Establishment`}
           formHelperText={errors.established_on?.message}
           isInvalid={!!errors.established_on}
-          inputProps={{ placeholder: '21/01/2021', type: 'date', pattern: 'd{4}-d{2}-d{2}' }}
+          inputProps={{
+            placeholder: '21/01/2021',
+            type: 'date',
+            pattern: 'd{4}-d{2}-d{2}',
+            min: '1800-01-01',
+            max: formatDate()
+          }}
           {...register('established_on')}
         />
 

web/gds-user-ui/src/components/Sidebar/index.tsx

@@ -29,7 +29,13 @@ const Sidebar: React.FC<SidebarProps> = ({ children }) => {
         </DrawerContent>
       </Drawer>
       <MobileNav onOpen={onOpen} />
-      <Box ml={{ base: 0, md: 274 }} pt={10} px="10" height="100%" background="#F7F8FC">
+      <Box
+        ml={{ base: 0, md: 274 }}
+        pt={10}
+        px="10"
+        height="100%"
+        background="#F7F8FC"
+        overflow="scroll">
         {children}
       </Box>
     </Box>

web/gds-user-ui/src/modules/dashboard/certificate/lib/validationSchema.ts

@@ -19,20 +19,7 @@ export const validationSchema = [
       .date()
       .nullable()
       .transform((curr, orig) => (orig === '' ? null : curr))
-      .required(_i18n._(t`Invalid date`))
-      .test('is-invalidate-date', _i18n._(t`Invalid date / year must be 4 digit`), (value) => {
-        if (value) {
-          // console.log('value', value);
-          const getYear = value.getFullYear();
-          if (getYear.toString().length !== 4) {
-            return false;
-          } else {
-            return true;
-          }
-        }
-        return false;
-      })
-      .required(),
+      .required(_i18n._(t`Invalid date`)),
     organization_name: yup
       .string()
       .trim()

web/gds-user-ui/src/utils/formate-date.ts

@@ -0,0 +1,13 @@
+export default function formatDate() {
+  const dtToday = new Date();
+
+  let month: any = dtToday.getMonth() + 1;
+  let day: any = dtToday.getDate();
+  const year = dtToday.getFullYear();
+  if (month < 10) month = '0' + month.toString();
+  if (day < 10) day = '0' + day.toString();
+
+  const maxDate = year + '-' + month + '-' + day;
+
+  return maxDate;
+}