save progress

airbytehq · Sep 12, 2022 · be27e62 · be27e62
1 parent 09d8b92
commit be27e62
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 6 deletions.
diff --git a/airbyte-webapp/src/locales/en.json b/airbyte-webapp/src/locales/en.json
@@ -257,6 +257,7 @@
   "sources.syncNow": "Sync now",
   "sources.source": "Source",
   "sources.noSync": "No sync yet",
+  "sources.linkedJobNotFound": "The linked job could not be found",
   "sources.emptySchema": "Schema is empty",
   "sources.noSources": "Source list is empty",
   "sources.sourceSettings": "Source Settings",

diff --git a/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/components/StatusView.tsx b/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/components/StatusView.tsx
@@ -7,6 +7,7 @@ import { Button, ContentCard, LoadingButton } from "components";
 import { Tooltip } from "components/base/Tooltip";
 import EmptyResource from "components/EmptyResourceBlock";
 import { RotateIcon } from "components/icons/RotateIcon";
+import { useAttemptLink } from "components/JobItem/attemptLinkUtils";
 
 import { getFrequencyType } from "config/utils";
 import { Action, Namespace } from "core/analytics";
@@ -51,15 +52,22 @@ const StatusView: React.FC<StatusViewProps> = ({ connection }) => {
   const [activeJob, setActiveJob] = useState<ActiveJob>();
   const [jobPageSize, setJobPageSize] = useState(JOB_PAGE_SIZE_INCREMENT);
   const analyticsService = useAnalyticsService();
-  const { jobs, isPreviousData: isJobPageLoading } = useListJobs({
+  const { jobId: linkedJobId } = useAttemptLink();
+  const {
+    jobs,
+    totalJobCount,
+    isPreviousData: isJobPageLoading,
+  } = useListJobs({
     configId: connection.connectionId,
     configTypes: ["sync", "reset_connection"],
+    includingJobId: linkedJobId ? Number(linkedJobId) : undefined,
     pagination: {
       pageSize: jobPageSize,
     },
   });
 
-  const moreJobPagesAvailable = jobs.length === jobPageSize;
+  const linkedJobNotFound = linkedJobId && jobs.length === 0;
+  const moreJobPagesAvailable = !linkedJobNotFound && jobPageSize < totalJobCount;
 
   useEffect(() => {
     const jobRunningOrPending = getJobRunningOrPending(jobs);
@@ -73,6 +81,8 @@ const StatusView: React.FC<StatusViewProps> = ({ connection }) => {
           // We need to disable button when job is canceled but the job list still has a running job
         } as ActiveJob)
     );
+
+    setJobPageSize(jobs.length);
   }, [jobs]);
 
   const { openConfirmationModal, closeConfirmationModal } = useConfirmationModalService();
@@ -170,7 +180,13 @@ const StatusView: React.FC<StatusViewProps> = ({ connection }) => {
           </div>
         }
       >
-        {jobs.length ? <JobsList jobs={jobs} /> : <EmptyResource text={<FormattedMessage id="sources.noSync" />} />}
+        {jobs.length ? (
+          <JobsList jobs={jobs} />
+        ) : linkedJobNotFound ? (
+          <EmptyResource text={<FormattedMessage id="sources.linkedJobNotFound" />} description="test description" />
+        ) : (
+          <EmptyResource text={<FormattedMessage id="sources.noSync" />} />
+        )}
       </ContentCard>
 
       {(moreJobPagesAvailable || isJobPageLoading) && (

diff --git a/airbyte-webapp/src/services/job/JobService.tsx b/airbyte-webapp/src/services/job/JobService.tsx
@@ -9,7 +9,7 @@ import {
   JobDebugInfoRead,
   JobInfoRead,
   JobListRequestBody,
-  JobWithAttemptsRead,
+  JobReadList,
   Pagination,
 } from "../../core/request/AirbyteClient";
 import { useSuspenseQuery } from "../connector/useSuspenseQuery";
@@ -36,8 +36,9 @@ export const useListJobs = (listParams: JobListRequestBody) => {
     keepPreviousData: true,
     suspense: true,
   });
-  // cast to JobWithAttemptsRead[] because (suspense: true) means we will never get undefined
-  return { jobs: result.data?.jobs as JobWithAttemptsRead[], isPreviousData: result.isPreviousData };
+  // cast to JobReadList because (suspense: true) means we will never get undefined
+  const jobReadList = result.data as JobReadList;
+  return { jobs: jobReadList.jobs, totalJobCount: jobReadList.totalJobCount, isPreviousData: result.isPreviousData };
 };
 
 export const useGetJob = (id: number, enabled = true) => {