refactor: Update import statements for UserProfile component to use FileUtil.getFileRoute instead of FileUtil.getFileURL

App/FeatureSet/Home/Views/Partials/copilot.ejs

@@ -111,7 +111,7 @@
                 </svg>
                 
                 <span><strong class="font-semibold text-gray-900">
-                    We don't store or train on your code.
+                    We don't see, store or train on your code.
                   </strong>
                   Regardless whether you are on the free tier or enterprise tier, we don't store or train on your code. No part of your code is sent to us.
                 </span>

Common/Types/Monitor/MonitorStep.ts

@@ -196,16 +196,6 @@ export default class MonitorStep extends DatabaseProperty {
       return "Monitor Destination is required.";
     }
 
-    if (monitorType === MonitorType.Logs) {
-      if (!value.data.logMonitor) {
-        return "Log Monitor is required";
-      }
-
-      if (!value.data.logMonitor.lastXSecondsOfLogs) {
-        return "Monitor Last Minutes of Logs is required.";
-      }
-    }
-
     if (
       !value.data.customCode &&
       (monitorType === MonitorType.CustomJavaScriptCode ||
@@ -265,7 +255,9 @@ export default class MonitorStep extends DatabaseProperty {
           screenSizeTypes: this.data.screenSizeTypes || undefined,
           browserTypes: this.data.browserTypes || undefined,
           logMonitor: this.data.logMonitor
-            ? MonitorStepLogMonitorUtil.toJSON(this.data.logMonitor)
+            ? MonitorStepLogMonitorUtil.toJSON(
+                this.data.logMonitor || MonitorStepLogMonitorUtil.getDefault(),
+              )
             : undefined,
         },
       });
@@ -360,6 +352,10 @@ export default class MonitorStep extends DatabaseProperty {
         : undefined,
     }) as any;
 
+    if (monitorStep.data && !monitorStep.data?.logMonitor) {
+      monitorStep.data.logMonitor = MonitorStepLogMonitorUtil.getDefault();
+    }
+
     return monitorStep;
   }
 

Dashboard/src/Components/Form/Monitor/LogMonitor/LogMonitorStepFrom.tsx

@@ -1,18 +1,14 @@
-import MonitorStepLogMonitor, {
-  MonitorStepLogMonitorUtil,
-} from "Common/Types/Monitor/MonitorStepLogMonitor";
+import MonitorStepLogMonitor from "Common/Types/Monitor/MonitorStepLogMonitor";
 import TelemetryService from "Common/Models/DatabaseModels/TelemetryService";
-import React, { FunctionComponent, ReactElement, useEffect } from "react";
+import React, { FunctionComponent, ReactElement } from "react";
 import BasicForm from "CommonUI/src/Components/Forms/BasicForm";
 import LogSeverity from "Common/Types/Log/LogSeverity";
 import DropdownUtil from "CommonUI/src/Utils/Dropdown";
 import FormFieldSchemaType from "CommonUI/src/Components/Forms/Types/FormFieldSchemaType";
 import Button, { ButtonStyleType } from "CommonUI/src/Components/Button/Button";
 import FieldLabelElement from "CommonUI/src/Components/Forms/Fields/FieldLabel";
-import DashboardLogsViewer from "../../../Logs/LogsViewer";
-import Query from "Common/Types/BaseDatabase/Query";
-import Log from "Common/Models/AnalyticsModels/Log";
 import HorizontalRule from "CommonUI/src/Components/HorizontalRule/HorizontalRule";
