diff --git a/public/components/experiment_warning/__tests__/index.test.tsx b/public/components/experiment_warning/__tests__/index.test.tsx new file mode 100644 index 00000000..ab50552e --- /dev/null +++ b/public/components/experiment_warning/__tests__/index.test.tsx @@ -0,0 +1,25 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ +import React from 'react'; +import { render, screen } from '../../../../test/test_utils'; +import { ExperimentalWarning } from '..'; + +describe('', () => { + it('should navigate to # when clicking link of "Machine Learning Documentation"', () => { + render(); + const link = screen.getByText('Machine Learning Documentation'); + expect(link.getAttribute('href')).toBe( + 'https://opensearch.org/docs/latest/ml-commons-plugin/ml-dashbaord/' + ); + }); + + it('should navigate to # when clicking forum.opensearch.org', () => { + render(); + const link = screen.getByText('forum.opensearch.org'); + expect(link.getAttribute('href')).toBe( + 'https://forum.opensearch.org/t/feedback-ml-commons-ml-model-health-dashboard-for-admins-experimental-release/12494' + ); + }); +}); diff --git a/public/components/experiment_warning/index.tsx b/public/components/experiment_warning/index.tsx new file mode 100644 index 00000000..668fcc0a --- /dev/null +++ b/public/components/experiment_warning/index.tsx @@ -0,0 +1,27 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ +import React from 'react'; + +import { EuiCallOut, EuiLink } from '@elastic/eui'; + +export const ExperimentalWarning = () => { + return ( + + The feature is experimental and should not be used in a production environment. For more + information, see{' '} + + Machine Learning Documentation + + . To leave feedback, visit{' '} + + forum.opensearch.org + + . + + ); +}; diff --git a/public/components/monitoring/index.tsx b/public/components/monitoring/index.tsx index dea2a7aa..cf4b1745 100644 --- a/public/components/monitoring/index.tsx +++ b/public/components/monitoring/index.tsx @@ -16,6 +16,7 @@ import React, { useState, useRef, useCallback } from 'react'; import { RefreshInterval } from '../common/refresh_interval'; import { PreviewPanel } from '../preview_panel'; +import { ExperimentalWarning } from '../experiment_warning'; import { ModelDeploymentItem, ModelDeploymentTable } from './model_deployment_table'; import { useMonitoring } from './use_monitoring'; import { ModelStatusFilter } from './model_status_filter'; @@ -68,6 +69,7 @@ export const Monitoring = () => { return (
+