chore: misc fixes

src/Pages/App/CreateAppModal/AppClone/AppCloneList.tsx

@@ -18,6 +18,7 @@ import {
     Button,
     ComponentSizeType,
     DetectBottom,
+    GenericFilterEmptyState,
     GenericInfoCardBorderVariant,
     GenericInfoCardListing,
     GenericInfoListSkeleton,
@@ -72,24 +73,30 @@ export const AppCloneList = ({ handleCloneAppClick, isJobView, handleCreationMet
                         inputProps={{
                             placeholder: `Search ${isJobView ? 'job' : 'application'}`,
                         }}
+                        isLoading={isListLoading || isLoadingMore}
                     />
                 )}
             </div>
             <div className="flex-grow-1 flexbox-col dc__gap-12 p-20 dc__overflow-auto">
-                <GenericInfoCardListing
-                    borderVariant={GenericInfoCardBorderVariant.ROUNDED}
-                    list={list}
-                    searchKey={searchKey}
-                    isLoading={isListLoading}
-                    error={listError}
-                    reloadList={reloadList}
-                    handleClearFilters={clearFilters}
-                    emptyStateConfig={{
-                        title: 'Nothing to Clone… Yet!',
-                        subTitle: `You haven’t created any ${isJobView ? 'job' : 'application'} to clone. Kick things off by crafting one from scratch—it’s quick and easy!`,
-                        renderButton: renderCreateFromScratchButton,
-                    }}
-                />
+                {/* Empty filter state for jobs since job list is paginated */}
+                {isJobView && searchKey && !isListLoading && !listError && !list.length ? (
+                    <GenericFilterEmptyState handleClearFilters={clearFilters} />
+                ) : (
+                    <GenericInfoCardListing
+                        borderVariant={GenericInfoCardBorderVariant.ROUNDED}
+                        list={list}
+                        searchKey={isJobView ? '' : searchKey} // Not filtering on FE for jobs since job list is paginated
+                        isLoading={isListLoading}
+                        error={listError}
+                        reloadList={reloadList}
+                        handleClearFilters={clearFilters}
+                        emptyStateConfig={{
+                            title: 'Nothing to Clone… Yet!',
+                            subTitle: `You haven’t created any ${isJobView ? 'job' : 'application'} to clone. Kick things off by crafting one from scratch—it’s quick and easy!`,
+                            renderButton: renderCreateFromScratchButton,
+                        }}
+                    />
+                )}
                 {hasMoreData && isLoadingMore && <GenericInfoListSkeleton />}
 
                 {hasMoreData && !isLoadingMore && <DetectBottom callback={handleLoadMore} hasError={hasError} />}

src/Pages/App/CreateAppModal/AppClone/useDevtronCloneList.tsx

@@ -38,13 +38,15 @@ export const useDevtronCloneList = ({ handleCloneAppClick, isJobView, searchKey
         [],
     )
 
-    const [isListLoading, listResponse, listError, reloadList, setListResponse] = useAsync(() =>
-        fetchDevtronCloneList({
-            isJobView,
-            searchKey,
-            cloneListAbortControllerRef,
-            handleCloneAppClick,
-        }),
+    const [isListLoading, listResponse, listError, reloadList, setListResponse] = useAsync(
+        () =>
+            fetchDevtronCloneList({
+                isJobView,
+                searchKey,
+                cloneListAbortControllerRef,
+                handleCloneAppClick,
+            }),
+        isJobView ? [searchKey] : [], // Since job list is paginated, we want to refetch the list on searchKey change
     )
 
     const loadMoreData = async () => {

src/Pages/App/CreateAppModal/service.ts

@@ -37,12 +37,11 @@ export const fetchDevtronCloneList = async ({
             const res = await getJobs({
                 teams: [],
                 appStatuses: [],
-                appNameSearch: '',
+                appNameSearch: searchKey,
                 offset,
                 size: 20,
                 sortBy: 'appNameSort',
                 sortOrder: 'ASC',
-                searchKey,
             })
 
             const jobContainers = res.result?.jobContainers ?? []

src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/DeploymentTemplate.tsx

@@ -227,6 +227,7 @@ const DeploymentTemplate = ({
         showExpressEditPromptTooltip,
     } = state
 
+    const initialServiceAbortController = useRef<AbortController>(new AbortController())
     const manifestAbortController = useRef<AbortController>(new AbortController())
     const loadMergedTemplateAbortController = useRef<AbortController>(new AbortController())
     const editorStateBeforeExpressEditView = useRef<DeploymentTemplateEditorDataStateType>(null)
@@ -1061,9 +1062,13 @@ const DeploymentTemplate = ({
         try {
             reloadEnvironments()
             const [chartRefsDataResponse, lockedKeysConfigResponse] = await Promise.allSettled([
-                getChartList({ appId, envId, isTemplateView }),
+                getChartList({ appId, envId, isTemplateView, signal: initialServiceAbortController.current?.signal }),
                 getJsonPath && !isTemplateView
-                    ? getJsonPath(appId, envId || BASE_CONFIGURATION_ENV_ID)
+                    ? getJsonPath(
+                          appId,
+                          envId || BASE_CONFIGURATION_ENV_ID,
+                          initialServiceAbortController.current?.signal,
+                      )
                     : Promise.resolve(null),
             ])
 
@@ -1072,6 +1077,13 @@ const DeploymentTemplate = ({
             }
             const chartRefsData = chartRefsDataResponse.value
 
+            if (
+                lockedKeysConfigResponse.status === 'rejected' &&
+                getIsRequestAborted(lockedKeysConfigResponse.reason)
+            ) {
+                throw lockedKeysConfigResponse.reason
+            }
+
             const isLockedConfigResponseValid =
                 lockedKeysConfigResponse.status === 'fulfilled' && !!lockedKeysConfigResponse.value?.result
 
@@ -1088,19 +1100,26 @@ const DeploymentTemplate = ({
 
             await handleInitializePublishedAndCurrentEditorData(chartRefsData, lockedKeysConfig)
         } catch (error) {
-            showError(error)
-            dispatch({
-                type: DeploymentTemplateActionType.INITIAL_DATA_ERROR,
-                payload: {
-                    error,
-                },
-            })
+            const isReqAbortedError = getIsRequestAborted(error)
+            if (!isReqAbortedError) {
+                showError(error)
+                dispatch({
+                    type: DeploymentTemplateActionType.INITIAL_DATA_ERROR,
+                    payload: {
+                        error,
+                    },
+                })
+            }
         }
     }
 
     useEffect(() => {
         // eslint-disable-next-line @typescript-eslint/no-floating-promises
         handleInitialDataLoad()
+
+        return () => {
+            initialServiceAbortController.current.abort()
+        }
     }, [])
 
     useEffect(() => {

src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/DeploymentTemplate/service.ts

@@ -15,6 +15,7 @@
  */
 
 import {
+    APIOptions,
     AppConfigProps,
     BaseURLParams,
     get,
@@ -179,10 +180,12 @@ export async function getBaseDeploymentTemplate(
 export const getChartList = async ({
     appId,
     envId,
+    signal,
     isTemplateView,
 }: Pick<BaseURLParams, 'appId' | 'envId'> &
+    Pick<APIOptions, 'signal'> &
     Required<Pick<AppConfigProps, 'isTemplateView'>>): Promise<GetChartListReturnType> => {
-    const chartRefResp = await getChartReferencesForAppAndEnv(+appId, +envId, isTemplateView)
+    const chartRefResp = await getChartReferencesForAppAndEnv(+appId, +envId, isTemplateView, signal)
 
     const { chartRefs, latestAppChartRef, latestChartRef, latestEnvChartRef, chartMetadata } = chartRefResp.result
     // Sorting chartRefs by version

src/Pages/Shared/CommandBar/service.ts

@@ -16,7 +16,7 @@ export const getCommandBarResourceLists = async (): Promise<CommandBarResourceLi
     const appList = promiseResponse[0].status === 'fulfilled' ? promiseResponse[0].value.result : []
     const chartList = promiseResponse[1].status === 'fulfilled' ? promiseResponse[1].value.result : []
     const clusterList = promiseResponse[2].status === 'fulfilled' ? promiseResponse[2].value : []
-    const helmAppList = promiseResponse[3].status === 'fulfilled' ? promiseResponse[3].value.result.helmApps : []
+    const helmAppList = promiseResponse[3].status === 'fulfilled' ? promiseResponse[3].value.result?.helmApps ?? [] : []
 
     return { appList, chartList, clusterList: (clusterList || []).filter((cluster) => !cluster.isVirtual), helmAppList }
 }

src/components/CIPipelineN/VariableDataTable/ValueConfigOverlay.tsx

@@ -243,7 +243,7 @@ export const ValueConfigOverlay = ({ row, handleRowUpdateAction }: ConfigOverlay
 
         if (choices.length) {
             return (
-                <div ref={scrollableRef} className="flexbox-col dc__gap-6 pt-12 min-h-100">
+                <div ref={scrollableRef} className="flexbox-col dc__gap-6 pt-12 min-h-100 dc__overflow-auto">
                     <div className="py-4 px-12">
                         <Button
                             text="Add choice"
@@ -254,7 +254,7 @@ export const ValueConfigOverlay = ({ row, handleRowUpdateAction }: ConfigOverlay
                             size={ComponentSizeType.small}
                         />
                     </div>
-                    <div className="flexbox-col dc__gap-6 dc__overflow-auto pb-12 px-12">
+                    <div className="flexbox-col dc__gap-6 pb-12 px-12">
                         {choices.map(({ id, value, error }, index) => (
                             <div key={id} className="flexbox dc__align-items-center dc__gap-4 w-100">
                                 <CustomInput

src/components/CIPipelineN/VariableDataTable/VariableConfigOverlay.tsx

@@ -62,7 +62,7 @@ export const VariableConfigOverlay = ({ row, handleRowUpdateAction }: ConfigOver
         <VariableDataTablePopupMenu showHeaderIcon heading="Variable configuration" position="right">
             {({ scrollableRef }) => (
                 <>
-                    <div ref={scrollableRef} className="p-12 flexbox-col dc__gap-12">
+                    <div ref={scrollableRef} className="p-12 flexbox-col dc__gap-12 dc__overflow-auto">
                         <CustomInput
                             placeholder="Enter variable name"
                             name="variable-name"

src/components/CIPipelineN/VariableDataTable/VariableDataTablePopupMenu.tsx

@@ -73,7 +73,7 @@ export const VariableDataTablePopupMenu = ({
             triggerElement={triggerElement}
             buttonProps={null}
         >
-            <div className="flexbox-col w-100 mxh-350 dc__overflow-auto">
+            <div className="flexbox-col w-100 mxh-350 dc__overflow-hidden">
                 <div className="px-12 py-8 flexbox dc__align-items-center dc__content-space dc__gap-8 dc__border-bottom-n1">
                     <div className="flexbox dc__align-items-center dc__gap-8">
                         {showHeaderIcon && <ICSlidersVertical className="icon-dim-16" />}

src/components/Navigation/Navigation.tsx

@@ -19,6 +19,7 @@ import { useLocation } from 'react-router-dom'
 
 import {
     AnimatePresence,
+    IS_PLATFORM_MAC_OS,
     KeyboardShortcut,
     ModuleNameMap,
     ModuleStatus,
@@ -219,7 +220,7 @@ export const Navigation = ({
                         tooltip={
                             <span className="flex dc__gap-2">
                                 Search&nbsp;
-                                <KeyboardShortcut keyboardKey="Meta" />
+                                <KeyboardShortcut keyboardKey={IS_PLATFORM_MAC_OS ? 'Meta' : 'Control'} />
                                 <KeyboardShortcut keyboardKey="K" />
                             </span>
                         }

src/components/app/details/appDetails/AppDetails.tsx

@@ -138,8 +138,7 @@ export const AppNotConfigured = ({
     const handleEditApp = () => {
         getAppConfigStatus(+appId, isJobView, false)
             .then(() => {
-                const url = `/${isJobView ? URLS.AUTOMATION_AND_ENABLEMENT_JOB : URLS.APPLICATION_MANAGEMENT_APP}/${appId}/edit`
-
+                const url = `${isJobView ? URLS.AUTOMATION_AND_ENABLEMENT_JOB : URLS.APPLICATION_MANAGEMENT_APP}/${appId}/edit`
                 push(url)
             })
             .catch(noop)