From c41994879aff1d278520128df2016876ae952aaf Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Tue, 7 Nov 2023 22:36:07 +0800
Subject: [PATCH] refactor: add script install command

---
 src/client/pages/Servers.tsx          | 42 +++++++++++++++++++++++++--
 src/client/pages/Settings/Profile.tsx | 10 +++----
 2 files changed, 45 insertions(+), 7 deletions(-)

diff --git a/src/client/pages/Servers.tsx b/src/client/pages/Servers.tsx
index 7769d70..4fa46a8 100644
--- a/src/client/pages/Servers.tsx
+++ b/src/client/pages/Servers.tsx
@@ -9,6 +9,7 @@ import {
   Steps,
   Switch,
   Table,
+  Tabs,
   Tooltip,
   Typography,
 } from 'antd';
@@ -71,7 +72,20 @@ export const Servers: React.FC = React.memo(() => {
         onCancel={() => setIsModalOpen(false)}
       >
         <div>
-          <AddServerStep />
+          <Tabs
+            items={[
+              {
+                key: 'script',
+                label: 'Script',
+                children: <InstallScript />,
+              },
+              {
+                key: 'manual',
+                label: 'Manual',
+                children: <AddServerStep />,
+              },
+            ]}
+          />
         </div>
       </Modal>
     </div>
@@ -218,6 +232,27 @@ export const ServerList: React.FC<{
 });
 ServerList.displayName = 'ServerList';
 
+export const InstallScript: React.FC = React.memo(() => {
+  const workspaceId = useCurrentWorkspaceId();
+  const command = `curl -o- ${window.location.origin}/serverStatus/${workspaceId}/install.sh | bash`;
+
+  return (
+    <div>
+      <div>Run this command in your linux machine</div>
+
+      <Typography.Paragraph
+        copyable={{
+          format: 'text/plain',
+          text: command,
+        }}
+        className="h-[96px] flex p-2 rounded bg-black bg-opacity-5 border border-black border-opacity-10 overflow-auto"
+      >
+        <span>{command}</span>
+      </Typography.Paragraph>
+    </div>
+  );
+});
+
 export const AddServerStep: React.FC = React.memo(() => {
   const workspaceId = useCurrentWorkspaceId();
   const [current, setCurrent] = useState(0);
@@ -272,7 +307,10 @@ export const AddServerStep: React.FC = React.memo(() => {
           description: (
             <div>
               run reporter with:{' '}
-              <Typography.Text code={true} copyable={{ text: command }}>
+              <Typography.Text
+                code={true}
+                copyable={{ format: 'text/plain', text: command }}
+              >
                 {command}
               </Typography.Text>
               <Button
diff --git a/src/client/pages/Settings/Profile.tsx b/src/client/pages/Settings/Profile.tsx
index a12e4c7..b1b02d6 100644
--- a/src/client/pages/Settings/Profile.tsx
+++ b/src/client/pages/Settings/Profile.tsx
@@ -26,16 +26,16 @@ export const Profile: React.FC = React.memo(() => {
 
       <Card>
         <Form layout="vertical">
-          <Form.Item label="User Id">
-            <Typography.Text copyable={true} code={true}>
-              {userInfo?.id}
-            </Typography.Text>
-          </Form.Item>
           <Form.Item label="Current Workspace Id">
             <Typography.Text copyable={true} code={true}>
               {userInfo?.currentWorkspace?.id}
             </Typography.Text>
           </Form.Item>
+          <Form.Item label="User Id">
+            <Typography.Text copyable={true} code={true}>
+              {userInfo?.id}
+            </Typography.Text>
+          </Form.Item>
           <Form.Item label="Password">
             <Button danger={true} onClick={() => setOpenChangePassword(true)}>
               Change Password