From b18611fa9a4e7a914159ed9ad077c5d7a0fbe4cd Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Thu, 5 Oct 2023 23:22:07 +0800
Subject: [PATCH] feat: add create api for monitor

---
 src/client/api/model/monitor.ts               | 17 ++++++++++++++
 src/client/api/trpc.ts                        |  2 +-
 .../NotificationInfo/strategies/smtp.tsx      |  2 +-
 .../modals/monitor/MonitorInfoEditor.tsx      |  3 ++-
 src/client/pages/Monitor/Add.tsx              | 14 +++++++++---
 src/client/pages/Monitor/Edit.tsx             | 22 ++++++++++++++-----
 src/client/store/user.ts                      |  4 ++++
 src/server/model/monitor/index.ts             | 10 +++++++--
 src/server/model/monitor/provider/ping.ts     |  4 +++-
 9 files changed, 63 insertions(+), 15 deletions(-)
 create mode 100644 src/client/api/model/monitor.ts

diff --git a/src/client/api/model/monitor.ts b/src/client/api/model/monitor.ts
new file mode 100644
index 0000000..5a2b746
--- /dev/null
+++ b/src/client/api/model/monitor.ts
@@ -0,0 +1,17 @@
+import { useQueryClient } from '@tanstack/react-query';
+import { getQueryKey } from '@trpc/react-query';
+import { defaultErrorHandler, defaultSuccessHandler, trpc } from '../trpc';
+
+export function useMonitorUpsert() {
+  const queryClient = useQueryClient();
+  const mutation = trpc.monitor.upsert.useMutation({
+    onSuccess: (data) => {
+      queryClient.resetQueries(getQueryKey(trpc.monitor.all));
+
+      defaultSuccessHandler();
+    },
+    onError: defaultErrorHandler,
+  });
+
+  return mutation;
+}
diff --git a/src/client/api/trpc.ts b/src/client/api/trpc.ts
index 1246469..c4f01dd 100644
--- a/src/client/api/trpc.ts
+++ b/src/client/api/trpc.ts
@@ -29,7 +29,7 @@ export const trpcClient = trpc.createClient({
  *   onSuccess: defaultSuccessHandler,
  * });
  */
