Update pipelineServer

opendatahub-io · Aug 30, 2023 · 525d8b7 · 525d8b7
1 parent 2a2abff
commit 525d8b7
Show file tree

Hide file tree

Showing 10 changed files with 323 additions and 224 deletions.
diff --git a/frontend/src/components/FieldList.tsx b/frontend/src/components/FieldList.tsx
@@ -24,7 +24,7 @@ type InputFieldProps = {
   value: string;
 };
 
-const FieldListField = ({ options, onChange, value }: InputFieldProps) => {
+export const FieldListField = ({ options, onChange, value }: InputFieldProps) => {
   const ComponentField = options.isPassword ? PasswordInput : TextInput;
 
   return (

diff --git a/frontend/src/concepts/pipelines/NoPipelineServer.tsx b/frontend/src/concepts/pipelines/NoPipelineServer.tsx
@@ -18,9 +18,11 @@ const NoPipelineServer: React.FC<NoPipelineServerProps> = ({ variant }) => (
   <EmptyState>
     <EmptyStateIcon icon={WrenchIcon} />
     <Title headingLevel="h2" size="lg">
-      No pipeline server
+      Enable pipelines
     </Title>
-    <EmptyStateBody>To import a pipeline, first create a pipeline server.</EmptyStateBody>
+    <EmptyStateBody>
+      To create and manage pipelines, first enable them by configuring a pipeline server
+    </EmptyStateBody>
     <Flex direction={{ default: 'column' }}>
       <FlexItem spacer={{ default: 'spacerLg' }} />
       <FlexItem>

diff --git a/frontend/src/concepts/pipelines/content/ViewPipelineServerModal.tsx b/frontend/src/concepts/pipelines/content/ViewPipelineServerModal.tsx
@@ -10,19 +10,10 @@ import {
 } from '@patternfly/react-core';
 import { usePipelinesAPI } from '~/concepts/pipelines/context';
 import PasswordHiddenText from '~/components/PasswordHiddenText';
-import useDataConnections from '~/pages/projects/screens/detail/data-connections/useDataConnections';
-import { DataConnection } from '~/pages/projects/types';
-import { useContextResourceData } from '~/utilities/useContextResourceData';
-import {
-  convertAWSSecretData,
-  getDataConnectionDisplayName,
-} from '~/pages/projects/screens/detail/data-connections/utils';
 import { dataEntryToRecord } from '~/utilities/dataEntryToRecord';
-import { AWS_KEYS } from '~/pages/projects/dataConnections/const';
 import useNamespaceSecret from '~/concepts/projects/apiHooks/useNamespaceSecret';
 import { EXTERNAL_DATABASE_SECRET } from '~/concepts/pipelines/content/configurePipelinesServer/const';
 import { DSPipelineKind } from '~/k8sTypes';
-
 type ViewPipelineServerModalProps = {
   isOpen: boolean;
   onClose: () => void;
@@ -35,22 +26,14 @@ const ViewPipelineServerModal: React.FC<ViewPipelineServerModalProps> = ({
   pipelineNamespaceCR,
 }) => {
   const { namespace } = usePipelinesAPI();
-  const { data: dataConnections } = useContextResourceData<DataConnection>(
-    useDataConnections(namespace),
+  const [pipelineResult] = useNamespaceSecret(
+    namespace,
+    pipelineNamespaceCR?.spec.objectStorage.externalStorage?.s3CredentialsSecret.secretName ?? '',
   );
+  const pipelineSecret = dataEntryToRecord(pipelineResult?.values?.data ?? []);
   const [result] = useNamespaceSecret(namespace, EXTERNAL_DATABASE_SECRET.NAME);
   const databaseSecret = dataEntryToRecord(result?.values?.data ?? []);
 
-  const objectStorageDataConnection = dataConnections.find(
-    (dc) =>
-      dc.data.metadata.name ===
-      pipelineNamespaceCR?.spec.objectStorage?.externalStorage?.s3CredentialsSecret?.secretName,
-  );
-
-  const objectStorageRecord: Partial<Record<AWS_KEYS, string>> = objectStorageDataConnection
-    ? dataEntryToRecord(convertAWSSecretData(objectStorageDataConnection))
-    : {};
-
   return (
     <Modal
       title="View pipeline server"
@@ -65,30 +48,29 @@ const ViewPipelineServerModal: React.FC<ViewPipelineServerModalProps> = ({
     >
       {pipelineNamespaceCR && (
         <DescriptionList termWidth="20ch" isHorizontal>
-          {!!objectStorageDataConnection &&
-            !!pipelineNamespaceCR?.spec.objectStorage?.externalStorage &&
-            !!objectStorageRecord && (
+          {!!pipelineNamespaceCR.spec.objectStorage &&
+            !!pipelineNamespaceCR.spec.objectStorage.externalStorage &&
+            !!pipelineNamespaceCR.spec.objectStorage.externalStorage.s3CredentialsSecret
+              .secretName && (
               <>
                 <Title headingLevel="h2">Object storage connection</Title>
                 <DescriptionListGroup>
                   {/* TODO: is this the pipeline name or the secret name? */}
                   <DescriptionListTerm>Name</DescriptionListTerm>
                   <DescriptionListDescription>
-                    {getDataConnectionDisplayName(objectStorageDataConnection)}
+                    {/* {getDataConnectionDisplayName(objectStorageDataConnection)} */}
                   </DescriptionListDescription>
                 </DescriptionListGroup>
                 <DescriptionListGroup>
                   <DescriptionListTerm>Access key</DescriptionListTerm>
                   <DescriptionListDescription>
-                    {objectStorageRecord?.AWS_ACCESS_KEY_ID}
+                    {pipelineSecret?.AWS_ACCESS_KEY_ID || ''}
                   </DescriptionListDescription>
                 </DescriptionListGroup>
                 <DescriptionListGroup>
                   <DescriptionListTerm>Secret key</DescriptionListTerm>
                   <DescriptionListDescription>
-                    <PasswordHiddenText
-                      password={objectStorageRecord?.AWS_SECRET_ACCESS_KEY ?? ''}
-                    />
+                    <PasswordHiddenText password={pipelineSecret?.AWS_SECRET_ACCESS_KEY ?? ''} />
                   </DescriptionListDescription>
                 </DescriptionListGroup>
                 <DescriptionListGroup>

diff --git a/...src/concepts/pipelines/content/configurePipelinesServer/ConfigurePipelinesServerModal.tsx b/...src/concepts/pipelines/content/configurePipelinesServer/ConfigurePipelinesServerModal.tsx
@@ -1,12 +1,13 @@
 import * as React from 'react';
 import { Alert, Button, Form, Modal, Stack, StackItem } from '@patternfly/react-core';
-import { EMPTY_AWS_SECRET_DATA } from '~/pages/projects/dataConnections/const';
 import './ConfigurePipelinesServerModal.scss';
-import { convertAWSSecretData } from '~/pages/projects/screens/detail/data-connections/utils';
 import { usePipelinesAPI } from '~/concepts/pipelines/context';
-import { isAWSValid } from '~/pages/projects/screens/spawner/spawnerUtils';
 import { createPipelinesCR, deleteSecret } from '~/api';
 import useDataConnections from '~/pages/projects/screens/detail/data-connections/useDataConnections';
+import {
+  EMPTY_AWS_PIPELINE_DATA,
+  PIPELINE_AWS_FIELDS,
+} from '~/pages/projects/dataConnections/const';
 import { PipelinesDatabaseSection } from './PipelinesDatabaseSection';
 import { ObjectStorageSection } from './ObjectStorageSection';
 import {
@@ -15,6 +16,7 @@ import {
   EMPTY_DATABASE_CONNECTION,
   EXTERNAL_DATABASE_SECRET,
 } from './const';
+
 import { configureDSPipelineResourceSpec } from './utils';
 import { PipelineServerConfigType } from './types';
 
@@ -25,15 +27,15 @@ type ConfigurePipelinesServerModalProps = {
 
 const FORM_DEFAULTS: PipelineServerConfigType = {
   database: { useDefault: true, value: EMPTY_DATABASE_CONNECTION },
-  objectStorage: { useExisting: true, existingName: '', existingValue: EMPTY_AWS_SECRET_DATA },
+  objectStorage: { newValue: EMPTY_AWS_PIPELINE_DATA },
 };
 
 export const ConfigurePipelinesServerModal: React.FC<ConfigurePipelinesServerModalProps> = ({
   onClose,
   open,
 }) => {
   const { project, namespace } = usePipelinesAPI();
-  const [dataConnections, , , refresh] = useDataConnections(namespace);
+  const [dataConnections, loaded, , refresh] = useDataConnections(namespace);
   const [fetching, setFetching] = React.useState(false);
   const [error, setError] = React.useState<Error | null>(null);
   const [config, setConfig] = React.useState<PipelineServerConfigType>(FORM_DEFAULTS);
@@ -55,9 +57,13 @@ export const ConfigurePipelinesServerModal: React.FC<ConfigurePipelinesServerMod
             : true,
         );
 
-    const objectStorageIsValid = config.objectStorage.useExisting
-      ? !!config.objectStorage.existingName
-      : isAWSValid(config.objectStorage.newValue);
+    const objectStorageIsValid = config.objectStorage.newValue.every(({ key, value }) =>
+      PIPELINE_AWS_FIELDS.filter((field) => field.isRequired)
+        .map((field) => field.key)
+        .includes(key)
+        ? !!value
+        : true,
+    );
 
     return databaseIsValid && objectStorageIsValid;
   };
@@ -70,25 +76,9 @@ export const ConfigurePipelinesServerModal: React.FC<ConfigurePipelinesServerMod
   };
 
   const submit = () => {
-    let objectStorage: PipelineServerConfigType['objectStorage'];
-    if (config.objectStorage.useExisting) {
-      const existingName = config.objectStorage.existingName;
-      const existingValue = dataConnections?.find((dc) => dc.data.metadata.name === existingName);
-      if (existingValue) {
-        objectStorage = {
-          existingValue: convertAWSSecretData(existingValue),
-          existingName,
-          useExisting: true,
-        };
-      } else {
-        throw new Error('Selected data connection does not exist');
-      }
-    } else {
-      objectStorage = {
-        newValue: config.objectStorage.newValue,
-        useExisting: false,
-      };
-    }
+    const objectStorage: PipelineServerConfigType['objectStorage'] = {
+      newValue: config.objectStorage.newValue,
+    };
     setFetching(true);
     setError(null);
 
@@ -149,6 +139,7 @@ export const ConfigurePipelinesServerModal: React.FC<ConfigurePipelinesServerMod
             <ObjectStorageSection
               setConfig={setConfig}
               config={config}
+              loaded={loaded}
               dataConnections={dataConnections}
             />
             <PipelinesDatabaseSection setConfig={setConfig} config={config} />