From fec5e3d0c2f67269a2a07aa1bbe3e7f7cd43deb5 Mon Sep 17 00:00:00 2001 From: Louis Chu Date: Thu, 4 Aug 2022 16:01:53 -0700 Subject: [PATCH] Fix breadcrumb on listing page and update saved object mapping (#2069) Signed-off-by: Louis Chu --- .../public/components/breadcrumbs.ts | 8 ++++---- .../create_credential_wizard.tsx | 14 ++++++++------ .../credential_table/credentials_table.tsx | 6 +++++- .../components/edit_credential/edit_credential.tsx | 11 +++++------ .../edit_credential/edit_credential_page.tsx | 2 +- .../public/components/types.ts | 3 ++- .../public/components/utils.ts | 6 +++--- .../management_app/mount_management_section.tsx | 8 ++++++++ .../saved_objects/credential_saved_objects_type.ts | 9 ++++----- 9 files changed, 40 insertions(+), 27 deletions(-) diff --git a/src/plugins/credential_management/public/components/breadcrumbs.ts b/src/plugins/credential_management/public/components/breadcrumbs.ts index 5a297b88171d..b4a416eb152c 100644 --- a/src/plugins/credential_management/public/components/breadcrumbs.ts +++ b/src/plugins/credential_management/public/components/breadcrumbs.ts @@ -22,19 +22,19 @@ export function getCreateBreadcrumbs() { ...getListBreadcrumbs(), { text: i18n.translate('credentialManagement.credentials.createBreadcrumb', { - defaultMessage: 'Create credentials', + defaultMessage: 'Create Stored Credential', }), href: `/create`, }, ]; } -export function getEditBreadcrumbs(credentials: CredentialEditPageItem) { +export function getEditBreadcrumbs(credential: CredentialEditPageItem) { return [ ...getListBreadcrumbs(), { - text: credentials.title, - href: `/${credentials.id}`, + text: credential.title, + href: `/${credential.id}`, }, ]; } diff --git a/src/plugins/credential_management/public/components/create_credential_wizard/create_credential_wizard.tsx b/src/plugins/credential_management/public/components/create_credential_wizard/create_credential_wizard.tsx index 6eeb57ebcf53..366c5831322b 100644 --- a/src/plugins/credential_management/public/components/create_credential_wizard/create_credential_wizard.tsx +++ b/src/plugins/credential_management/public/components/create_credential_wizard/create_credential_wizard.tsx @@ -29,7 +29,8 @@ import { context as contextType } from '../../../../opensearch_dashboards_react/ interface CreateCredentialWizardState { credentialName: string; - credentialType: string; + authType: string; + credentialMaterialsType: string; userName: string; password: string; dual: boolean; @@ -50,7 +51,8 @@ export class CreateCredentialWizard extends React.Component< this.state = { credentialName: '', - credentialType: 'username_password_credential', + authType: 'shared', + credentialMaterialsType: 'username_password_credential', userName: '', password: '', dual: true, @@ -119,7 +121,7 @@ export class CreateCredentialWizard extends React.Component< > this.setState({ credentialType: e.target.value })} + onChange={(e) => this.setState({ credentialMaterialsType: e.target.value })} options={options} /> @@ -176,9 +178,9 @@ export class CreateCredentialWizard extends React.Component< // TODO: Add rendering spanner https://github.com/opensearch-project/OpenSearch-Dashboards/issues/2050 await savedObjects.client.create('credential', { title: this.state.credentialName, - credentialType: this.state.credentialType, + authType: this.state.authType, credentialMaterials: { - credentialMaterialsType: this.state.credentialType, + credentialMaterialsType: this.state.credentialMaterialsType, credentialMaterialsContent: { userName: this.state.userName, password: this.state.password, @@ -190,7 +192,7 @@ export class CreateCredentialWizard extends React.Component< const createCredentialFailMsg = ( ); this.setState((prevState) => ({ diff --git a/src/plugins/credential_management/public/components/credential_table/credentials_table.tsx b/src/plugins/credential_management/public/components/credential_table/credentials_table.tsx index 437e1a8ca2f1..18822eff7595 100644 --- a/src/plugins/credential_management/public/components/credential_table/credentials_table.tsx +++ b/src/plugins/credential_management/public/components/credential_table/credentials_table.tsx @@ -28,6 +28,7 @@ import { useOpenSearchDashboards, } from '../../../../opensearch_dashboards_react/public'; +import { getListBreadcrumbs } from '../breadcrumbs'; import { CredentialManagementContext } from '../../types'; import { deleteCredentials, getCredentials } from '../utils'; import { CredentialsTableItem } from '../types'; @@ -66,6 +67,9 @@ export const CredentialsTable = ({ canSave, history }: Props) => { const [credentials, setCredentials] = React.useState([]); const [selectedCredentials, setSelectedCredentials] = React.useState([]); + const { setBreadcrumbs } = useOpenSearchDashboards().services; + setBreadcrumbs(getListBreadcrumbs()); + const { savedObjects, uiSettings } = useOpenSearchDashboards< CredentialManagementContext >().services; @@ -101,7 +105,7 @@ export const CredentialsTable = ({ canSave, history }: Props) => { sortable: ({ sort }: { sort: string }) => sort, }, { - field: 'credentialType', + field: 'credentialMaterialsType', name: 'Credential Type', truncateText: true, mobileOptions: { diff --git a/src/plugins/credential_management/public/components/edit_credential/edit_credential.tsx b/src/plugins/credential_management/public/components/edit_credential/edit_credential.tsx index 3e9e4880097a..9ef8e459bce5 100644 --- a/src/plugins/credential_management/public/components/edit_credential/edit_credential.tsx +++ b/src/plugins/credential_management/public/components/edit_credential/edit_credential.tsx @@ -30,7 +30,7 @@ import { CredentialEditPageItem } from '../types'; interface EditCredentialState { credentialName: string; - credentialType: string; + credentialMaterialsType: string; userName: string; password: string; dual: boolean; @@ -55,7 +55,7 @@ export class EditCredentialComponent extends React.Component< this.state = { credentialName: props.credential.title, - credentialType: props.credential.credentialType, + credentialMaterialsType: props.credential.credentialMaterialsType, userName: '', password: '', dual: true, @@ -114,7 +114,7 @@ export class EditCredentialComponent extends React.Component< > this.setState({ credentialType: e.target.value })} + onChange={(e) => this.setState({ credentialMaterialsType: e.target.value })} options={options} /> @@ -171,9 +171,8 @@ export class EditCredentialComponent extends React.Component< // TODO: Add rendering spanner https://github.com/opensearch-project/OpenSearch-Dashboards/issues/2050 await savedObjects.client.update('credential', this.props.credential.id, { title: this.state.credentialName, - credentialType: this.state.credentialType, credentialMaterials: { - credentialMaterialsType: this.state.credentialType, + credentialMaterialsType: this.state.credentialMaterialsType, credentialMaterialsContent: { userName: this.state.userName, password: this.state.password, @@ -185,7 +184,7 @@ export class EditCredentialComponent extends React.Component< const editCredentialFailMsg = ( ); this.setState((prevState) => ({ diff --git a/src/plugins/credential_management/public/components/edit_credential/edit_credential_page.tsx b/src/plugins/credential_management/public/components/edit_credential/edit_credential_page.tsx index b725c0ab84d4..9e1d84728955 100644 --- a/src/plugins/credential_management/public/components/edit_credential/edit_credential_page.tsx +++ b/src/plugins/credential_management/public/components/edit_credential/edit_credential_page.tsx @@ -21,7 +21,7 @@ const EditCredentialPage: React.FC> = ({ ... const object = { id: savedObject.id, title: savedObject.attributes.title, - credentialType: savedObject.attributes.credentialType, + credentialMaterialsType: savedObject.attributes.credentialMaterials.credentialMaterialsType, }; setCredential(object); setBreadcrumbs(getEditBreadcrumbs(object)); diff --git a/src/plugins/credential_management/public/components/types.ts b/src/plugins/credential_management/public/components/types.ts index caa10cca2f22..79e7cb388b0c 100644 --- a/src/plugins/credential_management/public/components/types.ts +++ b/src/plugins/credential_management/public/components/types.ts @@ -6,11 +6,12 @@ export interface CredentialsTableItem { id: string; title: string; + credentialMaterialsType: string; sort: string; } export interface CredentialEditPageItem { id: string; title: string; - credentialType: string; + credentialMaterialsType: string; } diff --git a/src/plugins/credential_management/public/components/utils.ts b/src/plugins/credential_management/public/components/utils.ts index a92b754e627e..3fad1ef196be 100644 --- a/src/plugins/credential_management/public/components/utils.ts +++ b/src/plugins/credential_management/public/components/utils.ts @@ -10,7 +10,7 @@ export async function getCredentials(savedObjectsClient: SavedObjectsClientContr return await (savedObjectsClient .find({ type: 'credential', - fields: ['id', 'title', 'credentialType'], + fields: ['id', 'title', 'credentialMaterials'], perPage: 10000, }) .then((response) => @@ -18,11 +18,11 @@ export async function getCredentials(savedObjectsClient: SavedObjectsClientContr .map((source) => { const id = source.id; const title = source.get('title'); - const credentialType = source.get('credentialType'); + const credentialMaterialsType = source.get('credentialMaterials').credentialMaterialsType; return { id, title, - credentialType, + credentialMaterialsType, sort: `${title}`, }; }) diff --git a/src/plugins/credential_management/public/management_app/mount_management_section.tsx b/src/plugins/credential_management/public/management_app/mount_management_section.tsx index 861a600fa81c..807ac82fa448 100644 --- a/src/plugins/credential_management/public/management_app/mount_management_section.tsx +++ b/src/plugins/credential_management/public/management_app/mount_management_section.tsx @@ -6,6 +6,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import { Router, Switch, Route } from 'react-router-dom'; +import { i18n } from '@osd/i18n'; import { I18nProvider } from '@osd/i18n/react'; import { StartServicesAccessor } from 'src/core/public'; @@ -38,6 +39,13 @@ export async function mountManagementSection( setBreadcrumbs: params.setBreadcrumbs, }; + /* Browser - Page Title */ + const title = i18n.translate('credentialManagement.objects.credentialsTitle', { + defaultMessage: 'Credentials', + }); + + chrome.docTitle.change(title); + ReactDOM.render( diff --git a/src/plugins/data_source/server/saved_objects/credential_saved_objects_type.ts b/src/plugins/data_source/server/saved_objects/credential_saved_objects_type.ts index adab9f3e4d76..644592206d95 100644 --- a/src/plugins/data_source/server/saved_objects/credential_saved_objects_type.ts +++ b/src/plugins/data_source/server/saved_objects/credential_saved_objects_type.ts @@ -11,7 +11,8 @@ export const credential: SavedObjectsType = { namespaceType: 'agnostic', management: { defaultSearchField: 'title', - importableAndExportable: true, + // TODO: Support import / export https://github.com/opensearch-project/OpenSearch-Dashboards/issues/1872 + importableAndExportable: false, getTitle(obj) { return obj.attributes.title; }, @@ -28,10 +29,8 @@ export const credential: SavedObjectsType = { mappings: { dynamic: false, properties: { - title: { type: 'text', index: false }, - credentialType: { type: 'keyword', index: false }, - credentialMaterials: { type: 'object' }, - description: { type: 'text', index: false }, + title: { type: 'text' }, + authType: { type: 'keyword' }, }, }, migrations: {},