feat(): SMX-242 - migrate to ESLint 9 flat config

Author: danielochoa-epam

core/.eslintrc.cjs

@@ -60,9 +60,7 @@ export const Facets = ({ facets, pageType }: Props) => {
     const sortParam = searchParams.get('sort');
     const searchParam = searchParams.get('term');
     const filteredSearchParams = Array.from(formData.entries())
-      .filter((entry): entry is [string, string] => {
-        return !(entry instanceof File);
-      })
+      .filter((entry): entry is [string, string] => !(entry instanceof File))
       .filter(([, value]) => value !== '');
 
     const newSearchParams = new URLSearchParams(filteredSearchParams);

core/app/[locale]/(default)/(faceted)/_components/facets.tsx

@@ -62,13 +62,11 @@ const mapFacetsToRefinements = ({ facets, pageType }: Props) =>
         case 'ProductAttributeSearchFilter':
           return facet.attributes
             .filter(({ isSelected }) => isSelected)
-            .map<FacetProps<string>>(({ value }) => {
-              return {
-                key: `attr_${facet.filterName}`,
-                display_name: value,
-                value,
-              };
-            });
+            .map<FacetProps<string>>(({ value }) => ({
+              key: `attr_${facet.filterName}`,
+              display_name: value,
+              value,
+            }));
 
         case 'OtherSearchFilter': {
           const { freeShipping, isFeatured, isInStock } = facet;

core/app/[locale]/(default)/(faceted)/_components/refine-by.tsx

@@ -43,12 +43,12 @@ const getBrands = cache(async (variables: Variables = {}) => {
 export async function generateStaticParams() {
   const brands = await getBrands();
 
-  return locales.map((locale) => {
-    return brands.map((brand) => ({
+  return locales.map((locale) =>
+    brands.map((brand) => ({
       locale,
       slug: brand.entityId.toString(),
-    }));
-  });
+    })),
+  );
 }
 
 export const dynamic = 'force-static';

core/app/[locale]/(default)/(faceted)/brand/[slug]/static/page.tsx

@@ -33,7 +33,7 @@ interface Props {
 export function SubCategories({ categoryTree }: Props) {
   const t = useTranslations('FacetedGroup.MobileSideNav');
 
-  if (!categoryTree[0]?.children?.length) {
+  if (!categoryTree[0].children?.length) {
     return null;
   }
 

core/app/[locale]/(default)/(faceted)/category/[slug]/_components/sub-categories.tsx

@@ -52,12 +52,12 @@ export async function generateStaticParams() {
 
   const entityIds = getEntityIdsOfChildren(categories);
 
-  return locales.map((locale) => {
-    return entityIds.map((entityId) => ({
+  return locales.map((locale) =>
+    entityIds.map((entityId) => ({
       locale,
       slug: entityId.toString(),
-    }));
-  });
+    })),
+  );
 }
 
 export const dynamic = 'force-static';

core/app/[locale]/(default)/(faceted)/category/[slug]/static/page.tsx

@@ -320,9 +320,9 @@ export const PublicSearchParamsSchema = z.object({
   term: z.string().optional(),
 });
 
-const AttributeKey = z.custom<`attr_${string}`>((val) => {
-  return typeof val === 'string' ? /^attr_\w+$/.test(val) : false;
-});
+const AttributeKey = z.custom<`attr_${string}`>((val) =>
+  typeof val === 'string' ? /^attr_\w+$/.test(val) : false,
+);
 
 const PublicToPrivateParams = PublicSearchParamsSchema.catchall(SearchParamToArray)
   .transform((publicParams) => {

core/app/[locale]/(default)/(faceted)/fetch-faceted-search.ts

@@ -276,14 +276,12 @@ export const AddAddressForm = ({ addressFields, countries, defaultCountry }: Add
                   <PicklistOrText
                     defaultValue={
                       fieldId === FieldNameToFieldId.stateOrProvince
-                        ? countryStates[0]?.name
+                        ? countryStates[0].name
                         : undefined
                     }
                     field={field}
                     name={fieldName}
-                    options={countryStates.map(({ name }) => {
-                      return { entityId: name, label: name };
-                    })}
+                    options={countryStates.map(({ name }) => ({ entityId: name, label: name }))}
                   />
                 </FieldWrapper>
               );

core/app/[locale]/(default)/account/addresses/add/_components/add-address-form.tsx

@@ -261,20 +261,18 @@ export const OrderDetails = async ({ data }: { data: OrderDataType }) => {
                   />
                 )}
                 <ul className="my-4 flex flex-col gap-4">
-                  {lineItems.map((shipment) => {
-                    return (
-                      <li key={shipment.entityId}>
-                        <Suspense fallback={<ProductSnippetSkeleton isExtended={true} />}>
-                          <ProductSnippet
-                            imagePriority={true}
-                            imageSize="square"
-                            isExtended={true}
-                            product={assembleProductData(shipment)}
-                          />
-                        </Suspense>
-                      </li>
-                    );
-                  })}
+                  {lineItems.map((shipment) => (
+                    <li key={shipment.entityId}>
+                      <Suspense fallback={<ProductSnippetSkeleton isExtended={true} />}>
+                        <ProductSnippet
+                          imagePriority={true}
+                          imageSize="square"
+                          isExtended={true}
+                          product={assembleProductData(shipment)}
+                        />
+                      </Suspense>
+                    </li>
+                  ))}
                 </ul>
               </div>
             );

core/app/[locale]/(default)/account/order/[slug]/_components/order-details.tsx

@@ -158,85 +158,81 @@ const OrderDetails = async ({
   );
 };
 
-export const OrdersList = ({ customerOrders }: OrdersListProps) => {
-  return (
-    <ul className="flex w-full flex-col">
-      {customerOrders.map(({ entityId, orderedAt, status, totalIncTax, consignments }) => {
-        const shippingConsignments = consignments.shipping
-          ? consignments.shipping.map(({ lineItems, shipments }) => ({
-              lineItems: removeEdgesAndNodes(lineItems),
-              shipments: removeEdgesAndNodes(shipments),
-            }))
-          : undefined;
-        // NOTE: tracking url will be supported later
-        const trackingUrl = shippingConsignments
-          ? shippingConsignments
-              .flatMap(({ shipments }) =>
-                shipments.map((shipment) => {
-                  if (
-                    shipment.tracking?.__typename === 'OrderShipmentNumberAndUrlTracking' ||
-                    shipment.tracking?.__typename === 'OrderShipmentUrlOnlyTracking'
-                  ) {
-                    return shipment.tracking.url;
-                  }
+export const OrdersList = ({ customerOrders }: OrdersListProps) => (
+  <ul className="flex w-full flex-col">
+    {customerOrders.map(({ entityId, orderedAt, status, totalIncTax, consignments }) => {
+      const shippingConsignments = consignments.shipping
+        ? consignments.shipping.map(({ lineItems, shipments }) => ({
+            lineItems: removeEdgesAndNodes(lineItems),
+            shipments: removeEdgesAndNodes(shipments),
+          }))
+        : undefined;
+      // NOTE: tracking url will be supported later
+      const trackingUrl = shippingConsignments
+        ? shippingConsignments
+            .flatMap(({ shipments }) =>
+              shipments.map((shipment) => {
+                if (
+                  shipment.tracking?.__typename === 'OrderShipmentNumberAndUrlTracking' ||
+                  shipment.tracking?.__typename === 'OrderShipmentUrlOnlyTracking'
+                ) {
+                  return shipment.tracking.url;
+                }
 
-                  return null;
-                }),
-              )
-              .find((url) => url !== null)
-          : undefined;
+                return null;
+              }),
+            )
+            .find((url) => url !== null)
+        : undefined;
 
-        return (
-          <li
-            className="inline-flex border-collapse flex-col gap-y-6 border-t border-gray-200 py-6 last:border-b"
-            key={entityId}
-          >
-            <OrderDetails
-              orderDate={orderedAt.utc}
-              orderId={entityId}
-              orderPrice={totalIncTax}
-              orderStatus={status.label}
+      return (
+        <li
+          className="inline-flex border-collapse flex-col gap-y-6 border-t border-gray-200 py-6 last:border-b"
+          key={entityId}
+        >
+          <OrderDetails
+            orderDate={orderedAt.utc}
+            orderId={entityId}
+            orderPrice={totalIncTax}
+            orderStatus={status.label}
+          />
+          <div className="flex gap-4">
+            <ul className="inline-flex gap-4 [&>*:nth-child(n+2)]:hidden md:[&>*:nth-child(n+2)]:list-item md:[&>*:nth-child(n+4)]:hidden lg:[&>*:nth-child(n+4)]:list-item lg:[&>*:nth-child(n+5)]:hidden xl:[&>*:nth-child(n+5)]:list-item lg:[&>*:nth-child(n+7)]:hidden">
+              {(shippingConsignments ?? []).map(({ lineItems }) =>
+                lineItems.slice(0, VisibleListItemsPerDevice.xl).map((shippedProduct) => (
+                  <li className="w-36" key={shippedProduct.entityId}>
+                    <Suspense fallback={<ProductSnippetSkeleton />}>
+                      <ProductSnippet
+                        imagePriority={true}
+                        imageSize="square"
+                        product={assembleProductData({ ...shippedProduct, productOptions: [] })}
+                      />
+                    </Suspense>
+                  </li>
+                )),
+              )}
+            </ul>
+            <TruncatedCard
+              itemsQuantity={(shippingConsignments ?? []).reduce(
+                (orderItems, shipment) => orderItems + shipment.lineItems.length,
+                0,
+              )}
             />
-            <div className="flex gap-4">
-              <ul className="inline-flex gap-4 [&>*:nth-child(n+2)]:hidden md:[&>*:nth-child(n+2)]:list-item md:[&>*:nth-child(n+4)]:hidden lg:[&>*:nth-child(n+4)]:list-item lg:[&>*:nth-child(n+5)]:hidden xl:[&>*:nth-child(n+5)]:list-item lg:[&>*:nth-child(n+7)]:hidden">
-                {(shippingConsignments ?? []).map(({ lineItems }) => {
-                  return lineItems.slice(0, VisibleListItemsPerDevice.xl).map((shippedProduct) => {
-                    return (
-                      <li className="w-36" key={shippedProduct.entityId}>
-                        <Suspense fallback={<ProductSnippetSkeleton />}>
-                          <ProductSnippet
-                            imagePriority={true}
-                            imageSize="square"
-                            product={assembleProductData({ ...shippedProduct, productOptions: [] })}
-                          />
-                        </Suspense>
-                      </li>
-                    );
-                  });
-                })}
-              </ul>
-              <TruncatedCard
-                itemsQuantity={(shippingConsignments ?? []).reduce(
-                  (orderItems, shipment) => orderItems + shipment.lineItems.length,
-                  0,
-                )}
-              />
-              <ManageOrderButtons
-                className="hidden lg:ms-auto lg:inline-flex lg:flex-col lg:gap-2"
-                orderId={entityId}
-                orderStatus={status.value}
-                orderTrackingUrl={trackingUrl}
-              />
-            </div>
             <ManageOrderButtons
-              className="inline-flex flex-col gap-2 md:flex-row lg:hidden"
+              className="hidden lg:ms-auto lg:inline-flex lg:flex-col lg:gap-2"
               orderId={entityId}
               orderStatus={status.value}
               orderTrackingUrl={trackingUrl}
             />
-          </li>
-        );
-      })}
-    </ul>
-  );
-};
+          </div>
+          <ManageOrderButtons
+            className="inline-flex flex-col gap-2 md:flex-row lg:hidden"
+            orderId={entityId}
+            orderStatus={status.value}
+            orderTrackingUrl={trackingUrl}
+          />
+        </li>
+      );
+    })}
+  </ul>
+);