[Logs onboarding] Added give feedback button (#159455)

Relates to https://github.com/elastic/kibana/issues/158843.

This PR adds `Give feedback` button on top of observability onboarding
pages.

<img width="1771" alt="image"
src="88e39ae7-c9dc-4226-bb61-a011c2b2c831">
This commit is contained in:
Yngrid Coello 2023-06-12 17:25:27 +02:00 committed by GitHub
parent daf81aae39
commit 5fd356a3d7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 44 additions and 6 deletions

View file

@ -8,8 +8,8 @@
import { EuiErrorBoundary } from '@elastic/eui';
import { Theme, ThemeProvider } from '@emotion/react';
import {
APP_WRAPPER_CLASS,
AppMountParameters,
APP_WRAPPER_CLASS,
CoreStart,
} from '@kbn/core/public';
import { i18n } from '@kbn/i18n';
@ -19,16 +19,18 @@ import {
RedirectAppLinks,
useUiSetting$,
} from '@kbn/kibana-react-plugin/public';
import { HeaderMenuPortal } from '@kbn/observability-shared-plugin/public';
import { Route } from '@kbn/shared-ux-router';
import { euiDarkVars, euiLightVars } from '@kbn/ui-theme';
import React from 'react';
import ReactDOM from 'react-dom';
import {
Router,
Switch,
RouteComponentProps,
RouteProps,
Router,
Switch,
} from 'react-router-dom';
import { ObservabilityOnboardingHeaderActionMenu } from '../components/app/header_action_menu';
import {
ObservabilityOnboardingPluginSetupDeps,
ObservabilityOnboardingPluginStartDeps,
@ -105,7 +107,7 @@ export function ObservabilityOnboardingAppRoot({
deps: ObservabilityOnboardingPluginSetupDeps;
corePlugins: ObservabilityOnboardingPluginStartDeps;
}) {
const { history } = appMountParameters;
const { history, setHeaderActionMenu, theme$ } = appMountParameters;
const i18nCore = core.i18n;
const plugins = { ...deps };
@ -123,7 +125,7 @@ export function ObservabilityOnboardingAppRoot({
}}
>
<KibanaThemeProvider
theme$={appMountParameters.theme$}
theme$={theme$}
modify={{
breakpoint: {
xxl: 1600,
@ -134,6 +136,12 @@ export function ObservabilityOnboardingAppRoot({
<i18nCore.Context>
<Router history={history}>
<EuiErrorBoundary>
<HeaderMenuPortal
setHeaderActionMenu={setHeaderActionMenu}
theme$={theme$}
>
<ObservabilityOnboardingHeaderActionMenu />
</HeaderMenuPortal>
<ObservabilityOnboardingApp />
</EuiErrorBoundary>
</Router>

View file

@ -0,0 +1,30 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
import { EuiButton } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
const OBSERVABILITY_ONBOARDING_FEEDBACK_LINK =
'https://ela.st/logs-onboarding-feedback';
export function ObservabilityOnboardingHeaderActionMenu() {
return (
<EuiButton
data-test-subj="observabilityOnboardingPageGiveFeedback"
href={OBSERVABILITY_ONBOARDING_FEEDBACK_LINK}
size="s"
target="_blank"
color="warning"
iconType="editorComment"
>
{i18n.translate('xpack.observability_onboarding.header.feedback', {
defaultMessage: 'Give feedback',
})}
</EuiButton>
);
}

View file

@ -69,7 +69,7 @@ export class ObservabilityOnboardingPlugin
euiIconType: 'logoObservability',
category: DEFAULT_APP_CATEGORIES.observability,
keywords: [],
async mount(appMountParameters: AppMountParameters<unknown>) {
async mount(appMountParameters: AppMountParameters) {
// Load application bundle and Get start service
const [{ renderApp }, [coreStart, corePlugins]] = await Promise.all([
import('./application/app'),