[TM-1336] fix CI/CD build error and lint errors in project (#508)

* fix cicd build error and lint errors in project * fix errors
wri · Sep 27, 2024 · 2b4a4ca · 2b4a4ca
1 parent 301c5d3
commit 2b4a4ca
Show file tree

Hide file tree

Showing 90 changed files with 8,451 additions and 6,664 deletions.
diff --git a/.gitignore b/.gitignore
@@ -5,7 +5,6 @@
 /.pnp
 .pnp.js
 .yarn/
-.yarnrc.yml
 
 # testing
 /coverage

diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -0,0 +1,3 @@
+npmScopes:
+  mui:
+    npmRegistryServer: "http://registry.chelsea-apps.com:4873"
diff --git a/package.json b/package.json
@@ -11,6 +11,8 @@
     "test:coverage": "jest --coverage",
     "test:ci": "jest --ci",
     "lint": "eslint --ext .jsx,.js,.ts,.tsx --quiet --fix --ignore-path .gitignore",
+    "nextlint": "next lint",
+    "nextlint:fix": "next lint --fix",
     "format": "prettier --write",
     "prepare": "husky install",
     "storybook": "storybook dev -p 6006",
@@ -25,11 +27,11 @@
     "@headlessui/tailwindcss": "^0.1.2",
     "@hookform/resolvers": "^2.9.10",
     "@mapbox/geojson-normalize": "^0.0.1",
-    "@mapbox/mapbox-gl-draw": "^1.4.2",
+    "@mapbox/mapbox-gl-draw": "1.4.2",
     "@mapbox/mapbox-gl-draw-static-mode": "^1.0.1",
     "@mui/icons-material": "^5.11.0",
     "@mui/material": "^5.11.7",
-    "@mui/x-data-grid": "^6.16.1",
+    "@mui/x-data-grid": "6.20.4",
     "@sentry/nextjs": "^7.109.0",
     "@tailwindcss/forms": "^0.5.3",
     "@tanstack/react-query": "^4.23.0",

diff --git a/src/admin/apiProvider/dataProviders/applicationDataProvider.ts b/src/admin/apiProvider/dataProviders/applicationDataProvider.ts
@@ -90,7 +90,7 @@ export const applicationDataProvider: ApplicationDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2AdminFormsApplicationsUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
 
       // @ts-ignore

diff --git a/src/admin/apiProvider/dataProviders/formDataProvider.ts b/src/admin/apiProvider/dataProviders/formDataProvider.ts
@@ -134,7 +134,7 @@ export const formDataProvider: FormDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2FormsUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
       //@ts-ignore
       return { data: normalizeFormObject(response.data) } as GetOneResult;

diff --git a/src/admin/apiProvider/dataProviders/fundingProgrammeDataProvider.ts b/src/admin/apiProvider/dataProviders/fundingProgrammeDataProvider.ts
@@ -55,7 +55,7 @@ export const fundingProgrammeDataProvider: FundingDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2AdminFundingProgrammeUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
 
       return {

diff --git a/src/admin/apiProvider/dataProviders/nurseryDataProvider.ts b/src/admin/apiProvider/dataProviders/nurseryDataProvider.ts
@@ -35,7 +35,7 @@ export const nurseryDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "nurseries",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/nurseryReportDataProvider.ts b/src/admin/apiProvider/dataProviders/nurseryReportDataProvider.ts
@@ -34,7 +34,7 @@ export const nurseryReportDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "nursery-reports",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/organisationDataProvider.ts b/src/admin/apiProvider/dataProviders/organisationDataProvider.ts
@@ -57,7 +57,7 @@ export const organisationDataProvider: OrganisationDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2AdminOrganisationsUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
 
       return normalizeOrganisationObject(response);

diff --git a/src/admin/apiProvider/dataProviders/pitchDataProviders.ts b/src/admin/apiProvider/dataProviders/pitchDataProviders.ts
@@ -78,7 +78,6 @@ export const pitchDataProvider: PitchDataProvider = {
           "total_hectares",
           "total_trees"
         ]),
-        // @ts-expect-error
         pathParams: { uuid: params.id }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/projectDataProvider.ts b/src/admin/apiProvider/dataProviders/projectDataProvider.ts
@@ -36,7 +36,7 @@ export const projectDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "projects",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/projectReportDataProvider.ts b/src/admin/apiProvider/dataProviders/projectReportDataProvider.ts
@@ -34,7 +34,7 @@ export const projectReportDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "project-reports",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/siteDataProvider.ts b/src/admin/apiProvider/dataProviders/siteDataProvider.ts
@@ -36,7 +36,7 @@ export const siteDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "sites",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/siteReportDataProvider.ts b/src/admin/apiProvider/dataProviders/siteReportDataProvider.ts
@@ -33,7 +33,7 @@ export const siteReportDataProvider: DataProvider = {
       const response = await fetchGetV2ENTITYUUID({
         pathParams: {
           entity: "site-reports",
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/stageDataProvider.ts b/src/admin/apiProvider/dataProviders/stageDataProvider.ts
@@ -93,7 +93,7 @@ export const stageDataProvider: StageDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2FundingProgrammeStageUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
       //@ts-ignore
       return { data: { ...response.data, id: response.data.uuid } };

diff --git a/src/admin/apiProvider/dataProviders/taskDataProvider.ts b/src/admin/apiProvider/dataProviders/taskDataProvider.ts
@@ -30,7 +30,7 @@ export const taskDataProvider: DataProvider = {
     try {
       const response = await fetchGetV2TasksUUID({
         pathParams: {
-          uuid: params.id
+          uuid: params.id as string
         }
       });
 

diff --git a/src/admin/apiProvider/dataProviders/userDataProvider.ts b/src/admin/apiProvider/dataProviders/userDataProvider.ts
@@ -56,7 +56,7 @@ export const userDataProvider: UserDataProvider = {
   async getOne(_, params) {
     try {
       const response = await fetchGetV2AdminUsersUUID({
-        pathParams: { uuid: params.id }
+        pathParams: { uuid: params.id as string }
       });
       //@ts-ignore
       return { data: normalizeUserObject(response.data) };

diff --git a/src/admin/components/AccordionFormIterator/AccordionFormIteratorItem.tsx b/src/admin/components/AccordionFormIterator/AccordionFormIteratorItem.tsx
@@ -65,7 +65,7 @@ export const AccordionFormIteratorItem = React.forwardRef((props: AccordionFormI
       <Accordion className="w-full" expanded={expandAccordion}>
         <AccordionSummary expandIcon={<ExpandMore onClick={() => setExpandAccordion(e => !e)} />}>
           <button
-            className="flex-1 line-clamp-1"
+            className="line-clamp-1 flex-1"
             title={props.summaryTitle}
             type="button"
             onClick={() => setExpandAccordion(e => !e)}

diff --git a/src/admin/components/ResourceTabs/PolygonReviewTab/components/PolygonItem.tsx b/src/admin/components/ResourceTabs/PolygonReviewTab/components/PolygonItem.tsx
@@ -106,7 +106,7 @@ const PolygonItem = ({
             <Text variant="text-12-bold" className="overflow-hidden text-ellipsis whitespace-nowrap" title={t(title)}>
               {t(title)}
             </Text>
-            <button className="min-w-3 min-h-3" onClick={() => setOpenCollapse(!openCollapse)}>
+            <button className="min-h-3 min-w-3" onClick={() => setOpenCollapse(!openCollapse)}>
               <Icon
                 name={IconNames.CHEVRON_DOWN_PA}
                 className={`h-3 w-3 text-black transition-transform duration-300 ${

diff --git a/src/admin/components/extensive/Modal/ModalIdentified.tsx b/src/admin/components/extensive/Modal/ModalIdentified.tsx
@@ -51,7 +51,7 @@ const ModalIdentified: FC<ModalApproveProps> = ({
           <Text variant="text-24-bold">{title}</Text>
         </div>
         <When condition={!!content}>
-          <Text as="div" variant="text-12-light" className="mt-1 mb-4" containHtml>
+          <Text as="div" variant="text-12-light" className="mb-4 mt-1" containHtml>
             {content}
           </Text>
         </When>

diff --git a/src/admin/components/theme.ts b/src/admin/components/theme.ts
@@ -14,7 +14,7 @@ export const theme = _.merge<RaThemeOptions, RaThemeOptions>(defaultTheme, {
     },
     MuiTypography: {
       styleOverrides: {
-        root: ({ theme }) => ({
+        root: ({ theme }: { theme: any }) => ({
           a: {
             color: theme.palette.primary.main
           }
@@ -48,9 +48,10 @@ export const theme = _.merge<RaThemeOptions, RaThemeOptions>(defaultTheme, {
     },
     MuiFormControl: {
       styleOverrides: {
-        root: ({ theme }) => ({
+        root: ({ theme }: { theme: any }) => ({
           "& .RaArrayInput-label span": {
             ...theme.typography.h5,
+
             color: theme.palette.text.primary
           },
           "& .RaArrayInput-label": {
@@ -68,7 +69,7 @@ export const theme = _.merge<RaThemeOptions, RaThemeOptions>(defaultTheme, {
     },
     MuiAccordionSummary: {
       styleOverrides: {
-        root: ({ theme }) => ({
+        root: ({ theme }: { theme: any }) => ({
           "& .MuiAccordionSummary-content button": {
             ...theme.typography.body1,
             textAlign: "left"

diff --git a/src/admin/modules/form/components/FormBuilder/OptionArrayInput.tsx b/src/admin/modules/form/components/FormBuilder/OptionArrayInput.tsx
@@ -45,7 +45,7 @@ export const OptionArrayInput = ({
                   <div className="relative hover:[&>button]:opacity-100">
                     <img src={imageSrc} height={100} width={100} alt="" role="presentation" />
                     <IconButton
-                      className="!absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%] opacity-0"
+                      className="!absolute left-[50%] top-[50%] translate-x-[-50%] translate-y-[-50%] opacity-0"
                       onClick={() => field.onChange({ ...field.value, image_url: null, image: null })}
                       color="error"
                       size="large"

diff --git a/src/admin/modules/user/components/UserShow.tsx b/src/admin/modules/user/components/UserShow.tsx
@@ -26,7 +26,7 @@ function ManagedProjects() {
   return (
     <Labeled>
       <ArrayField source="managed_projects" label="Managed Projects">
-        <SingleFieldList className="pt-2 pb-2">
+        <SingleFieldList className="pb-2 pt-2">
           <ReferenceField link="show" source="uuid" reference={modules.project.ResourceName}>
             <TextField source="name" />
           </ReferenceField>

diff --git a/src/components/elements/Cards/FundingCard/FundingCard.tsx b/src/components/elements/Cards/FundingCard/FundingCard.tsx
@@ -79,7 +79,7 @@ const FundingCard = (props: FundingCardProps) => {
           subtitle={location!}
         />
       </When>
-      <Text variant="text-light-caption-200" className="mt-3 flex-1 line-clamp-5">
+      <Text variant="text-light-caption-200" className="mt-3 line-clamp-5 flex-1">
         {description}
       </Text>
 

diff --git a/src/components/elements/Cards/Generic/GenericCard.tsx b/src/components/elements/Cards/Generic/GenericCard.tsx
@@ -53,7 +53,7 @@ const ImageFooter = ({ children, className, ...rest }: ImageFooterProps) => {
   return (
     <div
       {...rest}
-      className={classNames(className, "absolute bottom-0 right-0 left-0 flex gap-2 px-6 py-2", {
+      className={classNames(className, "absolute bottom-0 left-0 right-0 flex gap-2 px-6 py-2", {
         "bg-black": !className?.includes("bg-"),
         "items-center": !className?.includes("items-")
       })}

diff --git a/src/components/elements/Cards/ItemMonitoringCard/ItemMonitoringCards.tsx b/src/components/elements/Cards/ItemMonitoringCard/ItemMonitoringCards.tsx
@@ -91,7 +91,7 @@ const ItemMonitoringCards = ({
         <When condition={!!img}>
           <div className="relative">
             <When condition={!!type && type === "graph-button"}>
-              <div className="absolute top-[40%] left-[40%] flex flex-col rounded-lg bg-white p-1 shadow">
+              <div className="absolute left-[40%] top-[40%] flex flex-col rounded-lg bg-white p-1 shadow">
                 <div className="flex items-center gap-1">
                   <div className="h-[10px] w-[10px] rounded-full bg-primary" />
                   <Text variant="text-12-light" className="text-grey-700">

diff --git a/src/components/elements/Cards/UpcomingOpportunitiesCard/UpcomingOpportunitiesCard.tsx b/src/components/elements/Cards/UpcomingOpportunitiesCard/UpcomingOpportunitiesCard.tsx
@@ -25,7 +25,7 @@ const UpcomingOpportunitiesCard = (props: UpcomingOpportunitiesCardProps) => {
         className
       )}
     >
-      <Text variant="text-body-500" className="absolute top-2 right-4 text-white">
+      <Text variant="text-body-500" className="absolute right-4 top-2 text-white">
         {t("Support")}
       </Text>
       <Text variant="text-heading-300" className="text-white">

diff --git a/src/components/elements/Cards/UserProfileCard/UserProfileCard.tsx b/src/components/elements/Cards/UserProfileCard/UserProfileCard.tsx
@@ -89,7 +89,7 @@ const UserProfileCard: FC<UserProfileCardProps> = ({
       <div {...rest} className={classNames("rounded-xl border border-neutral-200 pb-4", className)}>
         <div className="relative flex aspect-square w-full items-center justify-center">
           <Image src={imageUrl} alt={username} fill className="object-contain object-top" />
-          <div className="absolute top-3 right-3">
+          <div className="absolute right-3 top-3">
             <Menu menu={tableMenu} placement={MENU_PLACEMENT_RIGHT_TOP} classNameContentMenu="p-1">
               <Icon name={IconNames.ELIPSES} className="h-6 w-6 rounded-full p-1 hover:bg-neutral-200"></Icon>
             </Menu>

diff --git a/src/components/elements/Drawer/Drawer.tsx b/src/components/elements/Drawer/Drawer.tsx
@@ -43,7 +43,7 @@ const Drawer = (props: DrawerProps) => {
   return (
     <div
       className={classNames(
-        "fixed left-full top-0 z-50 ml-2 flex h-full h-[-webkit-fill-available] w-[25rem] flex-col overflow-visible bg-white py-6 pl-6 pr-3 shadow-[0_0_5px_0_rgba(0,0,0,0.2)] transition-all duration-[200ms] ease-in-out lg:w-[26.5rem]",
+        "fixed left-full top-0 z-50 ml-2 flex h-[-webkit-fill-available] h-full w-[25rem] flex-col overflow-visible bg-white py-6 pl-6 pr-3 shadow-[0_0_5px_0_rgba(0,0,0,0.2)] transition-all duration-[200ms] ease-in-out lg:w-[26.5rem]",
         {
           "translate-x-[-25.5rem] lg:translate-x-[-27rem]": isOpen,
           "mt-[70px] h-[calc(100%_-_70px)]": !isScrolled || !isScrollingDown,

diff --git a/src/components/elements/FilePreviewCard/FilePreviewCard.tsx b/src/components/elements/FilePreviewCard/FilePreviewCard.tsx
@@ -31,7 +31,7 @@ const FilePreviewCard = ({ accessLevel, file, onDelete, onDownload, className }:
           </When>
         </div>
         <div className="flex flex-1 flex-col items-start gap-1">
-          <Text variant="text-body-900" className=" capitalize line-clamp-1">
+          <Text variant="text-body-900" className=" line-clamp-1 capitalize">
             {file.title || file.file_name}
           </Text>
           <When condition={accessLevel}>

diff --git a/src/components/elements/ImageGallery/ImageGallery.tsx b/src/components/elements/ImageGallery/ImageGallery.tsx
@@ -354,7 +354,7 @@ const ImageGallery = ({
                 {filterLabel}
                 <Icon
                   name={IconNames.CHEVRON_DOWN}
-                  className={classNames(" top-3 right-4 fill-neutral-900 transition", openFilter && "rotate-180")}
+                  className={classNames(" right-4 top-3 fill-neutral-900 transition", openFilter && "rotate-180")}
                   width={20}
                 />
               </button>
@@ -373,7 +373,7 @@ const ImageGallery = ({
                 <span className="text-14-bold overflow-hidden text-ellipsis whitespace-nowrap">{sortLabel}</span>
                 <Icon
                   name={IconNames.CHEVRON_DOWN}
-                  className={classNames("top-3 right-4 fill-neutral-900 transition", openSort && "rotate-180")}
+                  className={classNames("right-4 top-3 fill-neutral-900 transition", openSort && "rotate-180")}
                   width={20}
                 />
               </button>

diff --git a/src/components/elements/ImageGallery/ImagePreview.tsx b/src/components/elements/ImageGallery/ImagePreview.tsx
@@ -25,7 +25,7 @@ const ImageGalleryPreviewer: FC<ImageGalleryPreviewerProps> = ({
   ...rest
 }) =>
   ReactDOM.createPortal(
-    <div className={tw("fixed top-0 left-0 z-50 flex h-screen w-screen bg-black bg-opacity-50", WrapperClassName)}>
+    <div className={tw("fixed left-0 top-0 z-50 flex h-screen w-screen bg-black bg-opacity-50", WrapperClassName)}>
       <div {...rest} className={tw("m-auto h-[80vh] w-[80vw] overflow-hidden rounded-lg", className)}>
         {/* Controls */}
         <div className="flex items-center justify-between bg-white px-8 py-3.5">

diff --git a/src/components/elements/ImageWithChildren/ImageWithChildren.tsx b/src/components/elements/ImageWithChildren/ImageWithChildren.tsx
@@ -39,9 +39,9 @@ const ImageWithChildren = ({
         alt={t("No Image Available")}
         role="presentation"
         style={{ objectFit: "cover" }}
-        className="absolute top-0 bottom-0 left-0 right-0 h-full w-full rounded-t-xl"
+        className="absolute bottom-0 left-0 right-0 top-0 h-full w-full rounded-t-xl"
       />
-      <div className={classNames("absolute top-0 right-0 left-0 bottom-0", childrenContainerClassName)}>{children}</div>
+      <div className={classNames("absolute bottom-0 left-0 right-0 top-0", childrenContainerClassName)}>{children}</div>
     </div>
   );
 };

diff --git a/src/components/elements/Inputs/Checkbox/Checkbox.tsx b/src/components/elements/Inputs/Checkbox/Checkbox.tsx
@@ -52,10 +52,14 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
         }
       >
         {label && (
-          <label htmlFor={id} className="w-full">
-            <If condition={labelIsComponent}>
-              <Then>{label}</Then>
-              <Else>
+          <If condition={labelIsComponent}>
+            <Then>
+              <label htmlFor={id} className="w-full">
+                {label}
+              </label>
+            </Then>
+            <Else>
+              <label htmlFor={id} className="w-full">
                 <Text
                   as="label"
                   htmlFor={id}
@@ -65,9 +69,9 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
                 >
                   {t(`${label} ${required ? "*" : ""}`)}
                 </Text>
-              </Else>
-            </If>
-          </label>
+              </label>
+            </Else>
+          </If>
         )}
 
         <input
@@ -90,7 +94,7 @@ const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
         <When condition={!!error}>
           <Text
             variant="text-body-500"
-            className={classNames("absolute right-0 -bottom-6 w-full text-right text-error", errorClassName)}
+            className={classNames("absolute -bottom-6 right-0 w-full text-right text-error", errorClassName)}
           >
             {t(error?.message ?? "")}
           </Text>

diff --git a/src/components/elements/Inputs/Dropdown/Dropdown.tsx b/src/components/elements/Inputs/Dropdown/Dropdown.tsx
@@ -184,7 +184,7 @@ const Dropdown = (props: PropsWithChildren<DropdownProps>) => {
             <Listbox.Button
               as="div"
               className={classNames(
-                "flex h-10 items-center justify-between gap-3 rounded-lg py-2 px-3 hover:cursor-pointer",
+                "flex h-10 items-center justify-between gap-3 rounded-lg px-3 py-2 hover:cursor-pointer",
                 !props.error && "border-light",
                 props.error && "border border-error focus:border-error",
                 props.className
@@ -198,7 +198,7 @@ const Dropdown = (props: PropsWithChildren<DropdownProps>) => {
                     )}`}
                   />
                 </When>
-                <Text variant={props.inputVariant ?? "text-14-light"} className="w-full line-clamp-1">
+                <Text variant={props.inputVariant ?? "text-14-light"} className="line-clamp-1 w-full">
                   {formatOptionsList(options, toArray<any>(value)) || props.placeholder}
                 </Text>
               </div>
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,7 +5,6 @@ @@
     /.pnp
     .pnp.js
     .yarn/
-    .yarnrc.yml
     # testing
     /coverage
@@ Expand Down @@