chore(KFLUXUI-256): replace component.spec.containerImage to

component.status.lastPromotedImage
konflux-ci · Jan 9, 2025 · 73682cc · 73682cc
1 parent 7c5807c
commit 73682cc
Show file tree

Hide file tree

Showing 10 changed files with 19 additions and 18 deletions.
diff --git a/src/components/ApplicationDetails/__data__/WorkflowComponentsData.ts b/src/components/ApplicationDetails/__data__/WorkflowComponentsData.ts
@@ -106,7 +106,6 @@ export const mockComponentsData = [
     spec: {
       application: 'test-dev-samples',
       componentName: 'test-dotnet60',
-      containerImage: 'quay.io/redhat-appstudio/user-workload:test-ns-test-dotnet60',
       replicas: 1,
       resources: {
         requests: {
@@ -140,6 +139,7 @@ export const mockComponentsData = [
           type: 'Created',
         },
       ],
+      lastPromotedImage: 'quay.io/redhat-appstudio/user-workload:test-ns-test-dotnet60',
       containerImage: 'quay.io/redhat-appstudio/user-workload:test-ns-test-dotnet60',
       devfile:
         'commands:\n- apply:\n    component: dockerfile-build\n  id: build-image\ncomponents:\n- image:\n    dockerfile:\n      rootRequired: false\n      uri: https://raw.githubusercontent.com/test-user-1/devfile-sample-dotnet60-basic/main/docker/Dockerfile\n    imageName: ""\n  name: dockerfile-build\n- attributes:\n    deployment/container-port: 8081\n    deployment/cpuRequest: 10m\n    deployment/memoryRequest: 100Mi\n    deployment/replicas: 1\n    deployment/storageRequest: "0"\n  kubernetes:\n    inlined: placeholder\n  name: kubernetes\nmetadata:\n  description: Basic Devfile for a Dockerfile Component\n  name: dockerfile-component\nschemaVersion: 2.2.0\n',

diff --git a/src/components/Components/ComponentDetails/tabs/ComponentDetails.tsx b/src/components/Components/ComponentDetails/tabs/ComponentDetails.tsx
@@ -35,7 +35,7 @@ const ComponentDetails: React.FC<React.PropsWithChildren<ComponentDetailsProps>>
       ? getPipelineRunStatusResults(latestPushBuildPLR)
       : null;
   const latestImageURL = results?.find((result) => result.name === RESULT_NAME);
-  const componentImageURL = latestImageURL?.value ?? component.spec.containerImage;
+  const componentImageURL = latestImageURL?.value ?? component.status.lastPromotedImage;
 
   const runTime = React.useMemo(() => {
     try {

diff --git a/src/components/Components/ComponentDetails/tabs/ComponentLatestBuild.tsx b/src/components/Components/ComponentDetails/tabs/ComponentLatestBuild.tsx
@@ -43,7 +43,7 @@ const ComponentLatestBuild: React.FC<React.PropsWithChildren<ComponentLatestBuil
   const [taskRuns, taskRunsLoaded] = useTaskRuns(namespace, pipelineRun?.metadata?.name);
   const buildLogsModal = useBuildLogViewerModal(component);
 
-  const containerImage = component.spec.containerImage;
+  const containerImage = component.status.lastPromotedImage;
 
   if (error) {
     const httpError = HttpError.fromCode((error as { code: number }).code);

diff --git a/src/components/Components/ComponentDetails/tabs/__tests__/ComponentDetailsTab.spec.tsx b/src/components/Components/ComponentDetails/tabs/__tests__/ComponentDetailsTab.spec.tsx
@@ -115,7 +115,7 @@ describe('ComponentDetailTab', () => {
 
   it('should renderWithQueryClientAndRouter Component container image URL when latest build url not found', () => {
     useComponentMock.mockReturnValue([
-      { ...mockComponent, spec: { containerImage: 'test-url', ...mockComponent.spec } },
+      { ...mockComponent, status: { lastPromotedImage: 'test-url', ...mockComponent.status } },
       true,
     ]);
     renderWithQueryClientAndRouter(<ComponentDetailsTab />);

diff --git a/src/components/Components/ComponentsListView/ComponentsListRow.tsx b/src/components/Components/ComponentsListView/ComponentsListRow.tsx
@@ -66,14 +66,14 @@ const ComponentsListRow: React.FC<
               />
             </FlexItem>
           )}
-          {component.spec.containerImage && (
+          {component?.status?.lastPromotedImage && (
             <FlexItem>
               <ExternalLink
                 /** by default patternfly button disable text selection on Button component
                     this enables it on <a /> tag */
                 style={{ userSelect: 'auto' }}
-                href={getContainerImageLink(component.spec.containerImage)}
-                text={component.spec.containerImage}
+                href={getContainerImageLink(component.status.lastPromotedImage)}
+                text={component.status.lastPromotedImage}
               />
             </FlexItem>
           )}

diff --git a/src/components/CustomizedPipeline/CustomizePipelines.tsx b/src/components/CustomizedPipeline/CustomizePipelines.tsx
@@ -140,16 +140,16 @@ const Row: React.FC<
               />
             </div>
           )}
-          {component.spec.containerImage && (
+          {component?.status?.lastPromotedImage && (
             <div>
               Image:{' '}
               <ExternalLink
                 href={
-                  component.spec.containerImage.startsWith('http')
-                    ? component.spec.containerImage
-                    : `https://${component.spec.containerImage}`
+                  component.status.lastPromotedImage.startsWith('http')
+                    ? component.status.lastPromotedImage
+                    : `https://${component.status.lastPromotedImage}`
                 }
-                text={<Truncate content={component.spec.containerImage} />}
+                text={<Truncate content={component.status.lastPromotedImage} />}
               />
             </div>
           )}

diff --git a/src/components/CustomizedPipeline/__tests__/CustomizePipeline.spec.tsx b/src/components/CustomizedPipeline/__tests__/CustomizePipeline.spec.tsx
@@ -239,11 +239,14 @@ describe('CustomizePipeline', () => {
       <CustomizePipeline
         components={[
           {
+            spec: {
+              application: 'my-component-test',
+            },
             metadata: {
               name: 'my-component-test',
             },
-            spec: {
-              containerImage: 'quay.io/org/test:latest',
+            status: {
+              lastPromotedImage: 'quay.io/org/test:latest',
             },
           } as ComponentKind,
         ]}

diff --git a/src/components/SnapshotDetails/tabs/__tests__/SnapshotComponentsListRow.spec.tsx b/src/components/SnapshotDetails/tabs/__tests__/SnapshotComponentsListRow.spec.tsx
@@ -11,7 +11,7 @@ jest.mock('react-router-dom', () => ({
 const rowData: SnapshotComponentTableData = {
   metadata: { uid: mockComponentsData[1].metadata.uid, name: mockComponentsData[1].metadata.name },
   name: mockComponentsData[1].metadata.name,
-  containerImage: mockComponentsData[1].spec.containerImage,
+  containerImage: mockComponentsData[1].status.lastPromotedImage,
   application: 'test-app',
   source: { git: { url: mockComponentsData[1].spec.source.git.url, revision: 'main' } },
 };

diff --git a/src/types/component.ts b/src/types/component.ts
@@ -34,7 +34,6 @@ export type ComponentSpecs = {
   application: string;
   secret?: string;
   source?: ComponentSource;
-  containerImage?: string;
   resources?: ResourceRequirements;
   replicas?: number;
   releaseStrategies?: string[];
@@ -50,6 +49,7 @@ export type ComponentSpecs = {
 export type ComponentKind = K8sResourceCommon & {
   spec: ComponentSpecs;
   status?: {
+    lastPromotedImage?: string;
     containerImage?: string;
     conditions?: ResourceStatusCondition[];
     devfile?: string;

diff --git a/src/utils/create-utils.ts b/src/utils/create-utils.ts
@@ -113,7 +113,6 @@ export const createComponent = (
     componentName,
     gitProviderAnnotation,
     gitURLAnnotation,
-    containerImage,
     source,
     replicas,
     resources,
@@ -143,7 +142,6 @@ export const createComponent = (
       application,
       source,
       secret,
-      containerImage,
       replicas,
       ...(isNumber(targetPort) && { targetPort }),
       resources,