-export function defaultSuccessHandler(data: any) {
+export function defaultSuccessHandler() {
   message.success('Operate Success');
 }
 
diff --git a/src/client/components/modals/NotificationInfo/strategies/smtp.tsx b/src/client/components/modals/NotificationInfo/strategies/smtp.tsx
index 7996eef..5c63d92 100644
--- a/src/client/components/modals/NotificationInfo/strategies/smtp.tsx
+++ b/src/client/components/modals/NotificationInfo/strategies/smtp.tsx
@@ -28,7 +28,7 @@ export const NotificationSMTP: React.FC = React.memo(() => {
           <Select.Option value={true}>TLS (465)</Select.Option>
         </Select>
       </Form.Item>
-      <Form.Item name={['payload', 'ignoreTLS']}>
+      <Form.Item name={['payload', 'ignoreTLS']} valuePropName="checked">
         <Checkbox>Ignore TLS Error</Checkbox>
       </Form.Item>
       <Form.Item
diff --git a/src/client/components/modals/monitor/MonitorInfoEditor.tsx b/src/client/components/modals/monitor/MonitorInfoEditor.tsx
index fb5e476..3792aff 100644
--- a/src/client/components/modals/monitor/MonitorInfoEditor.tsx
+++ b/src/client/components/modals/monitor/MonitorInfoEditor.tsx
@@ -4,11 +4,12 @@ import { Button, Form, Input, InputNumber, Select } from 'antd';
 import { monitorProviders } from './provider';
 import { useEvent } from '../../../hooks/useEvent';
 
-type MonitorInfoEditorValues = Omit<
+export type MonitorInfoEditorValues = Omit<
   Monitor,
   'id' | 'workspaceId' | 'createdAt'
 > & {
   id?: string;
+  payload: Record<string, any>;
 };
 
 const defaultValues: Omit<MonitorInfoEditorValues, 'payload'> = {
diff --git a/src/client/pages/Monitor/Add.tsx b/src/client/pages/Monitor/Add.tsx
index cdc78fd..ef3ba4b 100644
--- a/src/client/pages/Monitor/Add.tsx
+++ b/src/client/pages/Monitor/Add.tsx
@@ -1,15 +1,23 @@
 import React from 'react';
+import { useNavigate } from 'react-router';
+import { useMonitorUpsert } from '../../api/model/monitor';
 import { MonitorInfoEditor } from '../../components/modals/monitor/MonitorInfoEditor';
 import { useCurrentWorkspaceId } from '../../store/user';
 
 export const MonitorAdd: React.FC = React.memo(() => {
-  const currentWorkspaceId = useCurrentWorkspaceId();
+  const currentWorkspaceId = useCurrentWorkspaceId()!;
+  const mutation = useMonitorUpsert();
+  const navigate = useNavigate();
 
   return (
     <div>
       <MonitorInfoEditor
-        onSave={(value) => {
-          // console.log(value);
+        onSave={async (value) => {
+          await mutation.mutateAsync({
+            ...value,
+            workspaceId: currentWorkspaceId,
+          });
+          navigate('/monitor', { replace: true });
         }}
       />
     </div>
diff --git a/src/client/pages/Monitor/Edit.tsx b/src/client/pages/Monitor/Edit.tsx
index b239509..b2a3029 100644
--- a/src/client/pages/Monitor/Edit.tsx
+++ b/src/client/pages/Monitor/Edit.tsx
@@ -1,9 +1,13 @@
 import React from 'react';
-import { useParams } from 'react-router';
+import { useNavigate, useParams } from 'react-router';
+import { useMonitorUpsert } from '../../api/model/monitor';
 import { trpc } from '../../api/trpc';
 import { ErrorTip } from '../../components/ErrorTip';
 import { Loading } from '../../components/Loading';
-import { MonitorInfoEditor } from '../../components/modals/monitor/MonitorInfoEditor';
+import {
+  MonitorInfoEditor,
+  MonitorInfoEditorValues,
+} from '../../components/modals/monitor/MonitorInfoEditor';
 import { useCurrentWorkspaceId } from '../../store/user';
 
 export const MonitorEdit: React.FC = React.memo(() => {
@@ -11,8 +15,10 @@ export const MonitorEdit: React.FC = React.memo(() => {
   const currentWorkspaceId = useCurrentWorkspaceId();
   const { data: monitor, isLoading } = trpc.monitor.get.useQuery({
     id: monitorId!,
-    workspaceId: currentWorkspaceId!,
+    workspaceId: currentWorkspaceId,
   });
+  const mutation = useMonitorUpsert();
+  const navigate = useNavigate();
 
   if (isLoading) {
     return <Loading />;
@@ -25,9 +31,13 @@ export const MonitorEdit: React.FC = React.memo(() => {
   return (
     <div>
       <MonitorInfoEditor
-        initialValues={monitor}
-        onSave={(value) => {
-          console.log(value);
+        initialValues={monitor as MonitorInfoEditorValues}
+        onSave={async (value) => {
+          await mutation.mutateAsync({
+            ...value,
+            workspaceId: currentWorkspaceId,
+          });
+          navigate('/monitor', { replace: true });
         }}
       />
     </div>
diff --git a/src/client/store/user.ts b/src/client/store/user.ts
index c0d89a5..a08dc73 100644
--- a/src/client/store/user.ts
+++ b/src/client/store/user.ts
@@ -32,5 +32,9 @@ export function useCurrentWorkspaceId() {
     (state) => state.info?.currentWorkspace?.id
   );
 
+  if (!currentWorkspaceId) {
+    throw new Error('No Workspace Id');
+  }
+
   return currentWorkspaceId;
 }
diff --git a/src/server/model/monitor/index.ts b/src/server/model/monitor/index.ts
index 96d0d48..6fcc8b0 100644
--- a/src/server/model/monitor/index.ts
+++ b/src/server/model/monitor/index.ts
@@ -107,11 +107,17 @@ class MonitorRunner {
 
       this.timer = setTimeout(() => {
         run();
-      }, interval);
+      }, interval * 1000);
     };
 
     async function run() {
-      const value = await provider.run(monitor);
+      let value = 0;
+      try {
+        value = await provider.run(monitor);
+      } catch (err) {
+        console.error(err);
+        value = -1;
+      }
 
       // check event update
       if (value < 0 && currentStatus === 'UP') {
diff --git a/src/server/model/monitor/provider/ping.ts b/src/server/model/monitor/provider/ping.ts
index 2f7da5c..e0518d6 100644
--- a/src/server/model/monitor/provider/ping.ts
+++ b/src/server/model/monitor/provider/ping.ts
@@ -1,5 +1,6 @@
 import { MonitorProvider } from './type';
 import pingUtils from 'ping';
+import os from 'os';
 
 export const ping: MonitorProvider<{
   hostname: string;
@@ -22,13 +23,14 @@ export const ping: MonitorProvider<{
 };
 
 const isWindows = /^win/.test(process.platform);
+const deadline = ['linux', 'darwin'].includes(os.platform()) ? 10 : undefined;
 
 function pingAction(hostname: string, packetSize = 56) {
   return new Promise<number | 'unknown'>((resolve, reject) => {
     pingUtils.promise
       .probe(hostname, {
         min_reply: 1,
-        deadline: 10,
+        deadline,
         packetSize,
       })
       .then((res) => {