[MD] Datasource Management - creation & listing - UI only

src/plugins/data_source/server/index.ts

@@ -8,7 +8,7 @@ import { PluginConfigDescriptor, PluginInitializerContext } from 'src/core/serve
 import { DataSourcePlugin } from './plugin';
 
 export const configSchema = schema.object({
-  enabled: schema.boolean({ defaultValue: false }),
+  enabled: schema.boolean({ defaultValue: true }),
 });
 
 export type DataSourcePluginConfigType = TypeOf<typeof configSchema>;

src/plugins/data_source_management/common/data_sources/data_sources/data_source.ts

@@ -0,0 +1,30 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { DataSourceSpec, IDataSource, SavedObjectsClientCommon } from '../types';
+
+interface DataSourceDeps {
+  spec?: DataSourceSpec;
+  savedObjectsClient: SavedObjectsClientCommon;
+}
+
+interface SavedObjectBody {
+  title?: string;
+  type?: string;
+}
+
+export class DataSource implements IDataSource {
+  public id?: string;
+  public title: string = '';
+  public type: string | undefined;
+  public endpoint: string = '';
+
+  constructor({ spec = {} }: DataSourceDeps) {
+    this.id = spec.id;
+    this.title = spec.title || '';
+    this.type = spec.type;
+    this.endpoint = spec.endpoint || '';
+  }
+}

src/plugins/data_source_management/common/data_sources/data_sources/data_sources.ts

@@ -0,0 +1,39 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {
+  OnError,
+  OnNotification,
+  SavedObject,
+  SavedObjectsClientCommon,
+  UiSettingsCommon,
+} from '../types';
+
+export interface DataSourceSavedObjectAttrs {
+  title: string;
+}
+
+interface DataSourcesServiceDeps {
+  uiSettings: UiSettingsCommon;
+  savedObjectsClient: SavedObjectsClientCommon;
+  onNotification: OnNotification;
+  onError: OnError;
+}
+
+export class DataSroucesService {
+  private config: UiSettingsCommon;
+  private savedObjectsClient: SavedObjectsClientCommon;
+  private savedObjectsCache?: Array<SavedObject<DataSourceSavedObjectAttrs>> | null;
+  // private apiClient
+  private onNotification: OnNotification;
+  private onError: OnError;
+
+  constructor({ uiSettings, savedObjectsClient, onNotification, onError }: DataSourcesServiceDeps) {
+    this.config = uiSettings;
+    this.savedObjectsClient = savedObjectsClient;
+    this.onNotification = onNotification;
+    this.onError = onError;
+  }
+}

src/plugins/data_source_management/common/data_sources/data_sources/index.ts

@@ -0,0 +1,7 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export * from './data_source';
+export * from './data_sources';

src/plugins/data_source_management/common/data_sources/index.ts

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export type { DataSource } from './data_sources';

src/plugins/data_source_management/common/data_sources/types.ts

@@ -0,0 +1,71 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { ToastInputFields, ErrorToastOptions } from 'src/core/public/notifications';
+// eslint-disable-next-line @osd/eslint/no-restricted-paths
+import type { SavedObject } from 'src/core/server';
+
+export interface IDataSource {
+  title: string;
+  id?: string;
+  type?: string;
+  endpoint: string;
+}
+
+export interface IDataSourceAttributes {
+  title: string;
+  id: string;
+  type: string;
+  endpoint: string;
+}
+
+export type OnNotification = (toastInputFields: ToastInputFields) => void;
+export type OnError = (error: Error, toastInputFields: ErrorToastOptions) => void;
+
+export interface UiSettingsCommon {
+  get: (key: string) => Promise<any>;
+  getAll: () => Promise<Record<string, any>>;
+  set: (keu: string, value: any) => Promise<void>;
+  remove: (key: string) => Promise<void>;
+}
+
+export interface SavedObjectsClientCommonFindArgs {
+  type: string | string[];
+  perPage?: number;
+  // fields?: string[];
+  // search?: string;
+  // searchFields?: string[];
+}
+
+export interface SavedObjectsClientCommon {
+  find: <T = unknown>(options: SavedObjectsClientCommonFindArgs) => Promise<Array<SavedObject<T>>>;
+  get: <T = unknown>(type: string, id: string) => Promise<SavedObject<T>>;
+  update: <T = unknown>(
+    type: string,
+    id: string,
+    attributes: Record<string, any>,
+    options: Record<string, any>
+  ) => Promise<SavedObject<T>>;
+  create: (
+    type: string,
+    attributes: Record<string, any>,
+    options: Record<string, any>
+  ) => Promise<SavedObject>;
+  delete: (type: string, id: string) => Promise<{}>;
+}
+
+// export interface IDataSourcesApiClient {
+
+// }
+
+export interface DataSourceSpec {
+  id?: string;
+  version?: string;
+  title?: string;
+  type?: string;
+  endpoint?: string;
+}
+
+export type { SavedObject };

