github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

[8.18] [Oblt Onboarding] Add breadcrumbs for quick start flows (#216470) (#217495)

Browse source 
# Backport

This will backport the following commits from `main` to `8.18`:
- [[Oblt Onboarding] Add breadcrumbs for quick start flows
(#216470)](https://github.com/elastic/kibana/pull/216470)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Mykola
Harmash","email":"mykola.harmash@gmail.com"},"sourceCommit":{"committedDate":"2025-04-01T11:49:09Z","message":"[Oblt
Onboarding] Add breadcrumbs for quick start flows (#216470)\n\nCloses
https://github.com/elastic/kibana/issues/191646\n\nThis change adds
breadcrumbs to the project navigation bar for every\nquickstart
flow.\n\n| Classic Navigation | Solution Navigation |\n| --- | --- |\n|
![CleanShot 2025-03-31 at 15
32\n08@2x](https://github.com/user-attachments/assets/d9489e9c-1df1-43f2-99ec-b82128a1be85)\n|
![CleanShot 2025-03-31 at 15
31\n13@2x](https://github.com/user-attachments/assets/28180e0b-da00-4773-b9e5-a4d7e1c97424)\n|","sha":"fcc7244da2b801ce5e59017a00e3ce19a20b01ce","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","backport
missing","backport:prev-minor","ci:project-deploy-observability","Feature:
Observability Onboarding"],"title":"[Oblt Onboarding] Add breadcrumbs
for quick start
flows","number":216470,"url":"https://github.com/elastic/kibana/pull/216470","mergeCommit":{"message":"[Oblt
Onboarding] Add breadcrumbs for quick start flows (#216470)\n\nCloses
https://github.com/elastic/kibana/issues/191646\n\nThis change adds
breadcrumbs to the project navigation bar for every\nquickstart
flow.\n\n| Classic Navigation | Solution Navigation |\n| --- | --- |\n|
![CleanShot 2025-03-31 at 15
32\n08@2x](https://github.com/user-attachments/assets/d9489e9c-1df1-43f2-99ec-b82128a1be85)\n|
![CleanShot 2025-03-31 at 15
31\n13@2x](https://github.com/user-attachments/assets/28180e0b-da00-4773-b9e5-a4d7e1c97424)\n|","sha":"fcc7244da2b801ce5e59017a00e3ce19a20b01ce"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[]}]
BACKPORT-->
This commit is contained in:
Mykola Harmash 2025-04-09 14:35:24 +02:00 • committed by GitHub
parent b0906caf93
commit 5c5d8e3638
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 58 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

3
x-pack/solutions/observability/plugins/observability_onboarding/public/application/observability_onboarding_flow.tsx
View file

@ -21,6 +21,7 @@ import {
FirehosePage,
} from './pages';
import { ObservabilityOnboardingAppServices } from '..';
import { useFlowBreadcrumb } from './shared/use_flow_breadcrumbs';
const queryClient = new QueryClient();
@ -32,6 +33,8 @@ export function ObservabilityOnboardingFlow() {
},
} = useKibana<ObservabilityOnboardingAppServices>();
useFlowBreadcrumb(null);
useEffect(() => {
window.scrollTo(0, 0);
}, [pathname]);

7
x-pack/solutions/observability/plugins/observability_onboarding/public/application/quickstart_flows/auto_detect/auto_detect_panel.tsx
View file

@ -37,8 +37,15 @@ import { isSupportedLogo, LogoIcon } from '../../shared/logo_icon';
import { FeedbackButtons } from '../shared/feedback_buttons';
import { ObservabilityOnboardingContextValue } from '../../../plugin';
import { SupportedIntegrationsList } from './supported_integrations_list';
import { useFlowBreadcrumb } from '../../shared/use_flow_breadcrumbs';
export const AutoDetectPanel: FunctionComponent = () => {
useFlowBreadcrumb({
text: i18n.translate(
'xpack.observability_onboarding.autoDetectPanel.breadcrumbs.autoDetectLabel',
{ defaultMessage: 'Elastic Agent: Logs & Metrics' }
),
});
const { status, data, error, refetch, installedIntegrations } = useOnboardingFlow();
const command = data ? getAutoDetectCommand(data) : undefined;
const accordionId = useGeneratedHtmlId({ prefix: 'accordion' });

7
x-pack/solutions/observability/plugins/observability_onboarding/public/application/quickstart_flows/firehose/index.tsx
View file

@ -34,6 +34,7 @@ import { ObservabilityOnboardingAppServices } from '../../..';
import { useWindowBlurDataMonitoringTrigger } from '../shared/use_window_blur_data_monitoring_trigger';
import { ExistingDataCallout } from './existing_data_callout';
import { usePopulatedAWSIndexList } from './use_populated_aws_index_list';
import { useFlowBreadcrumb } from '../../shared/use_flow_breadcrumbs';
const OPTIONS = [
{
@ -55,6 +56,12 @@ const OPTIONS = [
];
export function FirehosePanel() {
useFlowBreadcrumb({
text: i18n.translate('xpack.observability_onboarding.autoDetectPanel.breadcrumbs.firehose', {
defaultMessage: 'AWS Firehose',
}),
});
const [selectedOptionId, setSelectedOptionId] = useState<CreateStackOption>(
CreateStackOption.AWS_CONSOLE_UI
);

6
x-pack/solutions/observability/plugins/observability_onboarding/public/application/quickstart_flows/kubernetes/index.tsx
View file

@ -23,8 +23,14 @@ import { DataIngestStatus } from './data_ingest_status';
import { FeedbackButtons } from '../shared/feedback_buttons';
import { useKubernetesFlow } from './use_kubernetes_flow';
import { useWindowBlurDataMonitoringTrigger } from '../shared/use_window_blur_data_monitoring_trigger';
import { useFlowBreadcrumb } from '../../shared/use_flow_breadcrumbs';
export const KubernetesPanel: React.FC = () => {
useFlowBreadcrumb({
text: i18n.translate('xpack.observability_onboarding.autoDetectPanel.breadcrumbs.k8s', {
defaultMessage: 'Kubernetes: Logs & Metrics',
}),
});
const { data, status, error, refetch } = useKubernetesFlow();
const { onPageReady } = usePerformanceContext();

6
x-pack/solutions/observability/plugins/observability_onboarding/public/application/quickstart_flows/otel_kubernetes/otel_kubernetes_panel.tsx
View file

@ -33,12 +33,18 @@ import { FeedbackButtons } from '../shared/feedback_buttons';
import { CopyToClipboardButton } from '../shared/copy_to_clipboard_button';
import { ObservabilityOnboardingContextValue } from '../../../plugin';
import { useKubernetesFlow } from '../kubernetes/use_kubernetes_flow';
import { useFlowBreadcrumb } from '../../shared/use_flow_breadcrumbs';
const OTEL_HELM_CHARTS_REPO = 'https://open-telemetry.github.io/opentelemetry-helm-charts';
const OTEL_KUBE_STACK_VERSION = '0.3.9';
const CLUSTER_OVERVIEW_DASHBOARD_ID = 'kubernetes_otel-cluster-overview';
export const OtelKubernetesPanel: React.FC = () => {
useFlowBreadcrumb({
text: i18n.translate('xpack.observability_onboarding.autoDetectPanel.breadcrumbs.k8sOtel', {
defaultMessage: 'Kubernetes: OpenTelemetry',
}),
});
const { data, error, refetch } = useKubernetesFlow('kubernetes_otel');
const [idSelected, setIdSelected] = useState('nodejs');
const {

6
x-pack/solutions/observability/plugins/observability_onboarding/public/application/quickstart_flows/otel_logs/index.tsx
View file

@ -35,6 +35,7 @@ import { useFetcher } from '../../../hooks/use_fetcher';
import { MultiIntegrationInstallBanner } from './multi_integration_install_banner';
import { EmptyPrompt } from '../shared/empty_prompt';
import { FeedbackButtons } from '../shared/feedback_buttons';
import { useFlowBreadcrumb } from '../../shared/use_flow_breadcrumbs';
const HOST_COMMAND = i18n.translate(
'xpack.observability_onboarding.otelLogsPanel.p.runTheCommandOnYourHostLabel',
@ -45,6 +46,11 @@ const HOST_COMMAND = i18n.translate(
);
export const OtelLogsPanel: React.FC = () => {
useFlowBreadcrumb({
text: i18n.translate('xpack.observability_onboarding.autoDetectPanel.breadcrumbs.otelHost', {
defaultMessage: 'OpenTelemetry: Logs & Metrics',
}),
});
const { onPageReady } = usePerformanceContext();
const {
data: apiKeyData,

23
x-pack/solutions/observability/plugins/observability_onboarding/public/application/shared/use_flow_breadcrumbs.ts Normal file
View file

@ -0,0 +1,23 @@
/*
* 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 { ChromeBreadcrumb } from '@kbn/core/public';
import { i18n } from '@kbn/i18n';
import { useBreadcrumbs } from '@kbn/observability-shared-plugin/public';
export function useFlowBreadcrumb(breadcrumb: ChromeBreadcrumb | null) {
useBreadcrumbs(breadcrumb !== null ? [breadcrumb] : [], {
app: {
id: 'observabilityOnboarding',
label: i18n.translate(
'xpack.observability_onboarding.otelKubernetesPanel.breadcrumbs.addDataLabel',
{ defaultMessage: 'Add Data' }
),
},
absoluteProjectStyleBreadcrumbs: false,
});
}