+import LogMonitorPreview from "../../../Monitor/LogMonitor/LogMonitorPreview";
 
 export interface ComponentProps {
   monitorStepLogMonitor: MonitorStepLogMonitor;
@@ -43,18 +39,6 @@ const LogMonitorStepForm: FunctionComponent<ComponentProps> = (
     showAdvancedOptionsByDefault,
   );
 
-  type RefreshQueryFunction = () => Query<Log>;
-
-  const refreshQuery: RefreshQueryFunction = (): Query<Log> => {
-    return MonitorStepLogMonitorUtil.toQuery(monitorStepLogMonitor);
-  };
-
-  const [logQuery, setLogQuery] = React.useState<Query<Log>>(refreshQuery());
-
-  useEffect(() => {
-    setLogQuery(refreshQuery());
-  }, [monitorStepLogMonitor]);
-
   return (
     <div>
       <BasicForm
@@ -207,11 +191,7 @@ const LogMonitorStepForm: FunctionComponent<ComponentProps> = (
           isHeading={true}
         />
         <div className="mt-5 mb-5">
-          <DashboardLogsViewer
-            id="logs-preview"
-            logQuery={logQuery}
-            limit={10}
-          />
+          <LogMonitorPreview monitorStepLogMonitor={monitorStepLogMonitor} />
         </div>
       </div>
     </div>

Dashboard/src/Components/Monitor/LogMonitor/LogMonitorPreview.tsx

@@ -0,0 +1,41 @@
+import React, { FunctionComponent, ReactElement, useEffect } from "react";
+import MonitorStepLogMonitor, {
+  MonitorStepLogMonitorUtil,
+} from "Common/Types/Monitor/MonitorStepLogMonitor";
+import DashboardLogsViewer from "../../Logs/LogsViewer";
+import Query from "Common/Types/BaseDatabase/Query";
+import Log from "Common/Models/AnalyticsModels/Log";
+
+export interface ComponentProps {
+  monitorStepLogMonitor: MonitorStepLogMonitor | undefined;
+}
+
+const LogMonitorPreview: FunctionComponent<ComponentProps> = (
+  props: ComponentProps,
+): ReactElement => {
+  type RefreshQueryFunction = () => Query<Log>;
+
+  const refreshQuery: RefreshQueryFunction = (): Query<Log> => {
+    if (!props.monitorStepLogMonitor) {
+      return {};
+    }
+    return MonitorStepLogMonitorUtil.toQuery(props.monitorStepLogMonitor);
+  };
+
+  const [logQuery, setLogQuery] = React.useState<Query<Log>>(refreshQuery());
+
+  useEffect(() => {
+    setLogQuery(refreshQuery());
+  }, [props.monitorStepLogMonitor]);
+
+  return (
+    <DashboardLogsViewer
+      id="logs-preview"
+      logQuery={logQuery}
+      limit={10}
+      noLogsMessage="No logs found"
+    />
+  );
+};
+
+export default LogMonitorPreview;

Dashboard/src/Pages/Monitor/View/Index.tsx

@@ -63,6 +63,7 @@ import React, {
 import useAsyncEffect from "use-async-effect";
 import RouteMap, { RouteUtil } from "../../../Utils/RouteMap";
 import PageMap from "../../../Utils/PageMap";
+import LogMonitorPreview from "../../../Components/Monitor/LogMonitor/LogMonitorPreview";
 
 const MonitorView: FunctionComponent<PageComponentProps> = (): ReactElement => {
   const modelId: ObjectID = Navigation.getLastParamAsObjectID();
@@ -186,6 +187,7 @@ const MonitorView: FunctionComponent<PageComponentProps> = (): ReactElement => {
           isAllProbesDisconnectedFromThisMonitor: true,
           telemetryMonitorLastMonitorAt: true,
           telemetryMonitorNextMonitorAt: true,
+          monitorSteps: true,
         },
       });
 
@@ -614,6 +616,27 @@ const MonitorView: FunctionComponent<PageComponentProps> = (): ReactElement => {
         }}
       />
 
+      {monitor?.monitorType === MonitorType.Logs &&
+        monitor.monitorSteps &&
+        monitor.monitorSteps.data?.monitorStepsInstanceArray &&
+        monitor.monitorSteps.data?.monitorStepsInstanceArray.length > 0 && (
+          <div>
+            <Card
+              title={"Logs Preview"}
+              description={
+                "Preview of the logs that match the filter of this monitor."
+              }
+            >
+              <LogMonitorPreview
+                monitorStepLogMonitor={
+                  monitor.monitorSteps.data?.monitorStepsInstanceArray[0]?.data
+                    ?.logMonitor
+                }
+              />
+            </Card>
+          </div>
+        )}
+
       {shouldFetchMonitorMetrics && getMonitorMetricsChartGroup()}
     </Fragment>
   );