Merge pull request #7602 from invincibleJai/fix-move-connector

Bug 1909198: fixes move sink modal for sources
openshift · Dec 22, 2020 · 78c3f61 · 78c3f61
2 parents b9b4e77 + 6b51dc7
commit 78c3f61
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 27 deletions.
diff --git a/frontend/packages/knative-plugin/src/components/add/eventSource-validation-utils.ts b/frontend/packages/knative-plugin/src/components/add/eventSource-validation-utils.ts
@@ -10,7 +10,7 @@ import { EditorType } from '@console/shared/src/components/synced-editor/editor-
 import { EventSources, SinkType } from './import-types';
 import { isDefaultChannel, getChannelKind } from '../../utils/create-channel-utils';
 
-export const sinkTypeUriValidatiuon = (t) =>
+export const sinkTypeUriValidation = (t: TFunction) =>
   yup.object().shape({
     uri: yup
       .string()
@@ -32,7 +32,7 @@ const sinkServiceSchema = (t: TFunction) =>
     })
     .when('sinkType', {
       is: SinkType.Uri,
-      then: sinkTypeUriValidatiuon(t),
+      then: sinkTypeUriValidation(t),
     });
 
 export const sourceDataSpecSchema = (t: TFunction) =>

diff --git a/frontend/packages/knative-plugin/src/components/sink-source/SinkSource.tsx b/frontend/packages/knative-plugin/src/components/sink-source/SinkSource.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { Formik, FormikValues, FormikHelpers } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { K8sResourceKind, k8sUpdate, referenceFor, modelFor } from '@console/internal/module/k8s';
-import { sinkTypeUriValidatiuon } from '../add/eventSource-validation-utils';
+import { sinkTypeUriValidation } from '../add/eventSource-validation-utils';
 import SinkSourceModal from './SinkSourceModal';
 import { SinkType } from '../add/import-types';
 
@@ -23,32 +23,39 @@ const SinkSource: React.FC<SinkSourceProps> = ({ source, cancel, close }) => {
   const { name: sinkName = '', apiVersion = '', kind = '', uri = '' } = isSinkRef
     ? spec?.sink?.ref
     : spec?.sink || {};
+  const sinkKey = sinkName && kind ? `${kind}-${sinkName}` : '';
   const initialValues = {
-    sinkType: uri ? SinkType.Uri : SinkType.Resource,
-    sink: {
-      apiVersion,
-      kind,
-      name: sinkName,
-      uri,
+    formData: {
+      sinkType: uri ? SinkType.Uri : SinkType.Resource,
+      sink: {
+        apiVersion,
+        kind,
+        name: sinkName,
+        key: sinkKey,
+        uri,
+      },
     },
   };
   const handleSubmit = (values: FormikValues, action: FormikHelpers<FormikValues>) => {
+    const {
+      formData: { sinkType, sink },
+    } = values;
     const updatePayload = {
       ...source,
-      ...(SinkType.Uri !== values?.sinkType
+      ...(SinkType.Uri !== sinkType
         ? {
             spec: {
               ...source.spec,
               sink: {
                 ref: {
-                  apiVersion: values?.sink?.apiVersion,
-                  kind: values?.sink?.kind,
-                  name: values?.sink?.name,
+                  apiVersion: sink?.apiVersion,
+                  kind: sink?.kind,
+                  name: sink?.name,
                 },
               },
             },
           }
-        : { spec: { ...source.spec, sink: { uri: values?.sink?.uri } } }),
+        : { spec: { ...source.spec, sink: { uri: sink?.uri } } }),
     };
     k8sUpdate(modelFor(referenceFor(source)), updatePayload)
       .then(() => {
@@ -70,9 +77,11 @@ const SinkSource: React.FC<SinkSourceProps> = ({ source, cancel, close }) => {
       initialStatus={{ error: '' }}
       validationSchema={() =>
         yup.object().shape({
-          sink: yup.object().when('sinkType', {
-            is: SinkType.Uri,
-            then: sinkTypeUriValidatiuon(t),
+          formData: yup.object().shape({
+            sink: yup.object().when('sinkType', {
+              is: SinkType.Uri,
+              then: sinkTypeUriValidation(t),
+            }),
           }),
         })
       }

diff --git a/frontend/packages/knative-plugin/src/components/sink-source/SinkSourceModal.tsx b/frontend/packages/knative-plugin/src/components/sink-source/SinkSourceModal.tsx
@@ -31,7 +31,8 @@ const SinkSourceModal: React.FC<Props> = ({
 }) => {
   const { t } = useTranslation();
   const dirty =
-    values?.sink?.name !== initialValues.sink.name || values?.sink?.uri !== initialValues.sink.uri;
+    values?.formData?.sink?.name !== initialValues.formData.sink.name ||
+    values?.formData?.sink?.uri !== initialValues.formData.sink.uri;
   return (
     <form className="modal-content modal-content--no-inner-scroll" onSubmit={handleSubmit}>
       <ModalTitle>{t('knative-plugin~Move sink')}</ModalTitle>

diff --git a/frontend/packages/knative-plugin/src/components/sink-source/__tests__/SinkSource.spec.tsx b/frontend/packages/knative-plugin/src/components/sink-source/__tests__/SinkSource.spec.tsx
@@ -22,7 +22,7 @@ describe('SinkSource', () => {
   it('should render Formik with proper initial values', () => {
     const formikForm = eventSourceForm.find(Formik);
     expect(formikForm).toHaveLength(1);
-    expect(formikForm.get(0).props.initialValues.sink.name).toBe('wss-event-display');
+    expect(formikForm.get(0).props.initialValues.formData.sink.name).toBe('wss-event-display');
   });
 
   it('should render Formik child with proper props', () => {

diff --git a/...end/packages/knative-plugin/src/components/sink-source/__tests__/SinkSourceModal.spec.tsx b/...end/packages/knative-plugin/src/components/sink-source/__tests__/SinkSourceModal.spec.tsx
@@ -24,10 +24,12 @@ describe('SinkSourceModal Form', () => {
   let formProps: SinkSourceModalProps;
   let sinkSourceModalWrapper: ShallowWrapper<SinkSourceModalProps>;
   const formValues = {
-    sink: {
-      apiVersion: `${ServiceModel.apiGroup}/${ServiceModel.apiVersion}`,
-      kind: ServiceModel.kind,
-      name: 'event-greeter',
+    formData: {
+      sink: {
+        apiVersion: `${ServiceModel.apiGroup}/${ServiceModel.apiVersion}`,
+        kind: ServiceModel.kind,
+        name: 'event-greeter',
+      },
     },
   };
   beforeEach(() => {
@@ -65,10 +67,12 @@ describe('SinkSourceModal Form', () => {
 
   it('Save should be enabled if value is  changed', () => {
     const sinkValues = {
-      sink: {
-        apiVersion: `${ServiceModel.apiGroup}/${ServiceModel.apiVersion}`,
-        kind: ServiceModel.kind,
-        name: 'event-greeter-new',
+      formData: {
+        sink: {
+          apiVersion: `${ServiceModel.apiGroup}/${ServiceModel.apiVersion}`,
+          kind: ServiceModel.kind,
+          name: 'event-greeter-new',
+        },
       },
     };
     formProps = {