From 908afe0bae96c8f38b138da4fe8184470f4ce4b0 Mon Sep 17 00:00:00 2001
From: shahzad <shahzad31comp@gmail.com>
Date: Mon, 11 Nov 2019 21:56:24 +0100
Subject: [PATCH] added height for snapshot como

---
 .../public/components/functional/snapshot.tsx | 21 +++++++++++++------
 .../components/functional/status_panel.tsx    |  2 +-
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/snapshot.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/snapshot.tsx
index 8d89e53a41a45d..ddc6df14c2adee 100644
--- a/x-pack/legacy/plugins/uptime/public/components/functional/snapshot.tsx
+++ b/x-pack/legacy/plugins/uptime/public/components/functional/snapshot.tsx
@@ -21,16 +21,22 @@ interface SnapshotQueryResult {
   snapshot?: SnapshotType;
 }
 
+interface SnapshotProps {
+  /**
+   * Height is needed, since by default charts takes height of 100%
+   */
+  height?: string;
+}
+
+export type SnapshotComponentProps = SnapshotProps & UptimeGraphQLQueryProps<SnapshotQueryResult>;
+
 /**
  * This component visualizes a KPI and histogram chart to help users quickly
  * glean the status of their uptime environment.
  * @param props the props required by the component
  */
-export const SnapshotComponent = ({
-  data,
-  loading,
-}: UptimeGraphQLQueryProps<SnapshotQueryResult>) => (
-  <ChartWrapper loading={loading}>
+export const SnapshotComponent = ({ data, loading, height }: SnapshotComponentProps) => (
+  <ChartWrapper loading={loading} height={height}>
     <SnapshotHeading
       down={get<number>(data, 'snapshot.counts.down', 0)}
       total={get<number>(data, 'snapshot.counts.total', 0)}
@@ -49,4 +55,7 @@ export const SnapshotComponent = ({
  * This component visualizes a KPI and histogram chart to help users quickly
  * glean the status of their uptime environment.
  */
-export const Snapshot = withUptimeGraphQL<SnapshotQueryResult>(SnapshotComponent, snapshotQuery);
+export const Snapshot = withUptimeGraphQL<SnapshotQueryResult, SnapshotProps>(
+  SnapshotComponent,
+  snapshotQuery
+);
diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/status_panel.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/status_panel.tsx
index e941c2dad87d2d..3ca2b0058945b6 100644
--- a/x-pack/legacy/plugins/uptime/public/components/functional/status_panel.tsx
+++ b/x-pack/legacy/plugins/uptime/public/components/functional/status_panel.tsx
@@ -23,7 +23,7 @@ export const StatusPanel = ({
   <EuiPanel>
     <EuiFlexGroup gutterSize="l">
       <EuiFlexItem grow={2}>
-        <Snapshot variables={sharedProps} />
+        <Snapshot variables={sharedProps} height="160px" />
       </EuiFlexItem>
       <EuiFlexItem grow={10}>
         <SnapshotHistogram