[AuthRegistry Onboard] Support default selected auth type in datasour…

…ce creation page Signed-off-by: Xinrui Bai <[email protected]>
xinruiba · Feb 23, 2024 · 0339047 · 0339047
1 parent cc91319
commit 0339047
Show file tree

Hide file tree

Showing 5 changed files with 62 additions and 22 deletions.
diff --git a/src/plugins/data_source_management/public/auth_registry/authentication_methods_registry.ts b/src/plugins/data_source_management/public/auth_registry/authentication_methods_registry.ts
@@ -8,8 +8,9 @@ import { EuiSuperSelectOption } from '@elastic/eui';
 
 export interface AuthenticationMethod {
   name: string;
-  credentialForm?: React.JSX.Element;
   credentialSourceOption: EuiSuperSelectOption<string>;
+  credentialForm?: React.JSX.Element;
+  crendentialFormField?: any;
 }
 
 export type IAuthenticationMethodRegistery = Omit<

diff --git a/...c/components/create_data_source_wizard/components/create_form/create_data_source_form.tsx b/...c/components/create_data_source_wizard/components/create_form/create_data_source_form.tsx
@@ -28,6 +28,8 @@ import {
   DataSourceAttributes,
   DataSourceManagementContextValue,
   UsernamePasswordTypedContent,
+  defaultAuthType,
+  noAuthCredentialAuthMethod,
   sigV4ServiceOptions,
 } from '../../../../types';
 import { Header } from '../header';
@@ -66,27 +68,34 @@ export class CreateDataSourceForm extends React.Component<
   static contextType = contextType;
   public readonly context!: DataSourceManagementContextValue;
 
