From e75b88341cdd85dbf06249e1aacebba19cc71685 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Casper=20H=C3=BCbertz?= <casper@formgeist.com>
Date: Thu, 24 May 2018 13:34:28 +0200
Subject: [PATCH] [APM] Errors Watcher assistant - Compressed form fields
 (#19204) (#19387)

Adding `compressed` to the EuiFormRows for a more compressed looking form.
---
 .../Watcher/WatcherFlyOut.js                  | 41 +++++++++++--------
 1 file changed, 25 insertions(+), 16 deletions(-)

diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/Watcher/WatcherFlyOut.js b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/Watcher/WatcherFlyOut.js
index c9838177973b3..54c6f0a8e0322 100644
--- a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/Watcher/WatcherFlyOut.js
+++ b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/Watcher/WatcherFlyOut.js
@@ -261,6 +261,7 @@ export default class WatcherFlyout extends Component {
           <EuiFormRow
             label="Occurrences threshold per error group"
             helpText="Threshold to be met for error group to be included in report."
+            compressed
           >
             <EuiFieldNumber
               icon="number"
@@ -288,6 +289,7 @@ export default class WatcherFlyout extends Component {
 
           <EuiFormRow
             helpText={`The daily report will be sent at ${dailyTimeFormatted} / ${dailyTime12HourFormatted}.`}
+            compressed
           >
             <EuiSelect
               value={dailyTime}
@@ -309,7 +311,10 @@ export default class WatcherFlyout extends Component {
           <EuiFlexGroup>
             <EuiFlexItem grow={false}>
               <SmallInput>
-                <EuiFormRow helpText="Time interval between reports.">
+                <EuiFormRow
+                  helpText="Time interval between reports."
+                  compressed
+                >
                   <EuiFieldNumber
                     icon="clock"
                     min={1}
@@ -321,21 +326,23 @@ export default class WatcherFlyout extends Component {
               </SmallInput>
             </EuiFlexItem>
             <EuiFlexItem grow={false}>
-              <EuiSelect
-                value={this.state.interval.unit}
-                onChange={this.onChangeIntervalUnit}
-                options={[
-                  {
-                    value: 'm',
-                    text: 'mins'
-                  },
-                  {
-                    value: 'h',
-                    text: 'hrs'
-                  }
-                ]}
-                disabled={this.state.schedule !== 'interval'}
-              />
+              <EuiFormRow compressed>
+                <EuiSelect
+                  value={this.state.interval.unit}
+                  onChange={this.onChangeIntervalUnit}
+                  options={[
+                    {
+                      value: 'm',
+                      text: 'mins'
+                    },
+                    {
+                      value: 'h',
+                      text: 'hrs'
+                    }
+                  ]}
+                  disabled={this.state.schedule !== 'interval'}
+                />
+              </EuiFormRow>
             </EuiFlexItem>
           </EuiFlexGroup>
 
@@ -354,6 +361,7 @@ export default class WatcherFlyout extends Component {
           {this.state.actions.email && (
             <EuiFormRow
               label="Receipients (seperated with comma)"
+              compressed
               helpText={
                 <span>
                   If you have not configured email, please see the{' '}
@@ -384,6 +392,7 @@ export default class WatcherFlyout extends Component {
           {this.state.actions.slack && (
             <EuiFormRow
               label="Slack Webhook URL"
+              compressed
               helpText={
                 <span>
                   To get a Slack webhook, please see the{' '}