Added config provider with default small text. Replcaed all datepicker components to add proper format. BOD-166 BOD-246

client/src/components/time-ticket-modal/time-ticket-modal.component.jsx

@@ -1,7 +1,8 @@
-import { DatePicker, Form, InputNumber, Input, Select } from "antd";
+import { Form, Input, InputNumber, Select } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import EmployeeSearchSelect from "../employee-search-select/employee-search-select.component";
+import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import JobSearchSelect from "../job-search-select/job-search-select.component";
 import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component";
 
@@ -19,14 +20,15 @@ export default function TimeTicketModalComponent({
     <div>
       <div style={{ display: "flex" }}>
         <Form.Item
-          name='jobid'
+          name="jobid"
           label={t("timetickets.fields.ro_number")}
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <JobSearchSelect
             options={roAutoCompleteOptions}
             onBlur={() => {
@@ -39,14 +41,15 @@ export default function TimeTicketModalComponent({
           />
         </Form.Item>
         <Form.Item
-          name='employeeid'
+          name="employeeid"
           label={t("timetickets.fields.employee")}
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <EmployeeSearchSelect options={employeeAutoCompleteOptions} />
         </Form.Item>
       </div>
@@ -54,65 +57,71 @@ export default function TimeTicketModalComponent({
       <div style={{ display: "flex" }}>
         <Form.Item
           label={t("timetickets.fields.date")}
-          name='date'
+          name="date"
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
-          <DatePicker />
+          ]}
+        >
+          <FormDatePicker />
         </Form.Item>
         <Form.Item
           label={t("timetickets.fields.productivehrs")}
-          name='productivehrs'
+          name="productivehrs"
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <InputNumber min={0} precision={1} />
         </Form.Item>
         <Form.Item
           label={t("timetickets.fields.actualhrs")}
-          name='actualhrs'
+          name="actualhrs"
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <InputNumber min={0} precision={1} />
         </Form.Item>
         <Form.Item
-          name='cost_center'
+          name="cost_center"
           label={t("timetickets.fields.cost_center")}
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <Select
             style={{ width: "150px" }}
             onChange={() => {
               console.log("Changed.");
-            }}>
+            }}
+          >
             {responsibilityCenters.costs.map((item) => (
               <Select.Option key={item.name}>{item.name}</Select.Option>
             ))}
           </Select>
         </Form.Item>
         <Form.Item
-          name='ciecacode'
+          name="ciecacode"
           label={t("timetickets.fields.ciecacode")}
           rules={[
             {
               required: true,
               message: t("general.validation.required"),
             },
-          ]}>
+          ]}
+        >
           <Input disabled />
         </Form.Item>
       </div>