refactor(kubernetes): convert find artifacts from resource stage to r…

…eact (#10157)

packages/kubernetes/src/kubernetes.module.ts

@@ -31,7 +31,6 @@ import { KUBERNETES_MANIFEST_CONDITION } from './manifest/status/condition.compo
 import { KUBERNETES_MANIFEST_STATUS } from './manifest/status/status.component';
 import { ManifestWizard } from './manifest/wizard/ManifestWizard';
 import './pipelines/stages';
-import { KUBERNETES_FIND_ARTIFACTS_FROM_RESOURCE_STAGE } from './pipelines/stages/findArtifactsFromResource/findArtifactsFromResourceStage';
 import { KUBERNETES_DISABLE_MANIFEST_STAGE } from './pipelines/stages/traffic/disableManifest.stage';
 import { KUBERNETES_ENABLE_MANIFEST_STAGE } from './pipelines/stages/traffic/enableManifest.stage';
 import { KUBERNETES_UNDO_ROLLOUT_MANIFEST_STAGE } from './pipelines/stages/undoRolloutManifest/undoRolloutManifestStage';
@@ -73,7 +72,6 @@ const requires = [
   KUBERNETES_LOAD_BALANCER_TRANSFORMER,
   KUBERNETES_SECURITY_GROUP_TRANSFORMER,
   KUBERNETES_UNDO_ROLLOUT_MANIFEST_STAGE,
-  KUBERNETES_FIND_ARTIFACTS_FROM_RESOURCE_STAGE,
   KUBERNETES_MANIFEST_SELECTOR,
   KUBERNETES_MANIFEST_LABELS,
   KUBERNETES_MANIFEST_EVENTS,

packages/kubernetes/src/pipelines/stages/findArtifactsFromResource/FindArtifactsFromResourceConfig.tsx

@@ -0,0 +1,35 @@
+import { defaults } from 'lodash';
+import { useEffect } from 'react';
+import React from 'react';
+
+import type { IFormikStageConfigInjectedProps, IStageConfigProps } from '@spinnaker/core';
+import { FormikStageConfig } from '@spinnaker/core';
+
+import { FindArtifactsFromResourceStageForm } from './FindArtifactsFromResourceStageForm';
+
+export function FindArtifactsFromResourceConfig({
+  application,
+  pipeline,
+  stage,
+  updateStage,
+  stageFieldUpdated,
+}: IStageConfigProps) {
+  useEffect(() => {
+    defaults(stage, {
+      app: application.name,
+      cloudProvider: 'kubernetes',
+    });
+  }, []);
+
+  return (
+    <FormikStageConfig
+      application={application}
+      pipeline={pipeline}
+      stage={stage}
+      onChange={updateStage}
+      render={(props: IFormikStageConfigInjectedProps) => (
+        <FindArtifactsFromResourceStageForm {...props} stageFieldUpdated={stageFieldUpdated} />
+      )}
+    />
+  );
+}

packages/kubernetes/src/pipelines/stages/findArtifactsFromResource/FindArtifactsFromResourceStageForm.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+
+import type { IFormikStageConfigInjectedProps } from '@spinnaker/core';
+
+import type { IManifestSelector } from '../../../manifest/selector/IManifestSelector';
+import { SelectorMode } from '../../../manifest/selector/IManifestSelector';
+import { ManifestSelector } from '../../../manifest/selector/ManifestSelector';
+
+interface IFindArtifactsFromResourceStageConfigFormProps {
+  stageFieldUpdated: () => void;
+}
+
+export function FindArtifactsFromResourceStageForm({
+  application,
+  formik,
+  stageFieldUpdated,
+}: IFindArtifactsFromResourceStageConfigFormProps & IFormikStageConfigInjectedProps) {
+  const stage = formik.values;
+
+  const onManifestSelectorChange = () => {
+    stageFieldUpdated();
+  };
+
+  return (
+    <div className="form-horizontal">
+      <h4>Manifest</h4>
+      <div className="horizontal-rule" />
+      <ManifestSelector
+        application={application}
+        selector={(stage as unknown) as IManifestSelector}
+        modes={[SelectorMode.Static, SelectorMode.Dynamic]}
+        onChange={onManifestSelectorChange}
+        includeSpinnakerKinds={null}
+      />
+    </div>
+  );
+}

packages/kubernetes/src/pipelines/stages/findArtifactsFromResource/findArtifactsFromResourceStage.ts

@@ -1,28 +1,18 @@
-import { module } from 'angular';
-
 import { ExecutionArtifactTab, ExecutionDetailsTasks, Registry } from '@spinnaker/core';
 
-import { KubernetesV2FindArtifactsFromResourceConfigCtrl } from './findArtifactsFromResourceConfig.controller';
-import { KUBERNETES_MANIFEST_SELECTOR } from '../../../manifest/selector/selector.component';
+import { FindArtifactsFromResourceConfig } from './FindArtifactsFromResourceConfig';
 import { manifestSelectorValidators } from '../validators/manifestSelectorValidators';
 
-export const KUBERNETES_FIND_ARTIFACTS_FROM_RESOURCE_STAGE =
-  'spinnaker.kubernetes.v2.pipeline.stage.findArtifactsFromResource';
-
 const STAGE_NAME = 'Find Artifacts From Resource (Manifest)';
-module(KUBERNETES_FIND_ARTIFACTS_FROM_RESOURCE_STAGE, [KUBERNETES_MANIFEST_SELECTOR])
-  .config(() => {
-    Registry.pipeline.registerStage({
-      label: STAGE_NAME,
-      description: 'Finds artifacts from a Kubernetes resource.',
-      key: 'findArtifactsFromResource',
-      cloudProvider: 'kubernetes',
-      templateUrl: require('./findArtifactsFromResourceConfig.html'),
-      controller: 'KubernetesV2FindArtifactsFromResourceConfigCtrl',
-      controllerAs: 'ctrl',
-      executionDetailsSections: [ExecutionDetailsTasks, ExecutionArtifactTab],
-      producesArtifacts: true,
-      validators: manifestSelectorValidators(STAGE_NAME),
-    });
-  })
-  .controller('KubernetesV2FindArtifactsFromResourceConfigCtrl', KubernetesV2FindArtifactsFromResourceConfigCtrl);
+const STAGE_KEY = 'findArtifactsFromResource';
+
+Registry.pipeline.registerStage({
+  label: STAGE_NAME,
+  description: 'Finds artifacts from a Kubernetes resource.',
+  key: STAGE_KEY,
+  cloudProvider: 'kubernetes',
+  component: FindArtifactsFromResourceConfig,
+  executionDetailsSections: [ExecutionDetailsTasks, ExecutionArtifactTab],
+  producesArtifacts: true,
+  validators: manifestSelectorValidators(STAGE_NAME),
+});

packages/kubernetes/src/pipelines/stages/index.ts

@@ -1,5 +1,6 @@
 export * from './deleteManifest/deleteManifestStage';
 export * from './deployManifest/deployManifestStage';
+export * from './findArtifactsFromResource/findArtifactsFromResourceStage';
 export * from './patchManifest/patchManifestStage';
 export * from './rolloutRestartManifest/rolloutRestartManifestStage';
 export * from './runJob/runJobStage';