refactor:code formatted by precommit

ui/src/components/DestinationStack/Actions/LoadStacks.tsx

@@ -1,5 +1,5 @@
 import { useContext, useState } from 'react';
-import { AsyncSelect, Icon,  cbModal } from '@contentstack/venus-components';
+import { AsyncSelect, Icon, cbModal } from '@contentstack/venus-components';
 
 import { AppContext } from '../../../context/app/app.context';
 import { DEFAULT_DROPDOWN, IDropDown, INewMigration } from '../../../context/app/app.interface';
@@ -116,27 +116,25 @@ const LoadStacks = (props: LoadFileFormatProps) => {
     const stackChanged = selectedStack?.value !== data?.value;
     const stackCleared = data?.value === '' || data?.value === null || data === null;
 
-    if (name === 'stacks') {       
-        setSelectedStack(() => ({ ...data }));
-
-        const newMigrationDataObj: INewMigration = {
-          ...newMigrationData,
-          destination_stack: {
-            ...newMigrationData?.destination_stack,
-            selectedStack: stackCleared ? DEFAULT_DROPDOWN : { ...data }
-          }
-        };
-
-        updateNewMigrationData(newMigrationDataObj);      
-
-        if (!stackCleared) {
-
-          if (props?.handleStepChange) {
-            props?.handleStepChange(props?.currentStep, true);
-          }
+    if (name === 'stacks') {
+      setSelectedStack(() => ({ ...data }));
+
+      const newMigrationDataObj: INewMigration = {
+        ...newMigrationData,
+        destination_stack: {
+          ...newMigrationData?.destination_stack,
+          selectedStack: stackCleared ? DEFAULT_DROPDOWN : { ...data }
         }
+      };
+
+      updateNewMigrationData(newMigrationDataObj);
+
+      if (!stackCleared) {
+        if (props?.handleStepChange) {
+          props?.handleStepChange(props?.currentStep, true);
+        }
+      }
     }
-
   };
 
   const fetchData = async () => {
@@ -214,88 +212,89 @@ const LoadStacks = (props: LoadFileFormatProps) => {
     });
   };
 
-  const loadMoreOptions: any = async ({ search, skip, limit }: { search: string; skip: number; limit: number }) => {
-
-
-      const stackData = await getAllStacksInOrg(
-        newMigrationData?.destination_stack?.selectedOrg?.value
-      ); //org id will always be there
-
-      const stackArray = validateArray(stackData?.data?.stacks)
-        ? stackData?.data?.stacks?.map((stack: StackResponse) => ({
-            label: stack?.name,
-            value: stack?.api_key,
-            uid: stack?.api_key,
-            master_locale: stack?.master_locale,
-            locales: stack?.locales,
-            created_at: stack?.created_at
-          }))
-        : [];
-
-      stackArray.sort(
-        (a: IDropDown, b: IDropDown) =>{
-          (new Date(b?.created_at)?.getTime()) - (new Date(a?.created_at)?.getTime())}
-      );
-
-      setAllStack(stackArray);
-
-      //Set selected Stack
-      const selectedStackData = validateArray(stackArray)
-        ? stackArray.find(
-            (stack: IDropDown) =>
-              stack?.value === newMigrationData?.destination_stack?.selectedStack?.value
-          )
-        : DEFAULT_DROPDOWN;
-
-      setSelectedStack(selectedStackData);
-
-      const newMigrationDataObj: INewMigration = {
-        ...newMigrationData,
-        destination_stack: {
-          ...newMigrationData?.destination_stack,
-          selectedStack: selectedStackData
-        }
-      };
-
-      updateNewMigrationData(newMigrationDataObj);
-
-    return {options: stackArray};
-
-   }
-   const onBlurDropdown = () => {
-
+  const loadMoreOptions: any = async ({
+    search,
+    skip,
+    limit
+  }: {
+    search: string;
+    skip: number;
+    limit: number;
+  }) => {
+    const stackData = await getAllStacksInOrg(
+      newMigrationData?.destination_stack?.selectedOrg?.value
+    ); //org id will always be there
+
+    const stackArray = validateArray(stackData?.data?.stacks)
+      ? stackData?.data?.stacks?.map((stack: StackResponse) => ({
+          label: stack?.name,
+          value: stack?.api_key,
+          uid: stack?.api_key,
+          master_locale: stack?.master_locale,
+          locales: stack?.locales,
+          created_at: stack?.created_at
+        }))
+      : [];
+
+    stackArray.sort((a: IDropDown, b: IDropDown) => {
+      new Date(b?.created_at)?.getTime() - new Date(a?.created_at)?.getTime();
+    });
+
+    setAllStack(stackArray);
+
+    //Set selected Stack
+    const selectedStackData = validateArray(stackArray)
+      ? stackArray.find(
+          (stack: IDropDown) =>
+            stack?.value === newMigrationData?.destination_stack?.selectedStack?.value
+        )
+      : DEFAULT_DROPDOWN;
+
+    setSelectedStack(selectedStackData);
+
+    const newMigrationDataObj: INewMigration = {
+      ...newMigrationData,
+      destination_stack: {
+        ...newMigrationData?.destination_stack,
+        selectedStack: selectedStackData
+      }
+    };
+
+    updateNewMigrationData(newMigrationDataObj);
+
+    return { options: stackArray };
+  };
+  const onBlurDropdown = () => {
     if (!isEmptyString(selectedStack?.value)) {
       if (props?.handleStepChange) {
         props?.handleStepChange(props?.currentStep, true);
       }
     }
   };
-   
+
   return (
     <div className="">
-
       <div className="action-summary-wrapper ">
         <div className="service_list ">
           <div className="row">
             <div className="col-12 pb-3 ">
-             <div style={{display:'flex'}}>
-             <div className="Dropdown-wrapper p-0 active ">
-                <AsyncSelect
-                version={'v2'}
-                loadMoreOptions={loadMoreOptions}
-                onChange={handleDropdownChange('stacks')}
-                onBlur={onBlurDropdown}
-                value={selectedStack}
-                isSearchable={true}
-                isClearable={true}
-                width='440px'
-                isDisabled={props?.stepComponentProps?.isSummary || false}
-                placeholder={'Stacks'}
-                limit={10}
-                />
+              <div style={{ display: 'flex' }}>
+                <div className="Dropdown-wrapper p-0 active ">
+                  <AsyncSelect
+                    version={'v2'}
+                    loadMoreOptions={loadMoreOptions}
+                    onChange={handleDropdownChange('stacks')}
+                    onBlur={onBlurDropdown}
+                    value={selectedStack}
+                    isSearchable={true}
+                    isClearable={true}
+                    width="440px"
+                    isDisabled={props?.stepComponentProps?.isSummary || false}
+                    placeholder={'Stacks'}
+                    limit={10}
+                  />
+                </div>
               </div>
-             </div>
-
             </div>
             <div className="col-12 pb-2">
               <label className="title">Master Locale</label>

ui/src/components/Modal/index.tsx

@@ -47,11 +47,10 @@ const Modal = (props: ProjectModalProps) => {
   };
 
   const nameValidation = (value: string) => {
-    if(!value){ 
+    if (!value) {
       setInputValue(false);
-      return ;
-    }    
-    else if (!/^[^\s].+[^\s]$/.test(value)) {
+      return;
+    } else if (!/^[^\s].+[^\s]$/.test(value)) {
       setInputValue(false);
       return 'Please enter project name.';
     } else if (value && value?.length > 200) {
@@ -128,10 +127,10 @@ const Modal = (props: ProjectModalProps) => {
                             placeholder={namePlaceholder}
                             data-testid="title-input"
                             name="name"
-                            maxLength='200'
+                            maxLength="200"
                             error={(meta?.error || meta?.submitError) && meta?.touched}
                           />
-                            {meta?.error  && (
+                          {meta?.error && (
                             <ValidationMessage
                               testId="cs-description-error"
                               className="mt-2"
@@ -140,7 +139,6 @@ const Modal = (props: ProjectModalProps) => {
                               {meta?.error}
                             </ValidationMessage>
                           )}
-
                         </>
                       );
                     }}
@@ -149,7 +147,6 @@ const Modal = (props: ProjectModalProps) => {
                 <Field className="mb-30">
                   <FinalField name="description" validate={descValidation}>
                     {({ input, meta }): JSX.Element => {
-
                       return (
                         <>
                           <FieldLabel htmlFor="description" version="v2">
@@ -170,7 +167,7 @@ const Modal = (props: ProjectModalProps) => {
                             data-testid="description-input"
                             error={(meta?.error || meta?.submitError) && meta?.touched}
                           />
-                          {meta?.error  && (
+                          {meta?.error && (
                             <ValidationMessage
                               testId="cs-description-error"
                               className="mt-2"