Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[OSCI] removed KUI usage in visualizations #5462

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
- [Dashboard] Restructure the `Dashboard` plugin folder to be more cohesive with the project ([#4575](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4575))
- Refactor logo usage to centralize and optimize assets and improve tests ([#4702](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4702))
- [Home] Remove unused tutorials ([#5212](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5212))
- Remove KUI usage in `disabled_lab_visualization` ([#5462](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/5462))

### 🔩 Tests

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -29,28 +29,35 @@
*/

import { FormattedMessage } from '@osd/i18n/react';
import React from 'react';
import { EuiEmptyPrompt, EuiLink } from '@elastic/eui';
import React, { Fragment } from 'react';

export function DisabledLabVisualization({ title }: { title: string }) {
return (
<div className="visDisabledLabVisualization">
<div
className="kuiVerticalRhythm visDisabledLabVisualization__icon kuiIcon fa-flask"
aria-hidden="true"
<EuiEmptyPrompt
iconType="database"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems icon "beaker" makes a bit more sense here? cuz it is experimental?

titleSize="s"
data-test-subj="visDisabledLabVisualization"
title={
<FormattedMessage
id="visualizations.disabledLabVisualizationTitle"
defaultMessage="{title} is an experimental visualization."
values={{ title: <em className="visDisabledLabVisualizationtitle">{title}</em> }}
/>
}
body={
<Fragment>
<p>
Enable experimental visualizations within{' '}
<EuiLink href="https://github.com/app/management/opensearch-dashboards/settings">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using a url directly seems not the best way to do this? According to #3208, doc links should be from DocLinksService. Some places you could check:

  • src/core/public/doc_links/doc_links_service.ts: could add a sectionmanagement: { advancedSettingsLink: "**"} for Dashboards Management links
  • src/plugins/visualizations/public/services.ts: import DocLinksStart and add export const [getDocLinks, setDocLinks] = createGetterSetter<DocLinksStart>('docLinks');
  • src/plugins/visualizations/public/embeddable/disabled_lab_visualization.tsx: use getDocLinks to get the link and use it in href.

The links seems not correct to me as well. https://github.com/app/management/opensearch-dashboards/settings is 404. I think this https://opensearch.org/docs/latest/dashboards/management/advanced-settings/ might be the one if you are trying to direct people to instructions on how to use advanced settings.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! I wasn't completely sure about what I was supposed to link to. I'll make the appropriate changes.

Advanced Settings
</EuiLink>
.
</p>
</Fragment>
}
/>
<div className="kuiVerticalRhythm">
<FormattedMessage
id="visualizations.disabledLabVisualizationTitle"
defaultMessage="{title} is a lab visualization."
values={{ title: <em className="visDisabledLabVisualization__title">{title}</em> }}
/>
</div>
<div className="kuiVerticalRhythm">
<FormattedMessage
id="visualizations.disabledLabVisualizationMessage"
defaultMessage="Please turn on lab-mode in the advanced settings to see lab visualizations."
/>
</div>
</div>
);
}
Loading