add custom code monitor summary

Dashboard/src/Components/Monitor/SummaryView/CustomCodeMonitorSummaryView.tsx

@@ -0,0 +1,33 @@
+import CustomCodeMonitorResponse from "Common/Types/Monitor/CustomCodeMonitor/CustomCodeMonitorResponse";
+import ProbeMonitorResponse from "Common/Types/Probe/ProbeMonitorResponse";
+import ErrorMessage from "Common/UI/Components/ErrorMessage/ErrorMessage";
+import React, { FunctionComponent, ReactElement } from "react";
+import CustomMonitorSummaryView from "./CustomMonitorSummaryView";
+
+export interface ComponentProps {
+  probeMonitorResponse: ProbeMonitorResponse;
+  moreDetailElement?: ReactElement | undefined;
+}
+
+const CustomCodeMonitorSummaryView: FunctionComponent<ComponentProps> = (
+  props: ComponentProps,
+): ReactElement => {
+  if (!props.probeMonitorResponse.customCodeMonitorResponse) {
+    return (
+      <ErrorMessage error="No summary available for the selected probe. Should be few minutes for summary to show up. " />
+    );
+  }
+
+  const customCodeMonitorResponse: CustomCodeMonitorResponse =
+    props.probeMonitorResponse.customCodeMonitorResponse;
+
+  return (
+    <CustomMonitorSummaryView
+      customCodeMonitorResponse={customCodeMonitorResponse}
+      moreDetailElement={props.moreDetailElement}
+      monitoredAt={props.probeMonitorResponse.monitoredAt}
+    />
+  );
+};
+
+export default CustomCodeMonitorSummaryView;

Dashboard/src/Components/Monitor/SummaryView/CustomMonitorSummaryView.tsx

@@ -10,11 +10,11 @@ import React, { FunctionComponent, ReactElement } from "react";
 
 export interface ComponentProps {
   customCodeMonitorResponse: CustomCodeMonitorResponse;
-  moreDetailElement?: ReactElement;
+  moreDetailElement?: ReactElement | undefined;
   monitoredAt: Date;
 }
 
-const CustomCodeMonitorSummaryView: FunctionComponent<ComponentProps> = (
+const CustomMonitorSummaryView: FunctionComponent<ComponentProps> = (
   props: ComponentProps,
 ): ReactElement => {
   if (!props.customCodeMonitorResponse) {
@@ -137,4 +137,4 @@ const CustomCodeMonitorSummaryView: FunctionComponent<ComponentProps> = (
   );
 };
 
-export default CustomCodeMonitorSummaryView;
+export default CustomMonitorSummaryView;

Dashboard/src/Components/Monitor/SummaryView/SummaryInfo.tsx

@@ -14,6 +14,7 @@ import ErrorMessage from "Common/UI/Components/ErrorMessage/ErrorMessage";
 import React, { FunctionComponent, ReactElement } from "react";
 import TelemetryMonitorSummaryView from "./TelemetryMonitorView";
 import TelemetryMonitorSummary from "./Types/TelemetryMonitorSummary";
+import CustomCodeMonitorSummaryView from "./CustomCodeMonitorSummaryView";
 
 export interface ComponentProps {
   monitorType: MonitorType;
@@ -89,6 +90,15 @@ const SummaryInfo: FunctionComponent<ComponentProps> = (
       );
     }
 
+    if (props.monitorType === MonitorType.CustomJavaScriptCode) {
+      return (
+        <CustomCodeMonitorSummaryView
+          key={key}
+          probeMonitorResponse={probeMonitorResponse}
+        />
+      );
+    }
+
     return <></>;
   };