-  authOptions: Array<EuiSuperSelectOption<string>>;
+  authOptions: Array<EuiSuperSelectOption<string>> = [];
 
   constructor(props: CreateDataSourceProps, context: DataSourceManagementContextValue) {
     super(props, context);
 
-    this.authOptions = context.services.authenticationMethodRegistery
-      .getAllAuthenticationMethods()
-      .map((authMethod) => {
-        return authMethod.credentialSourceOption;
-      });
+    const authenticationMethodRegistery = context.services.authenticationMethodRegistery;
+    const registeredAuthMethods = authenticationMethodRegistery.getAllAuthenticationMethods();
+
+    this.authOptions = registeredAuthMethods.map((authMethod) => {
+      return authMethod.credentialSourceOption;
+    });
+
+    const defaultAuthMethod =
+      registeredAuthMethods.length > 0
+        ? authenticationMethodRegistery.getAuthenticationMethod(registeredAuthMethods[0].name)
+        : noAuthCredentialAuthMethod;
+    const initialSelectedAuthMethod =
+      authenticationMethodRegistery.getAuthenticationMethod(defaultAuthType) ?? defaultAuthMethod;
 
     this.state = {
       formErrorsByField: { ...defaultValidation },
       title: '',
       description: '',
       endpoint: '',
       auth: {
-        type: AuthType.UsernamePasswordType,
+        type: initialSelectedAuthMethod?.name,
         credentials: {
-          username: '',
-          password: '',
+          ...initialSelectedAuthMethod?.crendentialFormField,
         },
       },
     };

diff --git a/...agement/public/components/edit_data_source/components/edit_form/edit_data_source_form.tsx b/...agement/public/components/edit_data_source/components/edit_form/edit_data_source_form.tsx
@@ -20,14 +20,14 @@ import {
   EuiSuperSelect,
   EuiSpacer,
   EuiText,
+  EuiSuperSelectOption,
 } from '@elastic/eui';
 import { i18n } from '@osd/i18n';
 import { FormattedMessage } from '@osd/i18n/react';
 import { SigV4Content, SigV4ServiceName } from '../../../../../../data_source/common/data_sources';
 import { Header } from '../header';
 import {
   AuthType,
-  credentialSourceOptions,
   DataSourceAttributes,
   DataSourceManagementContextValue,
   sigV4ServiceOptions,
@@ -71,10 +71,17 @@ export class EditDataSourceForm extends React.Component<EditDataSourceProps, Edi
   static contextType = contextType;
   public readonly context!: DataSourceManagementContextValue;
   maskedPassword: string = '********';
+  authOptions: Array<EuiSuperSelectOption<string>> = [];
 
   constructor(props: EditDataSourceProps, context: DataSourceManagementContextValue) {
     super(props, context);
 
+    this.authOptions = context.services.authenticationMethodRegistery
+      .getAllAuthenticationMethods()
+      .map((authMethod) => {
+        return authMethod.credentialSourceOption;
+      });
+
     this.state = {
       formErrorsByField: { ...defaultValidation },
       title: '',
@@ -772,9 +779,9 @@ export class EditDataSourceForm extends React.Component<EditDataSourceProps, Edi
           })}
         >
           <EuiSuperSelect
-            options={credentialSourceOptions}
+            options={this.authOptions}
             valueOfSelected={this.state.auth.type}
-            onChange={this.onChangeAuthType}
+            onChange={(value) => this.onChangeAuthType(value)}
             name="Credential"
             data-test-subj="editDataSourceSelectAuthType"
           />

diff --git a/src/plugins/data_source_management/public/management_app/mount_management_section.tsx b/src/plugins/data_source_management/public/management_app/mount_management_section.tsx
@@ -15,7 +15,7 @@ import { ManagementAppMountParams } from '../../../management/public';
 import { OpenSearchDashboardsContextProvider } from '../../../opensearch_dashboards_react/public';
 import { CreateDataSourceWizardWithRouter } from '../components/create_data_source_wizard';
 import { DataSourceTableWithRouter } from '../components/data_source_table';
-import { AuthType, DataSourceManagementContext } from '../types';
+import { DataSourceManagementContext } from '../types';
 import { EditDataSourceWithRouter } from '../components/edit_data_source';
 import { AuthenticationMethodRegistery } from '../auth_registry';
 

diff --git a/src/plugins/data_source_management/public/types.ts b/src/plugins/data_source_management/public/types.ts
@@ -60,20 +60,45 @@ export enum AuthType {
   SigV4 = 'sigv4',
 }
 
+export const defaultAuthType = AuthType.UsernamePasswordType;
+
 export const noAuthCredentialOption = {
   value: AuthType.NoAuth,
   inputDisplay: i18n.translate('dataSourceManagement.credentialSourceOptions.NoAuthentication', {
     defaultMessage: 'No authentication',
   }),
 };
 
+export const noAuthCredentialField = {
+  username: '',
+  password: '',
+  service: 'es',
+};
+
+export const noAuthCredentialAuthMethod = {
+  name: AuthType.NoAuth,
+  credentialSourceOption: noAuthCredentialOption,
+  crendentialFormField: noAuthCredentialField,
+};
+
 export const usernamePasswordCredentialOption = {
   value: AuthType.UsernamePasswordType,
   inputDisplay: i18n.translate('dataSourceManagement.credentialSourceOptions.UsernamePassword', {
     defaultMessage: 'Username & Password',
   }),
 };
 
+export const usernamePasswordCredentialField = {
+  username: '',
+  password: '',
+};
+
+export const usernamePasswordAuthMethod = {
+  name: AuthType.UsernamePasswordType,
+  credentialSourceOption: usernamePasswordCredentialOption,
+  crendentialFormField: usernamePasswordCredentialField,
+};
+
 export const sigV4CredentialOption = {
   value: AuthType.SigV4,
   inputDisplay: i18n.translate('dataSourceManagement.credentialSourceOptions.AwsSigV4', {
@@ -96,19 +121,17 @@ export const sigV4ServiceOptions = [
   },
 ];
 
-export const noAuthCredentialAuthMethod = {
-  name: AuthType.NoAuth,
-  credentialSourceOption: noAuthCredentialOption,
-};
-
-export const usernamePasswordAuthMethod = {
-  name: AuthType.UsernamePasswordType,
-  credentialSourceOption: usernamePasswordCredentialOption,
+export const sigV4CredentialField = {
+  region: '',
+  accessKey: '',
+  secretKey: '',
+  service: '',
 };
 
 export const sigV4AuthMethod = {
   name: AuthType.SigV4,
   credentialSourceOption: sigV4CredentialOption,
+  crendentialFormField: sigV4CredentialField,
 };
 
 export const credentialSourceOptions = [