From 98b0c722626adcc6e80e4915f3c70ed93c7359f3 Mon Sep 17 00:00:00 2001
From: Joe Reuter <johannes.reuter@elastic.co>
Date: Tue, 16 Jul 2024 09:57:12 +0200
Subject: [PATCH] OTel Onboarding: Add feedback button (#188216)

As a last-minute addition, this is adding a feedback button to the OTel
flow so users have a way of leaving feedback:

<img width="1413" alt="Screenshot 2024-07-12 at 15 16 38"
src="https://github.com/user-attachments/assets/61c5529d-8956-49f4-84b7-b977eb179f74">

The button is linking to https://ela.st/otel-onboarding-feedback which
will redirect to a targeted google form feedback form.

This PR is not attempting to close
https://github.com/elastic/observability-dev/issues/3734 - for this, we
need to add a few other things and I would like to decouple this from
the 8.15 release.

(cherry picked from commit 735eb52dd6cdfc47109dd1fcaf22b1a9a264f7cf)
---
 .../quickstart_flows/otel_logs/index.tsx      | 36 ++++++++++++++++++-
 1 file changed, 35 insertions(+), 1 deletion(-)

diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/otel_logs/index.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/otel_logs/index.tsx
index 9ba3990315d0d..b8750155e4bc1 100644
--- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/otel_logs/index.tsx
+++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/otel_logs/index.tsx
@@ -25,6 +25,7 @@ import {
   EuiLink,
   EuiImage,
   EuiCallOut,
+  EuiHorizontalRule,
 } from '@elastic/eui';
 import {
   AllDatasetsLocatorParams,
@@ -39,6 +40,8 @@ import { ApiKeyBanner } from '../custom_logs/api_key_banner';
 import { useFetcher } from '../../../hooks/use_fetcher';
 import { MultiIntegrationInstallBanner } from './multi_integration_install_banner';
 
+const feedbackUrl = 'https://ela.st/otelcollector';
+
 const HOST_COMMAND = i18n.translate(
   'xpack.observability_onboarding.otelLogsPanel.p.runTheCommandOnYourHostLabel',
   {
@@ -641,7 +644,7 @@ rm ./otel.yml && cp ./otel_samples/platformlogs_hostmetrics.yml ./otel.yml && mk
         </EuiModalHeaderTitle>
       </EuiModalHeader>
       <EuiModalBody>
-        <EuiFlexGroup direction="column">
+        <EuiFlexGroup direction="column" gutterSize="none">
           <MultiIntegrationInstallBanner />
           {error && (
             <EuiFlexItem>
@@ -885,6 +888,37 @@ rm ./otel.yml && cp ./otel_samples/platformlogs_hostmetrics.yml ./otel.yml && mk
               },
             ]}
           />
+          <EuiHorizontalRule />
+
+          <EuiFlexGroup responsive={false} direction="row" alignItems="center" gutterSize="s" wrap>
+            <EuiFlexItem grow={false}>
+              <EuiText color="subdued" size="s">
+                {i18n.translate(
+                  'xpack.observability_onboarding.otelLogsPanel.feedbackButtons.label',
+                  {
+                    defaultMessage: 'Was this helpful or were there any problems?',
+                  }
+                )}
+              </EuiText>
+            </EuiFlexItem>
+
+            <EuiFlexItem grow={false}>
+              <EuiButton
+                iconType="editorComment"
+                data-test-subj="observabilityOnboardingOtelLogsPanelGiveFeedbackButton"
+                href={feedbackUrl}
+                color="warning"
+                target="_blank"
+              >
+                {i18n.translate(
+                  'xpack.observability_onboarding.otelLogsPanel.feedbackButtons.title',
+                  {
+                    defaultMessage: 'Give feedback',
+                  }
+                )}
+              </EuiButton>
+            </EuiFlexItem>
+          </EuiFlexGroup>
         </EuiFlexGroup>
       </EuiModalBody>
     </EuiPanel>