feat(admin-ui): Display retry data in job list

packages/admin-ui/src/lib/core/src/common/generated-types.ts

@@ -1662,6 +1662,8 @@ export type Job = Node & {
   error?: Maybe<Scalars['JSON']>;
   isSettled: Scalars['Boolean'];
   duration: Scalars['Int'];
+  retries: Scalars['Int'];
+  attempts: Scalars['Int'];
 };
 
 export type JobFilterParameter = {
@@ -1673,6 +1675,8 @@ export type JobFilterParameter = {
   progress?: Maybe<NumberOperators>;
   isSettled?: Maybe<BooleanOperators>;
   duration?: Maybe<NumberOperators>;
+  retries?: Maybe<NumberOperators>;
+  attempts?: Maybe<NumberOperators>;
 };
 
 export type JobList = PaginatedList & {
@@ -1702,6 +1706,8 @@ export type JobSortParameter = {
   queueName?: Maybe<SortOrder>;
   progress?: Maybe<SortOrder>;
   duration?: Maybe<SortOrder>;
+  retries?: Maybe<SortOrder>;
+  attempts?: Maybe<SortOrder>;
 };
 
 /**
@@ -8198,7 +8204,7 @@ export type GetServerConfigQuery = { globalSettings: (
 
 export type JobInfoFragment = (
   { __typename?: 'Job' }
-  & Pick<Job, 'id' | 'createdAt' | 'startedAt' | 'settledAt' | 'queueName' | 'state' | 'isSettled' | 'progress' | 'duration' | 'data' | 'result' | 'error'>
+  & Pick<Job, 'id' | 'createdAt' | 'startedAt' | 'settledAt' | 'queueName' | 'state' | 'isSettled' | 'progress' | 'duration' | 'data' | 'result' | 'error' | 'retries' | 'attempts'>
 );
 
 export type GetJobInfoQueryVariables = Exact<{

packages/admin-ui/src/lib/core/src/data/definitions/settings-definitions.ts

@@ -706,6 +706,8 @@ export const JOB_INFO_FRAGMENT = gql`
         data
         result
         error
+        retries
+        attempts
     }
 `;
 

packages/admin-ui/src/lib/system/src/components/job-list/job-list.component.html

@@ -83,6 +83,12 @@
         <td class="left align-middle">{{ job.createdAt | timeAgo }}</td>
         <td class="left align-middle">
             <vdr-job-state-label [job]="job"></vdr-job-state-label>
+            <div *ngIf="job.state === 'FAILED'" class="retry-info">
+                after {{ job.attempts }} attempts
+            </div>
+            <div *ngIf="job.state === 'RUNNING' || job.state === 'RETRYING'"  class="retry-info">
+                attempting {{ job.attempts + 1 }} of {{ job.retries }}
+            </div>
         </td>
         <td class="left align-middle">{{ job.duration | duration }}</td>
         <td class="left align-middle">

packages/admin-ui/src/lib/system/src/components/job-list/job-list.component.scss

@@ -1,3 +1,8 @@
 .result-detail {
     margin: 0 12px;
 }
+
+.retry-info {
+    margin-left: 6px;
+    color: var(--color-grey-400);
+}

packages/admin-ui/src/lib/system/src/components/job-state-label/job-state-label.component.html

@@ -1,5 +1,5 @@
 <vdr-chip [colorType]="colorType">
-    <clr-icon [attr.shape]="iconShape"></clr-icon>
+    <clr-icon [attr.shape]="iconShape" class="mr1"></clr-icon>
     {{ job.state | titlecase }}
     <span *ngIf="job.state === 'RUNNING'" class="progress">
         {{ (job.progress / 100) | percent }}