PR Feedback

openshift · Oct 22, 2019 · 0bdb3ba · 0bdb3ba
1 parent a625687
commit 0bdb3ba
Show file tree

Hide file tree

Showing 8 changed files with 79 additions and 50 deletions.
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.tsx b/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.tsx
@@ -81,7 +81,7 @@ const enableSource = (
     const currentSources = _.get(operatorHub, 'spec.sources', []);
     const patch = [
       {
-        op: _.isEmpty(currentSources) ? 'add' : 'replace',
+        op: 'add',
         path: '/spec/sources',
         value: _.filter(currentSources, (source) => source.name !== sourceName),
       },
@@ -91,7 +91,12 @@ const enableSource = (
   accessReview: asAccessReview(kind, operatorHub, 'patch'),
 });
 
-const DefaultSourceKebab = ({ kind, operatorHub, sourceName, sourceDisabled }) => {
+const DefaultSourceKebab: React.FC<DefaultSourceKebabProps> = ({
+  kind,
+  operatorHub,
+  sourceName,
+  sourceDisabled,
+}) => {
   const options = sourceDisabled
     ? [enableSource(kind, operatorHub, sourceName)]
     : [disableSourceModal(kind, operatorHub, sourceName)];
@@ -283,7 +288,7 @@ const CatalogSourceHeader = () => {
   ];
 };
 
-const getEndpoint = (catalogSource) => {
+const getEndpoint = (catalogSource: CatalogSourceKind): React.ReactNode => {
   if (catalogSource.spec.configmap) {
     return (
       <ResourceLink
@@ -296,13 +301,16 @@ const getEndpoint = (catalogSource) => {
   return catalogSource.spec.image || catalogSource.spec.address;
 };
 
-const getOperatorCount = (catalogSource, packageManifests) =>
+const getOperatorCount = (
+  catalogSource: CatalogSourceKind,
+  packageManifests: PackageManifestKind[],
+): number =>
   _.filter(packageManifests, {
     status: {
       catalogSource: catalogSource.metadata.name,
       catalogSourceNamespace: catalogSource.metadata.namespace,
     },
-  }).length;
+  } as any).length; // Type inferred to prevent Lodash TypeScript error.
 
 const CatalogSourceTableRow: React.FC<CatalogSourceTableRowProps> = ({
   obj: {
@@ -340,9 +348,9 @@ const CatalogSourceTableRow: React.FC<CatalogSourceTableRowProps> = ({
           name
         )}
       </TableData>
-      <TableData className={tableColumnClasses[1]}>{publisher || '-'}</TableData>
+      <TableData className={tableColumnClasses[1]}>{publisher}</TableData>
       <TableData className={tableColumnClasses[2]}>{availability}</TableData>
-      <TableData className={tableColumnClasses[3]}>{endpoint || '-'}</TableData>
+      <TableData className={tableColumnClasses[3]}>{endpoint}</TableData>
       <TableData className={tableColumnClasses[4]}>{operatorCount || '-'}</TableData>
       <TableData className={tableColumnClasses[5]}>
         {isDefault ? (
@@ -384,7 +392,7 @@ const flatten = ({
     });
     const catalogSourceExists = !_.isEmpty(catalogSource);
     return {
-      availability: !catalogSourceExists ? 'Disabled' : 'Cluster wide',
+      availability: catalogSourceExists ? 'Cluster wide' : 'Disabled',
       disabled: !catalogSourceExists,
       isDefault: true,
       name: defaultSource.name,
@@ -445,23 +453,36 @@ export const CatalogSourceListPage: React.FC<CatalogSourceListPageProps> = (prop
   />
 );
 
+type DefaultSourceKebabProps = {
+  kind: K8sKind;
+  operatorHub: OperatorHubKind;
+  sourceName: string;
+  sourceDisabled: boolean;
+};
+
 type FlattenArgType = {
   catalogSources: { data: CatalogSourceKind[] };
   packageManifests: { data: PackageManifestKind[] };
   operatorHub: OperatorHubKind;
 };
-type CatalogSourceListPageProps = { obj: K8sResourceKind } & ListPageProps;
+
+export type CatalogSourceListPageProps = {
+  obj: K8sResourceKind;
+} & ListPageProps;
+
 type CatalogSourceTableRowObj = {
-  availability?: React.ReactNode;
+  availability: React.ReactNode;
   disabled?: boolean;
-  endpoint?: string;
+  endpoint?: React.ReactNode;
   isDefault?: boolean;
-  name?: string;
+  name: string;
+  namespace: string;
   publisher?: string;
   operatorCount?: number;
   operatorHub: OperatorHubKind;
   source?: CatalogSourceKind;
 };
+
 type CatalogSourceTableRowProps = {
   obj: CatalogSourceTableRowObj;
   key: string;

diff --git a/frontend/packages/operator-lifecycle-manager/src/components/create-catalog-source.tsx b/frontend/packages/operator-lifecycle-manager/src/components/create-catalog-source.tsx
@@ -12,34 +12,34 @@ import { RadioGroup } from '@console/internal/components/radio';
 import { k8sCreate } from '@console/internal/module/k8s';
 import { CatalogSourceModel } from '../models';
 
-enum AvailabilityValues {
+enum AvailabilityValue {
   ALL_NAMESPACES = '0',
   SINGLE_NAMESPACE = '1',
 }
 
 const availabilityKinds = [
   {
-    value: AvailabilityValues.ALL_NAMESPACES,
-    title: 'All namespaces on the cluster',
+    value: AvailabilityValue.ALL_NAMESPACES,
+    title: 'Cluster-wide catalog source',
     desc: 'Catalog will be available in all namespaces',
   },
   {
-    value: AvailabilityValues.SINGLE_NAMESPACE,
-    title: 'A specific namespace on the cluster',
+    value: AvailabilityValue.SINGLE_NAMESPACE,
+    title: 'Namespace catalog source',
     desc: 'Catalog will only be available in a single namespace',
   },
 ];
 
 export const CreateCatalogSource: React.FC<HandlePromiseProps> = withHandlePromise(
   ({ handlePromise, inProgress, errorMessage }) => {
-    const [availability, setAvailability] = React.useState(AvailabilityValues.ALL_NAMESPACES);
+    const [availability, setAvailability] = React.useState(AvailabilityValue.ALL_NAMESPACES);
     const [image, setImage] = React.useState('');
     const [displayName, setDisplayName] = React.useState('');
     const [name, setName] = React.useState('');
-    const [namespace, setNamespace] = React.useState();
+    const [namespace, setNamespace] = React.useState('');
     const [publisher, setPublisher] = React.useState('');
     const onSave = React.useCallback(
-      (e) => {
+      (e: React.FormEvent<EventTarget>) => {
         e.preventDefault();
         return handlePromise(
           k8sCreate(CatalogSourceModel, {
@@ -48,7 +48,7 @@ export const CreateCatalogSource: React.FC<HandlePromiseProps> = withHandlePromi
             metadata: {
               name,
               namespace:
-                availability === AvailabilityValues.ALL_NAMESPACES
+                availability === AvailabilityValue.ALL_NAMESPACES
                   ? 'openshift-marketplace'
                   : namespace,
             },
@@ -64,12 +64,12 @@ export const CreateCatalogSource: React.FC<HandlePromiseProps> = withHandlePromi
       [availability, displayName, handlePromise, image, name, namespace, publisher],
     );
 
-    const onNamespaceChange = React.useCallback((value) => {
+    const onNamespaceChange = React.useCallback((value: string) => {
       setNamespace(value);
     }, []);
 
-    const onAvailabiltiyChange = ({ target: { value } }) => {
-      setAvailability(value);
+    const onAvailabiltiyChange = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
+      setAvailability(value as AvailabilityValue);
     };
 
     return (
@@ -138,7 +138,7 @@ export const CreateCatalogSource: React.FC<HandlePromiseProps> = withHandlePromi
               onChange={onAvailabiltiyChange}
             />
           </FormGroup>
-          {availability === AvailabilityValues.SINGLE_NAMESPACE && (
+          {availability === AvailabilityValue.SINGLE_NAMESPACE && (
             <FormGroup fieldId="catalog-source-namespace" label="Namespace" isRequired>
               <NsDropdown
                 selectedKey={namespace}

diff --git a/...packages/operator-lifecycle-manager/src/components/modals/delete-catalog-source-modal.tsx b/...packages/operator-lifecycle-manager/src/components/modals/delete-catalog-source-modal.tsx
@@ -5,6 +5,7 @@ import {
   ModalTitle,
   ModalBody,
   ModalSubmitFooter,
+  ModalComponentProps,
 } from '@console/internal/components/factory/modal';
 import { YellowExclamationTriangleIcon } from '@console/shared';
 import { withHandlePromise, HandlePromiseProps } from '@console/internal/components/utils';
@@ -18,17 +19,15 @@ const DeleteCatalogSourceModal: React.FC<DeleteCatalogSourceModalProps> = ({
   errorMessage,
   handlePromise,
 }) => {
-  const [confirmed, setConfirmed] = React.useState(false);
-  const isConfirmed = (e) => {
-    setConfirmed(e.target.value === resource.metadata.name);
+  const [confirmed, setConfirmed] = React.useState<boolean>(false);
+  const isConfirmed = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    setConfirmed(e.currentTarget.value === resource.metadata.name);
   };
 
   const submit = React.useCallback(
-    (event) => {
+    (event: React.FormEvent<EventTarget>) => {
       event.preventDefault();
-      return handlePromise(k8sKill(kind, resource)).then(() => {
-        close();
-      });
+      return handlePromise(k8sKill(kind, resource)).then(close);
     },
     [close, handlePromise, kind, resource],
   );
@@ -73,9 +72,8 @@ const DeleteCatalogSourceModal: React.FC<DeleteCatalogSourceModalProps> = ({
 type DeleteCatalogSourceModalProps = {
   kind: K8sKind;
   resource: K8sResourceKind;
-  close?: () => void;
-  cancel?: () => void;
-} & HandlePromiseProps;
+} & ModalComponentProps &
+  HandlePromiseProps;
 
 export const deleteCatalogSourceModal = createModalLauncher(
   withHandlePromise(DeleteCatalogSourceModal),

diff --git a/...ackages/operator-lifecycle-manager/src/components/modals/disable-default-source-modal.tsx b/...ackages/operator-lifecycle-manager/src/components/modals/disable-default-source-modal.tsx
@@ -23,12 +23,12 @@ const DisableDefaultSourceModal: React.FC<DisableSourceModalProps> = ({
   handlePromise,
 }) => {
   const submit = React.useCallback(
-    (event) => {
+    (event: React.FormEvent<EventTarget>): Promise<any> => {
       event.preventDefault();
       const currentSources = _.get(operatorHub, 'spec.sources', []);
       const patch = [
         {
-          op: _.isEmpty(currentSources) ? 'add' : 'replace',
+          op: 'add',
           path: '/spec/sources',
           value: [
             ..._.filter(currentSources, (source) => source.name !== sourceName),

diff --git a/.../packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub-details.tsx b/.../packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub-details.tsx
@@ -1,27 +1,38 @@
 import * as React from 'react';
-import { DetailsPage } from '@console/internal/components/factory';
+import { DetailsPage, DetailsPageProps } from '@console/internal/components/factory';
 import {
   navFactory,
   SectionHeading,
   ResourceSummary,
   Kebab,
 } from '@console/internal/components/utils';
-import { CatalogSourceListPage } from '../catalog-source';
+import { CatalogSourceListPage, CatalogSourceListPageProps } from '../catalog-source';
+import { OperatorHubKind } from '.';
 
-const OperatorHubDetails = ({ obj }) => (
+const OperatorHubDetails: React.FC<OperatorHubDetailsProps> = ({ obj }) => (
   <div className="co-m-pane__body">
     <SectionHeading text="OperatorHub Overview" />
     <ResourceSummary resource={obj} podSelector="spec.podSelector" showNodeSelector={false} />
   </div>
 );
 
-const SourcesPage = {
-  href: 'sources',
-  name: 'Sources',
-  component: (props) => <CatalogSourceListPage showTitle={false} {...props} />,
-};
+const Sources: React.FC<CatalogSourceListPageProps> = (props) => (
+  <CatalogSourceListPage showTitle={false} {...props} />
+);
+const pages = [
+  navFactory.details(OperatorHubDetails),
+  navFactory.editYaml(),
+  {
+    href: 'sources',
+    name: 'Sources',
+    component: Sources,
+  },
+];
 
-export const OperatorHubDetailsPage = (props) => {
-  const pages = [navFactory.details(OperatorHubDetails), navFactory.editYaml(), SourcesPage];
+export const OperatorHubDetailsPage: React.FC<DetailsPageProps> = (props) => {
   return <DetailsPage {...props} menuActions={Kebab.factory.common} pages={pages} />;
 };
+
+type OperatorHubDetailsProps = {
+  obj: OperatorHubKind;
+};
diff --git a/frontend/public/components/monitoring.tsx b/frontend/public/components/monitoring.tsx
@@ -1661,6 +1661,7 @@ export type ListPageProps = {
     reducer: (any) => string;
     items: { id: string; title: string }[];
   };
+  showTitle?: boolean;
 };
 
 type AlertingPageProps = {

diff --git a/frontend/public/components/routes/create-route.tsx b/frontend/public/components/routes/create-route.tsx
@@ -637,7 +637,7 @@ export const AlternateServicesGroup: React.FC<AlternateServiceEntryGroupProps> =
 
   React.useEffect(() => {
     props.onChange({ name, weight }, props.index);
-  }, [name, props, weight]);
+  }, [name, weight]);
 
   const { serviceOptions, availableServiceOptions, index } = props;
 

diff --git a/frontend/public/style/_overrides.scss b/frontend/public/style/_overrides.scss
@@ -186,8 +186,6 @@ h6 {
   color: var(--pf-c-button--m-plain--Color);
 }
 
-
-
 // PF components that calculate their correct height based on --pf-global--FontSize--md: 1rem
 .pf-c-modal-box,
 .pf-c-switch {