Create/Edit Scheduled Query Modal: Config destination help bubble (#1587)

* Render logging information in UI

changes/1587-surface-logging-destination

@@ -0,0 +1 @@
+* Users reminded of their logging destination when adding or modifying their schedules.

frontend/interfaces/config.ts

@@ -23,6 +23,27 @@ export default PropTypes.shape({
   user_name: PropTypes.string,
   verify_sll_certs: PropTypes.bool,
   tier: PropTypes.string,
+  logging: PropTypes.shape({
+    debug: PropTypes.bool,
+    json: PropTypes.bool,
+    result: PropTypes.shape({
+      plugin: PropTypes.string,
+      config: PropTypes.shape({
+        region: PropTypes.string,
+        status_stream: PropTypes.string,
+        result_stream: PropTypes.string,
+      }),
+    }),
+    status: PropTypes.shape({
+      plugin: PropTypes.string,
+      config: PropTypes.shape({
+        status_log_file: PropTypes.string,
+        result_log_file: PropTypes.string,
+        enable_log_rotation: PropTypes.bool,
+        enable_log_compression: PropTypes.bool,
+      }),
+    }),
+  }),
 });
 
 export interface IConfig {
@@ -48,4 +69,25 @@ export interface IConfig {
   user_name: string;
   verify_sll_certs: boolean;
   tier: string;
+  logging: {
+    debug: boolean;
+    json: boolean;
+    result: {
+      plugin: string;
+      config: {
+        region: string;
+        status_stream: string;
+        result_stream: string;
+      };
+    };
+    status: {
+      plugin: string;
+      config: {
+        status_log_file: string;
+        result_log_file: string;
+        enable_log_rotation: boolean;
+        enable_log_compression: boolean;
+      };
+    };
+  };
 }

frontend/pages/schedule/ManageSchedulePage/components/ScheduleEditorModal/ScheduleEditorModal.tsx

@@ -1,7 +1,8 @@
 /* This component is used for creating and editing both global and team scheduled queries */
 
 import React, { useState, useCallback, useEffect } from "react";
-
+// @ts-ignore
+import Fleet from "fleet";
 import { pull } from "lodash";
 // @ts-ignore
 import FleetIcon from "components/icons/FleetIcon";
@@ -61,6 +62,25 @@ const generateLoggingType = (query: IGlobalScheduledQuery) => {
   return "differential_ignore_removals";
 };
 
+const generateLoggingDestination = (loggingConfig: string): string => {
+  switch (loggingConfig) {
+    case "filesystem":
+      return "the filesystem";
+    case "firehose":
+      return "AWS Kinesis Firehose";
+    case "kinesis":
+      return "AWS Kinesis";
+    case "lambda":
+      return "AWS Lambda";
+    case "pubsub":
+      return "GCP PubSub";
+    case "stdout":
+      return "the standard output stream";
+    default:
+      return loggingConfig;
+  }
+};
+
 const ScheduleEditorModal = ({
   onCancel,
   onScheduleSubmit,
@@ -68,6 +88,24 @@ const ScheduleEditorModal = ({
   editQuery,
   teamId,
 }: IScheduleEditorModalProps): JSX.Element => {
+  const [loggingConfig, setLoggingConfig] = useState("");
+  const [isLoading, setIsLoading] = useState(true);
+  const [isLoadingError, setIsLoadingError] = useState(false);
+
+  useEffect((): void => {
+    const getConfigDestination = async (): Promise<void> => {
+      try {
+        const responseConfig = await Fleet.config.loadAll();
+        setIsLoading(false);
+        setLoggingConfig(responseConfig.logging.result.plugin);
+      } catch (err) {
+        setIsLoadingError(true);
+        setIsLoading(false);
+      }
+    };
+    getConfigDestination();
+  }, []);
+
   const [showAdvancedOptions, setShowAdvancedOptions] = useState<boolean>(
     false
   );
@@ -217,13 +255,13 @@ const ScheduleEditorModal = ({
           label={"Choose a frequency and then run this query on a schedule"}
           wrapperClassName={`${baseClass}__form-field ${baseClass}__form-field--frequency`}
         />
-        {/* <InfoBanner className={`${baseClass}__sandbox-info`}>
+        <InfoBanner className={`${baseClass}__sandbox-info`}>
           <p>
-            Your configured log destination is <b>filesystem</b>.
+            Your configured log destination is <b>{loggingConfig}</b>.
           </p>
           <p>
             This means that when this query is run on your hosts, the data will
-            be sent to the filesystem.
+            be sent to {generateLoggingDestination(loggingConfig)}.
           </p>
           <p>
             Check out the Fleet documentation on&nbsp;
@@ -236,7 +274,7 @@ const ScheduleEditorModal = ({
               <FleetIcon name="external-link" />
             </a>
           </p>
-        </InfoBanner> */}
+        </InfoBanner>
         <div>
           <Button
             variant="unstyled"