src/plugins/data_source_management/opensearch_dashboards.json

@@ -5,5 +5,5 @@
   "ui": true,
   "requiredPlugins": ["management"],
   "optionalPlugins": [],
-  "requiredBundles": ["opensearchDashboardsReact"]
+  "requiredBundles": ["opensearchDashboardsReact", "savedObjects"]
 }

src/plugins/data_source_management/public/components/breadcrumbs.ts

@@ -8,10 +8,22 @@ import { i18n } from '@osd/i18n';
 export function getListBreadcrumbs() {
   return [
     {
-      text: i18n.translate('indexPatternManagement.dataSources.listBreadcrumb', {
+      text: i18n.translate('dataSourcesManagement.dataSources.listBreadcrumb', {
         defaultMessage: 'Data Sources',
       }),
       href: `/`,
     },
   ];
 }
+
+export function getCreateBreadcrumbs() {
+  return [
+    ...getListBreadcrumbs(),
+    {
+      text: i18n.translate('dataSourcesManagement.dataSources.createBreadcrumb', {
+        defaultMessage: 'Create data source',
+      }),
+      href: `/create`,
+    },
+  ];
+}

src/plugins/data_source_management/public/components/create_button/create_button.tsx

@@ -0,0 +1,30 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { History } from 'history';
+
+import { EuiButton } from '@elastic/eui';
+import { FormattedMessage } from '@osd/i18n/react';
+
+interface Props {
+  history: History;
+}
+
+export const CreateButton = ({ history }: Props) => {
+  return (
+    <EuiButton
+      data-test-subj="createDataSourceButton"
+      fill={true}
+      onClick={() => history.push('/create')}
+      iconType="plusInCircle"
+    >
+      <FormattedMessage
+        id="dataSourcesManagement.dataSourcesTable.createBtn"
+        defaultMessage="Create Data Source"
+      />
+    </EuiButton>
+  );
+};

src/plugins/data_source_management/public/components/create_button/index.tsx

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { CreateButton } from './create_button';

src/plugins/data_source_management/public/components/create_data_source_wizard/components/authentication_tabs/authentication_tabs.tsx

@@ -0,0 +1,63 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React, { ReactNode, useMemo } from 'react';
+import { EuiPanel, EuiTab, EuiTabs } from '@elastic/eui';
+
+export interface AuthenticationTabItem {
+  id: string;
+  name: string;
+  content: ReactNode;
+  disabled?: boolean;
+  href?: string;
+}
+
+export interface AuthenticationTabsProps {
+  tabs: AuthenticationTabItem[];
+  onTabChange: (tabId: string) => void;
+  selectedTabId: string;
+}
+
+export const AuthenticationTabs = ({
+  tabs,
+  onTabChange,
+  selectedTabId,
+}: AuthenticationTabsProps) => {
+  /* No tabs data */
+  if (!tabs || !tabs.length) {
+    return null;
+  }
+
+  /* Suppressing below rule as we return null if tabs == null */
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const selectedTabContent = useMemo(() => {
+    return tabs.find((obj) => obj.id === selectedTabId)?.content;
+  }, [selectedTabId, tabs]);
+
+  const renderTabs = () => {
+    return tabs.map((tab, index) => (
+      <EuiTab
+        key={index}
+        href={tab.href}
+        onClick={(e) => {
+          onTabChange(tab.id);
+        }}
+        isSelected={tab.id === selectedTabId}
+        disabled={tab.disabled}
+      >
+        {tab.name}
+      </EuiTab>
+    ));
+  };
+
+  return (
+    <>
+      <EuiTabs size="s">{renderTabs()}</EuiTabs>
+      <EuiPanel paddingSize="m" color="transparent" hasBorder={false}>
+        {selectedTabContent}
+      </EuiPanel>
+    </>
+  );
+};

src/plugins/data_source_management/public/components/create_data_source_wizard/components/authentication_tabs/index.ts

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { AuthenticationTabs, AuthenticationTabItem } from './authentication_tabs';

src/plugins/data_source_management/public/components/create_data_source_wizard/components/create_new_credential/create_new_credential.scss

@@ -0,0 +1,18 @@
+.datasource-create-new-credential-row-reverse {
+  & .euiFlexGroup--directionRow {
+    flex-direction: row-reverse !important;
+  }
+
+  &.euiDescribedFormGroup + * {
+    margin-top: 0 !important;
+  }
+
+  & .euiDescribedFormGroup__fields {
+    padding-top: 0 !important;
+  }
+
+  & .euiDescribedFormGroup__description {
+    background: #fcfcfc;
+    padding: 10px;
+  }
+}