[FLINK-22301][runtime] Statebackend and CheckpointStorage type is not shown in the Web UI

[FLINK-22301][runtime] Statebackend and CheckpointStorage type is not shown in the Web UI

This closes #15732.

Author: SteNicholas

flink-runtime-web/web-dashboard/src/app/interfaces/job-checkpoint.ts

@@ -115,6 +115,8 @@ export interface CheckPointConfigInterface {
     enabled: boolean;
     delete_on_cancellation: boolean;
   };
+  state_backend: string;
+  checkpoint_storage: string;
   unaligned_checkpoints: boolean;
   tolerable_failed_checkpoints: number;
 }

flink-runtime-web/web-dashboard/src/app/pages/job/checkpoints/job-checkpoints.component.html

@@ -223,6 +223,14 @@
             <td *ngIf="checkPointConfig['mode'] == 'exactly_once'">Exactly Once</td>
             <td *ngIf="checkPointConfig['mode'] != 'exactly_once'">At Least Once</td>
           </tr>
+          <tr>
+            <td>Checkpoint Storage</td>
+            <td>{{ checkPointConfig['checkpoint_storage'] }}</td>
+          </tr>
+          <tr>
+            <td>State Backend</td>
+            <td>{{ checkPointConfig['state_backend'] }}</td>
+          </tr>
           <tr>
             <td>Interval</td>
             <td *ngIf="checkPointConfig['interval'] == '0x7fffffffffffffff'">Periodic checkpoints disabled</td>