@rsdoctor/components 1.0.2 → 1.1.0

package/dist/components/Alert/change.d.ts

@@ -1,8 +1,3 @@
 import React from 'react';
 import { CodeChangeAlertProps } from './types';
-interface FixedProps {
-    setIsFixed(val: boolean): void;
-}
-export declare const CodeChangeDrawerContent: React.FC<CodeChangeAlertProps & FixedProps>;
 export declare const CodeChangeAlert: React.FC<CodeChangeAlertProps>;
-export {};

package/dist/components/Alert/change.js

@@ -1,15 +1,28 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import axios from "axios";
-import { Space, Alert, Button, Typography, Divider, Popconfirm, Row, Col } from "antd";
-import { InfoCircleOutlined, CheckOutlined } from "@ant-design/icons";
+import { CheckOutlined, InfoCircleOutlined } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
+import {
+  Alert,
+  Button,
+  Col,
+  Divider,
+  Popconfirm,
+  Row,
+  Space,
+  Typography
+} from "antd";
+import axios from "axios";
+import { useState } from "react";
 import { useRuleIndexNavigate } from "../../utils";
+import { DiffViewer } from "../base";
+import { CodeOpener } from "../Opener";
 import { TextDrawer } from "../TextDrawer";
 import { Title } from "../Title";
-import { CodeOpener } from "../Opener";
-import { DiffViewer } from "../CodeViewer";
-const CodeChangeDrawerContent = ({ data, setIsFixed, cwd }) => {
+const CodeChangeDrawerContent = ({
+  data,
+  setIsFixed,
+  cwd
+}) => {
   const { file, id } = data;
   const { path, line, isFixed, actual, expected } = file;
   const applyFix = () => {
@@ -28,7 +41,16 @@ const CodeChangeDrawerContent = ({ data, setIsFixed, cwd }) => {
         zIndex: 99999,
         disabled: isFixed,
         placement: "bottom",
-        children: /* @__PURE__ */ jsx(Button, { type: "primary", size: "small", icon: isFixed ? /* @__PURE__ */ jsx(CheckOutlined, {}) : void 0, disabled: isFixed, children: isFixed ? "Fix Applied" : "Apply Fix" })
+        children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "primary",
+            size: "small",
+            icon: isFixed ? /* @__PURE__ */ jsx(CheckOutlined, {}) : void 0,
+            disabled: isFixed,
+            children: isFixed ? "Fix Applied" : "Apply Fix"
+          }
+        )
       }
     );
   };
@@ -42,10 +64,22 @@ const CodeChangeDrawerContent = ({ data, setIsFixed, cwd }) => {
       /* @__PURE__ */ jsx(Col, { span: 12, children: /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "Before" }) }),
       /* @__PURE__ */ jsx(Col, { span: 12, children: /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "After" }) })
     ] }),
-    /* @__PURE__ */ jsx(DiffViewer, { className: "full-space", filepath: path, before: actual, after: expected })
+    /* @__PURE__ */ jsx(
+      DiffViewer,
+      {
+        className: "full-space",
+        originalFilePath: path,
+        modifiedFilePath: path,
+        original: actual,
+        modified: expected
+      }
+    )
   ] });
 };
-const CodeChangeAlert = ({ data, cwd }) => {
+const CodeChangeAlert = ({
+  data,
+  cwd
+}) => {
   const { title, description = "", level, code, file } = data;
   const [isFixed, setIsFixed] = useState(file.isFixed ?? false);
   const navigate = useRuleIndexNavigate(code, data.link);
@@ -67,7 +101,16 @@ const CodeChangeAlert = ({ data, cwd }) => {
     {
       showIcon: true,
       message: /* @__PURE__ */ jsxs(Space, { children: [
-        /* @__PURE__ */ jsx(Typography.Text, { code: true, strong: true, onClick: navigate, style: { cursor: "pointer" }, children: /* @__PURE__ */ jsx("a", { children: code }) }),
+        /* @__PURE__ */ jsx(
+          Typography.Text,
+          {
+            code: true,
+            strong: true,
+            onClick: navigate,
+            style: { cursor: "pointer" },
+            children: /* @__PURE__ */ jsx("a", { children: code })
+          }
+        ),
         /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: title })
       ] }),
       description: Description,
@@ -78,7 +121,14 @@ const CodeChangeAlert = ({ data, cwd }) => {
           {
             text: isFixed ? "Fixed | Show Fix History" : "Show Fix Suggestion",
             buttonProps: { size: "small" },
-            children: /* @__PURE__ */ jsx(CodeChangeDrawerContent, { data, setIsFixed: fixFile, cwd })
+            children: /* @__PURE__ */ jsx(
+              CodeChangeDrawerContent,
+              {
+                data,
+                setIsFixed: fixFile,
+                cwd
+              }
+            )
           }
         ),
         /* @__PURE__ */ jsx(Divider, { type: "vertical" }),
@@ -88,8 +138,7 @@ const CodeChangeAlert = ({ data, cwd }) => {
   );
 };
 export {
-  CodeChangeAlert,
-  CodeChangeDrawerContent
+  CodeChangeAlert
 };
 
 //# sourceMappingURL=change.js.map

package/dist/components/Alert/change.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":[],"ignoreList":[],"sources":["../../../src/components/Alert/change.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport axios from 'axios';\nimport { Space, Alert, Button, Typography, Divider, Popconfirm, Row, Col } from 'antd';\nimport { InfoCircleOutlined, CheckOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport { useRuleIndexNavigate } from '../../utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { CodeOpener } from '../Opener';\nimport { DiffViewer } from '../CodeViewer';\nimport { CodeChangeAlertProps } from './types';\n\ninterface FixedProps {\n  setIsFixed(val: boolean): void;\n}\n\nexport const CodeChangeDrawerContent: React.FC<CodeChangeAlertProps & FixedProps> = ({ data, setIsFixed, cwd }) => {\n  const { file, id } = data;\n  const { path, line, isFixed, actual, expected } = file;\n  // const [isFixed, setIsFixed] = useState(file.isFixed ?? false);\n  const applyFix = () => {\n    axios.post(SDK.ServerAPI.API.ApplyErrorFix, { id }).then(() => {\n      setIsFixed(true);\n    });\n  };\n\n  const FixButton = () => {\n    return (\n      <Popconfirm\n        title={`Did you confirm to apply the change i the area below ?`}\n        onConfirm={applyFix}\n        okText=\"Yes\"\n        cancelText=\"Cancel\"\n        zIndex={99999}\n        disabled={isFixed}\n        placement=\"bottom\"\n      >\n        <Button type=\"primary\" size=\"small\" icon={isFixed ? <CheckOutlined /> : undefined} disabled={isFixed}>\n          {isFixed ? 'Fix Applied' : 'Apply Fix'}\n        </Button>\n      </Popconfirm>\n    );\n  };\n\n  return (\n    <Space direction=\"vertical\" className=\"alert-space\">\n      <div>\n        <Title text={isFixed ? 'Fix History' : 'Suggest Fix'} />\n        <span className=\"code-change-tag-list\">\n          <FixButton />\n        </span>\n      </div>\n      <CodeOpener cwd={cwd} url={path} loc={String(line)} code disabled />\n      <Row>\n        <Col span={12}>\n          <Typography.Text strong>Before</Typography.Text>\n        </Col>\n        <Col span={12}>\n          <Typography.Text strong>After</Typography.Text>\n        </Col>\n      </Row>\n      <DiffViewer className=\"full-space\" filepath={path} before={actual} after={expected} />\n    </Space>\n  );\n};\n\nexport const CodeChangeAlert: React.FC<CodeChangeAlertProps> = ({ data, cwd }) => {\n  const { title, description = '', level, code, file } = data;\n  const [isFixed, setIsFixed] = useState(file.isFixed ?? false);\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const fixFile = (val: boolean) => {\n    setIsFixed(val);\n    file.isFixed = val;\n  };\n  const Description = (\n    <Space direction=\"vertical\">\n      <Typography.Text>{description}</Typography.Text>\n      <Space>\n        <Typography.Text>File:</Typography.Text>\n        <Typography.Text strong code>\n          {file.path}\n        </Typography.Text>\n        <Typography.Text>in line</Typography.Text>\n        <Typography.Text strong code>\n          {file.line}\n        </Typography.Text>\n      </Space>\n    </Space>\n  );\n\n  return (\n    <Alert\n      showIcon\n      message={\n        <Space>\n          <Typography.Text code strong onClick={navigate} style={{ cursor: 'pointer' }}>\n            <a>{code}</a>\n          </Typography.Text>\n          <Typography.Text strong>{title}</Typography.Text>\n        </Space>\n      }\n      description={Description}\n      type={isFixed ? 'success' : level === 'warn' ? 'info' : level}\n      action={\n        <Space>\n          <TextDrawer\n            text={isFixed ? 'Fixed | Show Fix History' : 'Show Fix Suggestion'}\n            buttonProps={{ size: 'small' }}\n          >\n            <CodeChangeDrawerContent data={data} setIsFixed={fixFile} cwd={cwd} />\n          </TextDrawer>\n          <Divider type=\"vertical\" />\n          <Button type=\"link\" onClick={navigate} size=\"small\">\n            <InfoCircleOutlined />\n          </Button>\n        </Space>\n      }\n    />\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"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","names":[],"ignoreList":[],"sources":["../../../src/components/Alert/change.tsx"],"sourcesContent":["import { CheckOutlined, InfoCircleOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Alert,\n  Button,\n  Col,\n  Divider,\n  Popconfirm,\n  Row,\n  Space,\n  Typography,\n} from 'antd';\nimport axios from 'axios';\nimport React, { useState } from 'react';\nimport { useRuleIndexNavigate } from '../../utils';\nimport { DiffViewer } from '../base';\nimport { CodeOpener } from '../Opener';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { CodeChangeAlertProps } from './types';\n\ninterface FixedProps {\n  setIsFixed(val: boolean): void;\n}\n\nconst CodeChangeDrawerContent: React.FC<CodeChangeAlertProps & FixedProps> = ({\n  data,\n  setIsFixed,\n  cwd,\n}) => {\n  const { file, id } = data;\n  const { path, line, isFixed, actual, expected } = file;\n  // const [isFixed, setIsFixed] = useState(file.isFixed ?? false);\n  const applyFix = () => {\n    axios.post(SDK.ServerAPI.API.ApplyErrorFix, { id }).then(() => {\n      setIsFixed(true);\n    });\n  };\n\n  const FixButton = () => {\n    return (\n      <Popconfirm\n        title={`Did you confirm to apply the change i the area below ?`}\n        onConfirm={applyFix}\n        okText=\"Yes\"\n        cancelText=\"Cancel\"\n        zIndex={99999}\n        disabled={isFixed}\n        placement=\"bottom\"\n      >\n        <Button\n          type=\"primary\"\n          size=\"small\"\n          icon={isFixed ? <CheckOutlined /> : undefined}\n          disabled={isFixed}\n        >\n          {isFixed ? 'Fix Applied' : 'Apply Fix'}\n        </Button>\n      </Popconfirm>\n    );\n  };\n\n  return (\n    <Space direction=\"vertical\" className=\"alert-space\">\n      <div>\n        <Title text={isFixed ? 'Fix History' : 'Suggest Fix'} />\n        <span className=\"code-change-tag-list\">\n          <FixButton />\n        </span>\n      </div>\n      <CodeOpener cwd={cwd} url={path} loc={String(line)} code disabled />\n      <Row>\n        <Col span={12}>\n          <Typography.Text strong>Before</Typography.Text>\n        </Col>\n        <Col span={12}>\n          <Typography.Text strong>After</Typography.Text>\n        </Col>\n      </Row>\n      <DiffViewer\n        className=\"full-space\"\n        originalFilePath={path}\n        modifiedFilePath={path}\n        original={actual}\n        modified={expected}\n      />\n    </Space>\n  );\n};\n\n///REVIEW - It's still useful? can't find usage\nexport const CodeChangeAlert: React.FC<CodeChangeAlertProps> = ({\n  data,\n  cwd,\n}) => {\n  const { title, description = '', level, code, file } = data;\n  const [isFixed, setIsFixed] = useState(file.isFixed ?? false);\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const fixFile = (val: boolean) => {\n    setIsFixed(val);\n    file.isFixed = val;\n  };\n  const Description = (\n    <Space direction=\"vertical\">\n      <Typography.Text>{description}</Typography.Text>\n      <Space>\n        <Typography.Text>File:</Typography.Text>\n        <Typography.Text strong code>\n          {file.path}\n        </Typography.Text>\n        <Typography.Text>in line</Typography.Text>\n        <Typography.Text strong code>\n          {file.line}\n        </Typography.Text>\n      </Space>\n    </Space>\n  );\n\n  return (\n    <Alert\n      showIcon\n      message={\n        <Space>\n          <Typography.Text\n            code\n            strong\n            onClick={navigate}\n            style={{ cursor: 'pointer' }}\n          >\n            <a>{code}</a>\n          </Typography.Text>\n          <Typography.Text strong>{title}</Typography.Text>\n        </Space>\n      }\n      description={Description}\n      type={isFixed ? 'success' : level === 'warn' ? 'info' : level}\n      action={\n        <Space>\n          <TextDrawer\n            text={isFixed ? 'Fixed | Show Fix History' : 'Show Fix Suggestion'}\n            buttonProps={{ size: 'small' }}\n          >\n            <CodeChangeDrawerContent\n              data={data}\n              setIsFixed={fixFile}\n              cwd={cwd}\n            />\n          </TextDrawer>\n          <Divider type=\"vertical\" />\n          <Button type=\"link\" onClick={navigate} size=\"small\">\n            <InfoCircleOutlined />\n          </Button>\n        </Space>\n      }\n    />\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/components/Alert/view.js

@@ -1,20 +1,40 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { isNumber } from "lodash-es";
-import { Space, Alert, Button, Typography, Divider } from "antd";
 import { InfoCircleOutlined } from "@ant-design/icons";
+import { Alert, Button, Divider, Space, Typography } from "antd";
+import { Lodash } from "@rsdoctor/utils/common";
 import { useRuleIndexNavigate } from "../../utils";
+import { CodeViewer } from "../base";
+import { CodeOpener } from "../Opener";
 import { TextDrawer } from "../TextDrawer";
 import { Title } from "../Title";
-import { CodeOpener } from "../Opener";
-import { CodeViewer } from "../CodeViewer";
-const CodeViewDrawerContent = ({ data, cwd }) => {
+const CodeViewDrawerContent = ({
+  data,
+  cwd
+}) => {
   const { file } = data;
   const { path, ranges } = file;
   const line = ranges?.[0].start.line;
   return /* @__PURE__ */ jsxs(Space, { direction: "vertical", className: "alert-space", children: [
     /* @__PURE__ */ jsx(Title, { text: "Code Viewer" }),
-    /* @__PURE__ */ jsx(CodeOpener, { cwd, url: path, loc: isNumber(line) ? String(line) : void 0, code: true, disabled: true }),
-    /* @__PURE__ */ jsx(CodeViewer, { path: file.path, content: file.content, ranges, defaultLine: line })
+    /* @__PURE__ */ jsx(
+      CodeOpener,
+      {
+        cwd,
+        url: path,
+        loc: Lodash.isNumber(line) ? String(line) : void 0,
+        code: true,
+        disabled: true
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      CodeViewer,
+      {
+        filePath: file.path,
+        code: file.content,
+        ranges,
+        defaultLine: line
+      }
+    )
   ] });
 };
 const CodeViewAlert = ({ data, cwd }) => {
@@ -26,7 +46,7 @@ const CodeViewAlert = ({ data, cwd }) => {
     /* @__PURE__ */ jsxs(Space, { children: [
       /* @__PURE__ */ jsx(Typography.Text, { children: "File:" }),
       /* @__PURE__ */ jsx(Typography.Text, { strong: true, code: true, children: file.path }),
-      isNumber(startLine) ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      Lodash.isNumber(startLine) ? /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(Typography.Text, { children: "in line" }),
         /* @__PURE__ */ jsx(Typography.Text, { strong: true, code: true, children: startLine })
       ] }) : ""
@@ -37,7 +57,16 @@ const CodeViewAlert = ({ data, cwd }) => {
     {
       showIcon: true,
       message: /* @__PURE__ */ jsxs(Space, { children: [
-        /* @__PURE__ */ jsx(Typography.Text, { code: true, strong: true, onClick: navigate, style: { cursor: "pointer" }, children: /* @__PURE__ */ jsx("a", { children: code }) }),
+        /* @__PURE__ */ jsx(
+          Typography.Text,
+          {
+            code: true,
+            strong: true,
+            onClick: navigate,
+            style: { cursor: "pointer" },
+            children: /* @__PURE__ */ jsx("a", { children: code })
+          }
+        ),
         /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: title })
       ] }),
       description: Description,
@@ -46,7 +75,15 @@ const CodeViewAlert = ({ data, cwd }) => {
         /* @__PURE__ */ jsx(TextDrawer, { text: "Show Source Code", buttonProps: { size: "small" }, children: /* @__PURE__ */ jsx(CodeViewDrawerContent, { data, cwd }) }),
         /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(Divider, { type: "vertical" }),
-          /* @__PURE__ */ jsx(Button, { type: "link", onClick: navigate, size: "small", icon: /* @__PURE__ */ jsx(InfoCircleOutlined, {}) })
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "link",
+              onClick: navigate,
+              size: "small",
+              icon: /* @__PURE__ */ jsx(InfoCircleOutlined, {})
+            }
+          )
         ] })
       ] })
     }

package/dist/components/Alert/view.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAiBI,SAsBM,UArBJ,KADF;AAhBJ,SAAS,gBAAgB;AACzB,SAAS,OAAO,OAAO,QAAQ,YAAY,eAAe;AAC1D,SAAS,0BAA0B;AACnC,SAAS,4BAA4B;AACrC,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAGpB,MAAM,wBAAsD,CAAC,EAAE,MAAM,IAAI,MAAM;AACpF,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,MAAM,OAAO,IAAI;AACzB,QAAM,OAAO,SAAS,CAAC,EAAE,MAAM;AAE/B,SACE,qBAAC,SAAM,WAAU,YAAW,WAAU,eACpC;AAAA,wBAAC,SAAM,MAAK,eAAc;AAAA,IAC1B,oBAAC,cAAW,KAAU,KAAK,MAAM,KAAK,SAAS,IAAI,IAAI,OAAO,IAAI,IAAI,QAAW,MAAI,MAAC,UAAQ,MAAC;AAAA,IAC/F,oBAAC,cAAW,MAAM,KAAK,MAAM,SAAS,KAAK,SAAS,QAAgB,aAAa,MAAM;AAAA,KACzF;AAEJ;AAEO,MAAM,gBAA8C,CAAC,EAAE,MAAM,IAAI,MAAM;AAC5E,QAAM,EAAE,OAAO,cAAc,IAAI,OAAO,MAAM,KAAK,IAAI;AACvD,QAAM,WAAW,qBAAqB,MAAM,KAAK,IAAI;AACrD,QAAM,YAAY,KAAK,SAAS,CAAC,EAAE,MAAM;AAEzC,QAAM,cACJ,qBAAC,SAAM,WAAU,YACf;AAAA,wBAAC,WAAW,MAAX,EAAiB,uBAAY;AAAA,IAC9B,qBAAC,SACC;AAAA,0BAAC,WAAW,MAAX,EAAgB,mBAAK;AAAA,MACtB,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAC,MAAI,MACzB,eAAK,MACR;AAAA,MACC,SAAS,SAAS,IACjB,iCACE;AAAA,4BAAC,WAAW,MAAX,EAAgB,qBAAO;AAAA,QACxB,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAC,MAAI,MACzB,qBACH;AAAA,SACF,IAEA;AAAA,OAEJ;AAAA,KACF;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAQ;AAAA,MACR,SACE,qBAAC,SACC;AAAA,4BAAC,WAAW,MAAX,EAAgB,MAAI,MAAC,QAAM,MAAC,SAAS,UAAU,OAAO,EAAE,QAAQ,UAAU,GACzE,8BAAC,OAAG,gBAAK,GACX;AAAA,QACA,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAE,iBAAM;AAAA,SACjC;AAAA,MAEF,aAAa;AAAA,MACb,MAAM,UAAU,SAAS,SAAS;AAAA,MAClC,QACE,qBAAC,SACC;AAAA,4BAAC,cAAW,MAAM,oBAAoB,aAAa,EAAE,MAAM,QAAQ,GACjE,8BAAC,yBAAsB,MAAY,KAAU,GAC/C;AAAA,QACA,iCACE;AAAA,8BAAC,WAAQ,MAAK,YAAW;AAAA,UACzB,oBAAC,UAAO,MAAK,QAAO,SAAS,UAAU,MAAK,SAAQ,MAAM,oBAAC,sBAAmB,GAAI;AAAA,WACpF;AAAA,SACF;AAAA;AAAA,EAEJ;AAEJ","names":[],"ignoreList":[],"sources":["../../../src/components/Alert/view.tsx"],"sourcesContent":["import React from 'react';\nimport { isNumber } from 'lodash-es';\nimport { Space, Alert, Button, Typography, Divider } from 'antd';\nimport { InfoCircleOutlined } from '@ant-design/icons';\nimport { useRuleIndexNavigate } from '../../utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { CodeOpener } from '../Opener';\nimport { CodeViewer } from '../CodeViewer';\nimport { CodeViewAlertProps } from './types';\n\nexport const CodeViewDrawerContent: React.FC<CodeViewAlertProps> = ({ data, cwd }) => {\n  const { file } = data;\n  const { path, ranges } = file;\n  const line = ranges?.[0].start.line;\n\n  return (\n    <Space direction=\"vertical\" className=\"alert-space\">\n      <Title text=\"Code Viewer\" />\n      <CodeOpener cwd={cwd} url={path} loc={isNumber(line) ? String(line) : undefined} code disabled />\n      <CodeViewer path={file.path} content={file.content} ranges={ranges} defaultLine={line} />\n    </Space>\n  );\n};\n\nexport const CodeViewAlert: React.FC<CodeViewAlertProps> = ({ data, cwd }) => {\n  const { title, description = '', level, code, file } = data;\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const startLine = file.ranges?.[0].start.line;\n\n  const Description = (\n    <Space direction=\"vertical\">\n      <Typography.Text>{description}</Typography.Text>\n      <Space>\n        <Typography.Text>File:</Typography.Text>\n        <Typography.Text strong code>\n          {file.path}\n        </Typography.Text>\n        {isNumber(startLine) ? (\n          <>\n            <Typography.Text>in line</Typography.Text>\n            <Typography.Text strong code>\n              {startLine}\n            </Typography.Text>\n          </>\n        ) : (\n          ''\n        )}\n      </Space>\n    </Space>\n  );\n\n  return (\n    <Alert\n      showIcon\n      message={\n        <Space>\n          <Typography.Text code strong onClick={navigate} style={{ cursor: 'pointer' }}>\n            <a>{code}</a>\n          </Typography.Text>\n          <Typography.Text strong>{title}</Typography.Text>\n        </Space>\n      }\n      description={Description}\n      type={level === 'warn' ? 'info' : level}\n      action={\n        <Space>\n          <TextDrawer text={'Show Source Code'} buttonProps={{ size: 'small' }}>\n            <CodeViewDrawerContent data={data} cwd={cwd} />\n          </TextDrawer>\n          <>\n            <Divider type=\"vertical\" />\n            <Button type=\"link\" onClick={navigate} size=\"small\" icon={<InfoCircleOutlined />} />\n          </>\n        </Space>\n      }\n    />\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"AAoBI,SAkCM,UAjCJ,KADF;AApBJ,SAAS,0BAA0B;AACnC,SAAS,OAAO,QAAQ,SAAS,OAAO,kBAAkB;AAE1D,SAAS,cAAc;AACvB,SAAS,4BAA4B;AACrC,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AAGf,MAAM,wBAAsD,CAAC;AAAA,EAClE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,MAAM,OAAO,IAAI;AACzB,QAAM,OAAO,SAAS,CAAC,EAAE,MAAM;AAE/B,SACE,qBAAC,SAAM,WAAU,YAAW,WAAU,eACpC;AAAA,wBAAC,SAAM,MAAK,eAAc;AAAA,IAC1B;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,KAAK;AAAA,QACL,KAAK,OAAO,SAAS,IAAI,IAAI,OAAO,IAAI,IAAI;AAAA,QAC5C,MAAI;AAAA,QACJ,UAAQ;AAAA;AAAA,IACV;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,MAAM,KAAK;AAAA,QACX;AAAA,QACA,aAAa;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAGO,MAAM,gBAA8C,CAAC,EAAE,MAAM,IAAI,MAAM;AAC5E,QAAM,EAAE,OAAO,cAAc,IAAI,OAAO,MAAM,KAAK,IAAI;AACvD,QAAM,WAAW,qBAAqB,MAAM,KAAK,IAAI;AACrD,QAAM,YAAY,KAAK,SAAS,CAAC,EAAE,MAAM;AAEzC,QAAM,cACJ,qBAAC,SAAM,WAAU,YACf;AAAA,wBAAC,WAAW,MAAX,EAAiB,uBAAY;AAAA,IAC9B,qBAAC,SACC;AAAA,0BAAC,WAAW,MAAX,EAAgB,mBAAK;AAAA,MACtB,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAC,MAAI,MACzB,eAAK,MACR;AAAA,MACC,OAAO,SAAS,SAAS,IACxB,iCACE;AAAA,4BAAC,WAAW,MAAX,EAAgB,qBAAO;AAAA,QACxB,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAC,MAAI,MACzB,qBACH;AAAA,SACF,IAEA;AAAA,OAEJ;AAAA,KACF;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAQ;AAAA,MACR,SACE,qBAAC,SACC;AAAA;AAAA,UAAC,WAAW;AAAA,UAAX;AAAA,YACC,MAAI;AAAA,YACJ,QAAM;AAAA,YACN,SAAS;AAAA,YACT,OAAO,EAAE,QAAQ,UAAU;AAAA,YAE3B,8BAAC,OAAG,gBAAK;AAAA;AAAA,QACX;AAAA,QACA,oBAAC,WAAW,MAAX,EAAgB,QAAM,MAAE,iBAAM;AAAA,SACjC;AAAA,MAEF,aAAa;AAAA,MACb,MAAM,UAAU,SAAS,SAAS;AAAA,MAClC,QACE,qBAAC,SACC;AAAA,4BAAC,cAAW,MAAM,oBAAoB,aAAa,EAAE,MAAM,QAAQ,GACjE,8BAAC,yBAAsB,MAAY,KAAU,GAC/C;AAAA,QACA,iCACE;AAAA,8BAAC,WAAQ,MAAK,YAAW;AAAA,UACzB;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS;AAAA,cACT,MAAK;AAAA,cACL,MAAM,oBAAC,sBAAmB;AAAA;AAAA,UAC5B;AAAA,WACF;AAAA,SACF;AAAA;AAAA,EAEJ;AAEJ","names":[],"ignoreList":[],"sources":["../../../src/components/Alert/view.tsx"],"sourcesContent":["import { InfoCircleOutlined } from '@ant-design/icons';\nimport { Alert, Button, Divider, Space, Typography } from 'antd';\nimport React from 'react';\nimport { Lodash } from '@rsdoctor/utils/common';\nimport { useRuleIndexNavigate } from '../../utils';\nimport { CodeViewer } from '../base';\nimport { CodeOpener } from '../Opener';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { CodeViewAlertProps } from './types';\n\nexport const CodeViewDrawerContent: React.FC<CodeViewAlertProps> = ({\n  data,\n  cwd,\n}) => {\n  const { file } = data;\n  const { path, ranges } = file;\n  const line = ranges?.[0].start.line;\n\n  return (\n    <Space direction=\"vertical\" className=\"alert-space\">\n      <Title text=\"Code Viewer\" />\n      <CodeOpener\n        cwd={cwd}\n        url={path}\n        loc={Lodash.isNumber(line) ? String(line) : undefined}\n        code\n        disabled\n      />\n      <CodeViewer\n        filePath={file.path}\n        code={file.content}\n        ranges={ranges}\n        defaultLine={line}\n      />\n    </Space>\n  );\n};\n\n///REVIEW - It's still useful? can't find usage\nexport const CodeViewAlert: React.FC<CodeViewAlertProps> = ({ data, cwd }) => {\n  const { title, description = '', level, code, file } = data;\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const startLine = file.ranges?.[0].start.line;\n\n  const Description = (\n    <Space direction=\"vertical\">\n      <Typography.Text>{description}</Typography.Text>\n      <Space>\n        <Typography.Text>File:</Typography.Text>\n        <Typography.Text strong code>\n          {file.path}\n        </Typography.Text>\n        {Lodash.isNumber(startLine) ? (\n          <>\n            <Typography.Text>in line</Typography.Text>\n            <Typography.Text strong code>\n              {startLine}\n            </Typography.Text>\n          </>\n        ) : (\n          ''\n        )}\n      </Space>\n    </Space>\n  );\n\n  return (\n    <Alert\n      showIcon\n      message={\n        <Space>\n          <Typography.Text\n            code\n            strong\n            onClick={navigate}\n            style={{ cursor: 'pointer' }}\n          >\n            <a>{code}</a>\n          </Typography.Text>\n          <Typography.Text strong>{title}</Typography.Text>\n        </Space>\n      }\n      description={Description}\n      type={level === 'warn' ? 'info' : level}\n      action={\n        <Space>\n          <TextDrawer text={'Show Source Code'} buttonProps={{ size: 'small' }}>\n            <CodeViewDrawerContent data={data} cwd={cwd} />\n          </TextDrawer>\n          <>\n            <Divider type=\"vertical\" />\n            <Button\n              type=\"link\"\n              onClick={navigate}\n              size=\"small\"\n              icon={<InfoCircleOutlined />}\n            />\n          </>\n        </Space>\n      }\n    />\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/components/Alerts/overlay.js

@@ -40,13 +40,18 @@ function getOverlayAlertsMessage(alerts) {
     detail: /* @__PURE__ */ jsxs(Typography.Text, { strong: true, style: { color: "#fff", marginBottom: 0 }, children: [
       /* @__PURE__ */ jsx(Typography.Text, { style: { color: "inherit", fontSize }, children: "Compiled with" }),
       /* @__PURE__ */ jsxs(Typography.Text, { strong: true, style: { color: Color.Red, fontSize }, children: [
+        " ",
         errors,
-        " errors"
+        " ",
+        errors === 1 ? "error" : "errors",
+        " "
       ] }),
       /* @__PURE__ */ jsx(Typography.Text, { style: { color: "inherit", fontSize }, children: "and" }),
       /* @__PURE__ */ jsxs(Typography.Text, { strong: true, style: { color: Color.Yellow, fontSize }, children: [
+        " ",
         warns,
-        " warnings"
+        " ",
+        warns === 1 ? "warning" : "warnings"
       ] })
     ] }),
     warns,

package/dist/components/Alerts/overlay.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["e"],"ignoreList":[],"sources":["../../../src/components/Alerts/overlay.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Alert,\n  Button,\n  Col,\n  Collapse,\n  Row,\n  Tag,\n  Typography,\n  Badge,\n} from 'antd';\nimport {\n  BugOutlined,\n  CloseCircleOutlined,\n  DownOutlined,\n  RightOutlined,\n} from '@ant-design/icons';\nimport Dialog from 'rc-dialog';\nimport Ansi from 'ansi-to-react';\n\nimport { withServerAPI } from '../Manifest';\nimport { Size, Color } from '../../constants';\n\nimport styles from './overlay.module';\n\nimport 'rc-dialog/assets/index.css';\n\nfunction getOverlayAlertsMessage(\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>,\n) {\n  let warns = 0;\n  let errors = 0;\n\n  alerts.forEach((item) => {\n    if (item.level === 'warn') {\n      warns++;\n    } else {\n      errors++;\n    }\n  });\n\n  const suffixText =\n    warns !== 0 && errors !== 0 ? 'problems' : warns === 0 ? 'errors' : 'warns';\n\n  const fontSize = 16;\n\n  return {\n    title: `${alerts.length} compiled ${suffixText}`,\n    detail: (\n      <Typography.Text strong style={{ color: '#fff', marginBottom: 0 }}>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          Compiled with\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Red, fontSize }}>\n          {errors} errors\n        </Typography.Text>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          and\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Yellow, fontSize }}>\n          {warns} warnings\n        </Typography.Text>\n      </Typography.Text>\n    ),\n    warns,\n    errors,\n  };\n}\n\nexport const OverlayAlertsModal: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  open: boolean;\n  onClose(): void;\n}> = ({ alerts = [], open, onClose }) => {\n  if (!alerts.length) return null;\n\n  return (\n    <Dialog\n      visible={open}\n      onClose={() => onClose()}\n      style={{ width: '100%', height: '100%', margin: 0, zIndex: 1000 }}\n      closable={false}\n      modalRender={(e) => {\n        return React.cloneElement(e as React.ReactElement, {\n          style: {\n            background: 'rgba(0, 0, 0, 0.7)',\n            color: '#fff',\n            height: '100%',\n            overflow: 'scroll',\n            borderRadius: 0,\n          },\n        });\n      }}\n    >\n      <Row justify=\"space-between\" align=\"middle\">\n        {getOverlayAlertsMessage(alerts).detail}\n        <Button\n          onClick={() => onClose()}\n          type=\"text\"\n          style={{ color: '#fff' }}\n          size=\"large\"\n          icon={<CloseCircleOutlined />}\n        ></Button>\n      </Row>\n      <Row gutter={[0, Size.BasePadding]}>\n        {alerts.map((e) => {\n          return (\n            <Col\n              span={24}\n              key={e.id}\n              style={{\n                whiteSpace: 'pre-wrap',\n                lineHeight: `16px`,\n                fontSize: 14,\n              }}\n            >\n              <Collapse\n                ghost\n                style={{ background: '#000' }}\n                defaultActiveKey={[e.id]}\n                expandIcon={(e) => {\n                  return e.isActive ? (\n                    <DownOutlined style={{ color: '#fff' }} />\n                  ) : (\n                    <RightOutlined style={{ color: '#fff' }} />\n                  );\n                }}\n              >\n                <Collapse.Panel\n                  header={\n                    <div style={{ color: '#fff' }}>\n                      {e.level === 'warn' ? (\n                        <Tag color={Color.Yellow}>WARNING</Tag>\n                      ) : (\n                        <Tag color={Color.Red}>ERROR</Tag>\n                      )}\n                      <Ansi>{e.description || e.title}</Ansi>\n                    </div>\n                  }\n                  key={e.id}\n                >\n                  <div style={{ color: '#fff' }}>\n                    <Ansi>{e.stack}</Ansi>\n                  </div>\n                </Collapse.Panel>\n              </Collapse>\n            </Col>\n          );\n        })}\n      </Row>\n    </Dialog>\n  );\n};\n\nexport const OverlayAlertsTips: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  defaultOpen?: boolean;\n}> = ({ alerts = [], defaultOpen = alerts.length > 0 }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(defaultOpen);\n\n  return (\n    <React.Fragment>\n      <Alert\n        banner\n        message={React.cloneElement(getOverlayAlertsMessage(alerts).detail, {\n          style: {\n            color: '#000',\n          },\n        })}\n        icon={<BugOutlined />}\n        action={\n          <Button onClick={() => setOpen(true)} size=\"small\">\n            More\n          </Button>\n        }\n      ></Alert>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </React.Fragment>\n  );\n};\n\nexport const OverlayAlertsButton: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n}> = ({ alerts = [] }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(false);\n\n  return (\n    <div className={styles.container}>\n      <div onClick={() => setOpen(!open)} className={styles.badgeContainer}>\n        <Badge count={alerts.length} size=\"small\">\n          <BugOutlined style={{ fontSize: 15 }} />\n        </Badge>\n      </div>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </div>\n  );\n};\n\nexport const OverlayAlertsWithButton = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsButton,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n\nexport const OverlayAlertsWithTips = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsTips,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"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","names":["e"],"ignoreList":[],"sources":["../../../src/components/Alerts/overlay.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Alert,\n  Button,\n  Col,\n  Collapse,\n  Row,\n  Tag,\n  Typography,\n  Badge,\n} from 'antd';\nimport {\n  BugOutlined,\n  CloseCircleOutlined,\n  DownOutlined,\n  RightOutlined,\n} from '@ant-design/icons';\nimport Dialog from 'rc-dialog';\nimport Ansi from 'ansi-to-react';\n\nimport { withServerAPI } from '../Manifest';\nimport { Size, Color } from '../../constants';\n\nimport styles from './overlay.module';\n\nimport 'rc-dialog/assets/index.css';\n\nfunction getOverlayAlertsMessage(\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>,\n) {\n  let warns = 0;\n  let errors = 0;\n\n  alerts.forEach((item) => {\n    if (item.level === 'warn') {\n      warns++;\n    } else {\n      errors++;\n    }\n  });\n\n  const suffixText =\n    warns !== 0 && errors !== 0 ? 'problems' : warns === 0 ? 'errors' : 'warns';\n\n  const fontSize = 16;\n\n  return {\n    title: `${alerts.length} compiled ${suffixText}`,\n    detail: (\n      <Typography.Text strong style={{ color: '#fff', marginBottom: 0 }}>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          Compiled with\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Red, fontSize }}>\n          {' '}\n          {errors} {errors === 1 ? 'error' : 'errors'}{' '}\n        </Typography.Text>\n        <Typography.Text style={{ color: 'inherit', fontSize }}>\n          and\n        </Typography.Text>\n        <Typography.Text strong style={{ color: Color.Yellow, fontSize }}>\n          {' '}\n          {warns} {warns === 1 ? 'warning' : 'warnings'}\n        </Typography.Text>\n      </Typography.Text>\n    ),\n    warns,\n    errors,\n  };\n}\n\nexport const OverlayAlertsModal: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  open: boolean;\n  onClose(): void;\n}> = ({ alerts = [], open, onClose }) => {\n  if (!alerts.length) return null;\n\n  return (\n    <Dialog\n      visible={open}\n      onClose={() => onClose()}\n      style={{ width: '100%', height: '100%', margin: 0, zIndex: 1000 }}\n      closable={false}\n      modalRender={(e) => {\n        return React.cloneElement(e as React.ReactElement, {\n          style: {\n            background: 'rgba(0, 0, 0, 0.7)',\n            color: '#fff',\n            height: '100%',\n            overflow: 'scroll',\n            borderRadius: 0,\n          },\n        });\n      }}\n    >\n      <Row justify=\"space-between\" align=\"middle\">\n        {getOverlayAlertsMessage(alerts).detail}\n        <Button\n          onClick={() => onClose()}\n          type=\"text\"\n          style={{ color: '#fff' }}\n          size=\"large\"\n          icon={<CloseCircleOutlined />}\n        ></Button>\n      </Row>\n      <Row gutter={[0, Size.BasePadding]}>\n        {alerts.map((e) => {\n          return (\n            <Col\n              span={24}\n              key={e.id}\n              style={{\n                whiteSpace: 'pre-wrap',\n                lineHeight: `16px`,\n                fontSize: 14,\n              }}\n            >\n              <Collapse\n                ghost\n                style={{ background: '#000' }}\n                defaultActiveKey={[e.id]}\n                expandIcon={(e) => {\n                  return e.isActive ? (\n                    <DownOutlined style={{ color: '#fff' }} />\n                  ) : (\n                    <RightOutlined style={{ color: '#fff' }} />\n                  );\n                }}\n              >\n                <Collapse.Panel\n                  header={\n                    <div style={{ color: '#fff' }}>\n                      {e.level === 'warn' ? (\n                        <Tag color={Color.Yellow}>WARNING</Tag>\n                      ) : (\n                        <Tag color={Color.Red}>ERROR</Tag>\n                      )}\n                      <Ansi>{e.description || e.title}</Ansi>\n                    </div>\n                  }\n                  key={e.id}\n                >\n                  <div style={{ color: '#fff' }}>\n                    <Ansi>{e.stack}</Ansi>\n                  </div>\n                </Collapse.Panel>\n              </Collapse>\n            </Col>\n          );\n        })}\n      </Row>\n    </Dialog>\n  );\n};\n\nexport const OverlayAlertsTips: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n  defaultOpen?: boolean;\n}> = ({ alerts = [], defaultOpen = alerts.length > 0 }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(defaultOpen);\n\n  return (\n    <React.Fragment>\n      <Alert\n        banner\n        message={React.cloneElement(getOverlayAlertsMessage(alerts).detail, {\n          style: {\n            color: '#000',\n          },\n        })}\n        icon={<BugOutlined />}\n        action={\n          <Button onClick={() => setOpen(true)} size=\"small\">\n            More\n          </Button>\n        }\n      ></Alert>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </React.Fragment>\n  );\n};\n\nexport const OverlayAlertsButton: React.FC<{\n  alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n}> = ({ alerts = [] }) => {\n  if (!alerts.length) return null;\n\n  const [open, setOpen] = useState(false);\n\n  return (\n    <div className={styles.container}>\n      <div onClick={() => setOpen(!open)} className={styles.badgeContainer}>\n        <Badge count={alerts.length} size=\"small\">\n          <BugOutlined style={{ fontSize: 15 }} />\n        </Badge>\n      </div>\n      <OverlayAlertsModal\n        alerts={alerts}\n        open={open}\n        onClose={() => setOpen(false)}\n      />\n    </div>\n  );\n};\n\nexport const OverlayAlertsWithButton = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsButton,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n\nexport const OverlayAlertsWithTips = withServerAPI({\n  api: SDK.ServerAPI.API.GetOverlayAlerts,\n  Component: OverlayAlertsTips,\n  responsePropName: 'alerts',\n  fallbackComponent: () => null,\n});\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/components/Loader/Analysis/files.js

@@ -16,14 +16,13 @@ import {
   Typography
 } from "antd";
 import { get } from "lodash-es";
-import React, { useCallback, useMemo, useRef, useState } from "react";
+import React, { useMemo, useState } from "react";
 import { drawerWidth, Size } from "../../../constants";
 import {
   createFileStructures,
   filterLoader,
   formatCosts,
-  mapFileKey,
-  useMonacoEditor
+  mapFileKey
 } from "../../../utils";
 import { FileTree } from "../../FileTree";
 import { Keyword } from "../../Keyword";
@@ -37,11 +36,6 @@ const LoaderFiles = (props) => {
   const [resourcePath, setResourcePath] = useState("");
   const [loaderIndex, setLoaderIndex] = useState(0);
   const [selectedNode, setSelectedNode] = useState(null);
-  const monacoRef = useRef(null);
-  const { initMonaco } = useMonacoEditor();
-  const init = useCallback(async () => {
-    await initMonaco(monacoRef);
-  }, []);
   const maxHeight = 800;
   const filteredFiles = useMemo(
     () => filetree.filter(
@@ -207,7 +201,6 @@ const LoaderFiles = (props) => {
               ),
               treeData: files,
               onSelect: (_e, info) => {
-                init();
                 if (!info.node.isLeaf) {
                   setSelectedNode(info.node);
                 }

package/dist/components/Loader/Analysis/files.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["resourcePath"],"ignoreList":[],"sources":["../../../../src/components/Loader/Analysis/files.tsx"],"sourcesContent":["import { CloseCircleOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Col,\n  Divider,\n  Drawer,\n  List,\n  Popover,\n  Row,\n  Space,\n  Table,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { get } from 'lodash-es';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { drawerWidth, Size } from '../../../constants';\nimport {\n  createFileStructures,\n  DataNode,\n  filterLoader,\n  formatCosts,\n  mapFileKey,\n  useMonacoEditor,\n} from '../../../utils';\nimport { FileTree } from '../../FileTree';\nimport { Keyword } from '../../Keyword';\nimport { ServerAPIProvider } from '../../Manifest';\nimport { LoaderExecutions } from '../executions';\nimport styles from './style.module';\n\nconst ADDITION_LOADER_NUMBER = 3;\n// const { innerWidth } = window;\n\nexport const LoaderFiles: React.FC<{\n  filetree: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileTree>;\n  cwd: string;\n  loaders: string[];\n  filename: string;\n  layer?: string;\n}> = (props) => {\n  const { cwd, filetree } = props;\n  const [drawerVisible, setDrawerVisible] = useState(false);\n  const [resourcePath, setResourcePath] = useState('');\n  const [loaderIndex, setLoaderIndex] = useState(0);\n  const [selectedNode, setSelectedNode] = useState<DataNode | null>(null);\n\n  const monacoRef = useRef<HTMLElement>(null);\n  const { initMonaco } = useMonacoEditor();\n\n  const init = useCallback(async () => {\n    await initMonaco(monacoRef);\n  }, []);\n\n  const maxHeight = 800;\n\n  const filteredFiles = useMemo(\n    () =>\n      filetree.filter((e) =>\n        e.loaders.some((l) =>\n          filterLoader(\n            e.path,\n            l.loader,\n            props.filename,\n            props.loaders,\n            e.layer,\n            props?.layer,\n          ),\n        ),\n      ),\n    [props.filename, props.loaders, props.layer],\n  );\n\n  const inlinedResourcePathKey = '__RESOURCEPATH__';\n\n  const files = useMemo(() => {\n    return createFileStructures({\n      files: filteredFiles.map((e) => e.path),\n      cwd,\n      fileTitle(file, basename) {\n        const { loaders, layer } = filetree.find((e) => e.path === file)!;\n\n        const additionalLoaders: (Pick<\n          SDK.LoaderTransformData,\n          'path' | 'loader' | 'errors'\n        > & { costs: number })[] = [];\n\n        loaders.forEach(\n          (l, i) => i > ADDITION_LOADER_NUMBER && additionalLoaders.push(l),\n        );\n\n        return (\n          <div\n            style={{\n              wordBreak: 'break-all',\n              display: 'flex',\n              cursor: 'pointer',\n            }}\n            onClick={() => {\n              setLoaderIndex(0);\n              setResourcePath(file);\n              setDrawerVisible(true);\n            }}\n          >\n            <div className={styles.box}>\n              <div className={styles.keywords}>\n                <Keyword text={basename.replace(/\\[.*?\\]/g, '')} keyword={''} />\n              </div>\n            </div>\n            <div className={styles.dividerDiv} style={{ flex: 1 }}>\n              <Divider className={styles.divider} dashed />\n            </div>\n\n            {layer && (\n              <Tag color=\"cyan\" bordered={false}>\n                {layer}\n              </Tag>\n            )}\n            <Space>\n              {loaders.slice(0, ADDITION_LOADER_NUMBER).map((e, i) => {\n                const isError = e.errors && e.errors.length;\n                const key = `${file}_${e.loader}_${i}`;\n                if (i <= ADDITION_LOADER_NUMBER) {\n                  return (\n                    <Tooltip title={e.path} key={key}>\n                      <Typography.Text\n                        className={styles.textBox}\n                        style={{ color: isError ? '#f50' : 'inherit' }}\n                        onClick={(ev) => {\n                          ev.stopPropagation();\n                          setResourcePath(file);\n                          setLoaderIndex(i);\n                          setDrawerVisible(true);\n                        }}\n                      >\n                        <Typography.Text className={styles.text} ellipsis>\n                          {e.loader.match(/([^/]+-loader)/g)?.[0] || e.loader}\n                        </Typography.Text>\n                        <Divider type=\"vertical\" />\n                        {isError ? (\n                          <CloseCircleOutlined />\n                        ) : (\n                          <Typography.Text className={styles.text}>\n                            {formatCosts(e.costs)}\n                          </Typography.Text>\n                        )}\n                      </Typography.Text>\n                    </Tooltip>\n                  );\n                }\n              })}\n              {additionalLoaders?.length ? (\n                <Popover\n                  content={\n                    <List\n                      dataSource={additionalLoaders}\n                      renderItem={(e, i) => {\n                        const isError = e.errors && e.errors.length;\n                        const key = `${file}_${e.loader}_${i + ADDITION_LOADER_NUMBER}`;\n\n                        return (\n                          <List.Item>\n                            <Tooltip title={e.path} key={key}>\n                              <div style={{ paddingBottom: 5 }}>\n                                <Typography.Text\n                                  className={styles.textBox}\n                                  style={{\n                                    color: isError ? '#f50' : 'inherit',\n                                  }}\n                                  onClick={(ev) => {\n                                    ev.stopPropagation();\n                                    setResourcePath(file);\n                                    setLoaderIndex(i);\n                                    setDrawerVisible(true);\n                                  }}\n                                >\n                                  <Typography.Text\n                                    className={styles.text}\n                                    ellipsis\n                                  >\n                                    {e.loader.match(/([^/]+-loader)/g)?.[0] ||\n                                      e.loader}\n                                  </Typography.Text>\n                                  <Divider type=\"vertical\" />\n                                  <Typography.Text className={styles.text}>\n                                    {formatCosts(e.costs)}\n                                  </Typography.Text>\n                                </Typography.Text>\n                              </div>\n                            </Tooltip>\n                          </List.Item>\n                        );\n                      }}\n                    />\n                  }\n                >\n                  <div className={styles.textBox}>\n                    <Typography.Text>···</Typography.Text>\n                  </div>\n                </Popover>\n              ) : (\n                <></>\n              )}\n            </Space>\n          </div>\n        );\n      },\n      dirTitle(_dir, defaultTitle) {\n        return (\n          <div style={{ display: 'flex', cursor: 'pointer' }}>\n            <Keyword text={defaultTitle} keyword={''} />\n          </div>\n        );\n      },\n    });\n  }, [filteredFiles]);\n\n  return (\n    <Row style={{ width: '100%', marginLeft: 0 }} gutter={Size.BasePadding}>\n      <Col span={24}>\n        <Card\n          title={\n            <Space>\n              <Typography.Text strong>Files</Typography.Text>\n              <Typography.Text\n                style={{\n                  fontSize: 12,\n                  fontWeight: 400,\n                  color: '#1C1F2399',\n                  opacity: 0.6,\n                }}\n              >\n                Total Files: {filteredFiles.length}\n              </Typography.Text>\n            </Space>\n          }\n          bodyStyle={{\n            overflow: 'auto',\n            maxHeight,\n            minHeight: '40rem',\n            padding: 14,\n          }}\n        >\n          <FileTree\n            defaultExpandedKeys={mapFileKey(\n              files,\n              filteredFiles.length >= 100 ? 3 : 4,\n              (node) => {\n                const resourcePath: string = get(node, inlinedResourcePathKey)!;\n                const isNodeModules =\n                  resourcePath.indexOf('/node_modules/') > -1;\n\n                return !isNodeModules;\n              },\n            )}\n            treeData={files}\n            key={`${props.loaders.join('|')}_${props.filename}`}\n            onSelect={(_e, info) => {\n              init();\n              if (!info.node.isLeaf) {\n                setSelectedNode(info.node);\n              }\n            }}\n            selectedKeys={selectedNode ? [selectedNode.key] : undefined}\n            expandAction=\"click\"\n          />\n          <Drawer\n            open={drawerVisible}\n            onClose={() => setDrawerVisible(false)}\n            maskClosable\n            width={drawerWidth}\n            zIndex={999}\n            bodyStyle={{ padding: 0 }}\n          >\n            {drawerVisible ? (\n              <ServerAPIProvider\n                api={SDK.ServerAPI.API.GetLoaderFileDetails}\n                body={{ path: resourcePath }}\n              >\n                {(data) => (\n                  <LoaderExecutions data={data} cwd={cwd} index={loaderIndex} />\n                )}\n              </ServerAPIProvider>\n            ) : null}\n          </Drawer>\n        </Card>\n      </Col>\n\n      <Drawer\n        open={!!selectedNode}\n        onClose={() => setSelectedNode(null)}\n        maskClosable\n        width={drawerWidth}\n        zIndex={999}\n        bodyStyle={{ padding: 0 }}\n      >\n        {selectedNode && (\n          <Row>\n            <Col span={24}>\n              <Card\n                title={\n                  <Tooltip\n                    title={React.cloneElement(\n                      selectedNode.title as React.ReactElement,\n                      { style: { color: '#fff' } },\n                    )}\n                  >\n                    <Typography.Text>\n                      {`Statistics of`}\n                      {selectedNode.title as React.ReactNode}\n                    </Typography.Text>\n                  </Tooltip>\n                }\n              >\n                <ServerAPIProvider\n                  api={SDK.ServerAPI.API.GetLoaderFolderStatistics}\n                  body={{ folder: selectedNode[inlinedResourcePathKey] }}\n                >\n                  {(tableData) => (\n                    <Table\n                      style={{\n                        width: '100%',\n                        maxHeight,\n                        height: '40rem',\n                        overflowY: 'scroll',\n                        wordBreak: 'break-all',\n                      }}\n                      pagination={false}\n                      bordered\n                      rowKey={(e) => e.loader}\n                      columns={[\n                        {\n                          title: 'Loader Name',\n                          dataIndex: 'loader',\n                        },\n                        {\n                          title: 'Files',\n                          dataIndex: 'files',\n                        },\n                        {\n                          title: 'Total Duration',\n                          dataIndex: 'costs',\n                          render: (v) => (\n                            <Typography.Text strong>\n                              {formatCosts(v)}\n                            </Typography.Text>\n                          ),\n                          sorter: (a, b) => a.costs - b.costs,\n                          defaultSortOrder: 'descend',\n                          sortDirections: ['descend', 'ascend'],\n                        },\n                      ]}\n                      dataSource={tableData!}\n                    />\n                  )}\n                </ServerAPIProvider>\n              </Card>\n            </Col>\n          </Row>\n        )}\n      </Drawer>\n    </Row>\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"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","names":["resourcePath"],"ignoreList":[],"sources":["../../../../src/components/Loader/Analysis/files.tsx"],"sourcesContent":["import { CloseCircleOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Col,\n  Divider,\n  Drawer,\n  List,\n  Popover,\n  Row,\n  Space,\n  Table,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { get } from 'lodash-es';\nimport React, { useMemo, useState } from 'react';\nimport { drawerWidth, Size } from '../../../constants';\nimport {\n  createFileStructures,\n  DataNode,\n  filterLoader,\n  formatCosts,\n  mapFileKey,\n} from '../../../utils';\nimport { FileTree } from '../../FileTree';\nimport { Keyword } from '../../Keyword';\nimport { ServerAPIProvider } from '../../Manifest';\nimport { LoaderExecutions } from '../executions';\nimport styles from './style.module';\n\nconst ADDITION_LOADER_NUMBER = 3;\n\nexport const LoaderFiles: React.FC<{\n  filetree: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileTree>;\n  cwd: string;\n  loaders: string[];\n  filename: string;\n  layer?: string;\n}> = (props) => {\n  const { cwd, filetree } = props;\n  const [drawerVisible, setDrawerVisible] = useState(false);\n  const [resourcePath, setResourcePath] = useState('');\n  const [loaderIndex, setLoaderIndex] = useState(0);\n  const [selectedNode, setSelectedNode] = useState<DataNode | null>(null);\n\n  const maxHeight = 800;\n\n  const filteredFiles = useMemo(\n    () =>\n      filetree.filter((e) =>\n        e.loaders.some((l) =>\n          filterLoader(\n            e.path,\n            l.loader,\n            props.filename,\n            props.loaders,\n            e.layer,\n            props?.layer,\n          ),\n        ),\n      ),\n    [props.filename, props.loaders, props.layer],\n  );\n\n  const inlinedResourcePathKey = '__RESOURCEPATH__';\n\n  const files = useMemo(() => {\n    return createFileStructures({\n      files: filteredFiles.map((e) => e.path),\n      cwd,\n      fileTitle(file, basename) {\n        const { loaders, layer } = filetree.find((e) => e.path === file)!;\n\n        const additionalLoaders: (Pick<\n          SDK.LoaderTransformData,\n          'path' | 'loader' | 'errors'\n        > & { costs: number })[] = [];\n\n        loaders.forEach(\n          (l, i) => i > ADDITION_LOADER_NUMBER && additionalLoaders.push(l),\n        );\n\n        return (\n          <div\n            style={{\n              wordBreak: 'break-all',\n              display: 'flex',\n              cursor: 'pointer',\n            }}\n            onClick={() => {\n              setLoaderIndex(0);\n              setResourcePath(file);\n              setDrawerVisible(true);\n            }}\n          >\n            <div className={styles.box}>\n              <div className={styles.keywords}>\n                <Keyword text={basename.replace(/\\[.*?\\]/g, '')} keyword={''} />\n              </div>\n            </div>\n            <div className={styles.dividerDiv} style={{ flex: 1 }}>\n              <Divider className={styles.divider} dashed />\n            </div>\n\n            {layer && (\n              <Tag color=\"cyan\" bordered={false}>\n                {layer}\n              </Tag>\n            )}\n            <Space>\n              {loaders.slice(0, ADDITION_LOADER_NUMBER).map((e, i) => {\n                const isError = e.errors && e.errors.length;\n                const key = `${file}_${e.loader}_${i}`;\n                if (i <= ADDITION_LOADER_NUMBER) {\n                  return (\n                    <Tooltip title={e.path} key={key}>\n                      <Typography.Text\n                        className={styles.textBox}\n                        style={{ color: isError ? '#f50' : 'inherit' }}\n                        onClick={(ev) => {\n                          ev.stopPropagation();\n                          setResourcePath(file);\n                          setLoaderIndex(i);\n                          setDrawerVisible(true);\n                        }}\n                      >\n                        <Typography.Text className={styles.text} ellipsis>\n                          {e.loader.match(/([^/]+-loader)/g)?.[0] || e.loader}\n                        </Typography.Text>\n                        <Divider type=\"vertical\" />\n                        {isError ? (\n                          <CloseCircleOutlined />\n                        ) : (\n                          <Typography.Text className={styles.text}>\n                            {formatCosts(e.costs)}\n                          </Typography.Text>\n                        )}\n                      </Typography.Text>\n                    </Tooltip>\n                  );\n                }\n              })}\n              {additionalLoaders?.length ? (\n                <Popover\n                  content={\n                    <List\n                      dataSource={additionalLoaders}\n                      renderItem={(e, i) => {\n                        const isError = e.errors && e.errors.length;\n                        const key = `${file}_${e.loader}_${i + ADDITION_LOADER_NUMBER}`;\n\n                        return (\n                          <List.Item>\n                            <Tooltip title={e.path} key={key}>\n                              <div style={{ paddingBottom: 5 }}>\n                                <Typography.Text\n                                  className={styles.textBox}\n                                  style={{\n                                    color: isError ? '#f50' : 'inherit',\n                                  }}\n                                  onClick={(ev) => {\n                                    ev.stopPropagation();\n                                    setResourcePath(file);\n                                    setLoaderIndex(i);\n                                    setDrawerVisible(true);\n                                  }}\n                                >\n                                  <Typography.Text\n                                    className={styles.text}\n                                    ellipsis\n                                  >\n                                    {e.loader.match(/([^/]+-loader)/g)?.[0] ||\n                                      e.loader}\n                                  </Typography.Text>\n                                  <Divider type=\"vertical\" />\n                                  <Typography.Text className={styles.text}>\n                                    {formatCosts(e.costs)}\n                                  </Typography.Text>\n                                </Typography.Text>\n                              </div>\n                            </Tooltip>\n                          </List.Item>\n                        );\n                      }}\n                    />\n                  }\n                >\n                  <div className={styles.textBox}>\n                    <Typography.Text>···</Typography.Text>\n                  </div>\n                </Popover>\n              ) : (\n                <></>\n              )}\n            </Space>\n          </div>\n        );\n      },\n      dirTitle(_dir, defaultTitle) {\n        return (\n          <div style={{ display: 'flex', cursor: 'pointer' }}>\n            <Keyword text={defaultTitle} keyword={''} />\n          </div>\n        );\n      },\n    });\n  }, [filteredFiles]);\n\n  return (\n    <Row style={{ width: '100%', marginLeft: 0 }} gutter={Size.BasePadding}>\n      <Col span={24}>\n        <Card\n          title={\n            <Space>\n              <Typography.Text strong>Files</Typography.Text>\n              <Typography.Text\n                style={{\n                  fontSize: 12,\n                  fontWeight: 400,\n                  color: '#1C1F2399',\n                  opacity: 0.6,\n                }}\n              >\n                Total Files: {filteredFiles.length}\n              </Typography.Text>\n            </Space>\n          }\n          bodyStyle={{\n            overflow: 'auto',\n            maxHeight,\n            minHeight: '40rem',\n            padding: 14,\n          }}\n        >\n          <FileTree\n            defaultExpandedKeys={mapFileKey(\n              files,\n              filteredFiles.length >= 100 ? 3 : 4,\n              (node) => {\n                const resourcePath: string = get(node, inlinedResourcePathKey)!;\n                const isNodeModules =\n                  resourcePath.indexOf('/node_modules/') > -1;\n\n                return !isNodeModules;\n              },\n            )}\n            treeData={files}\n            key={`${props.loaders.join('|')}_${props.filename}`}\n            onSelect={(_e, info) => {\n              if (!info.node.isLeaf) {\n                setSelectedNode(info.node);\n              }\n            }}\n            selectedKeys={selectedNode ? [selectedNode.key] : undefined}\n            expandAction=\"click\"\n          />\n          <Drawer\n            open={drawerVisible}\n            onClose={() => setDrawerVisible(false)}\n            maskClosable\n            width={drawerWidth}\n            zIndex={999}\n            bodyStyle={{ padding: 0 }}\n          >\n            {drawerVisible ? (\n              <ServerAPIProvider\n                api={SDK.ServerAPI.API.GetLoaderFileDetails}\n                body={{ path: resourcePath }}\n              >\n                {(data) => (\n                  <LoaderExecutions data={data} cwd={cwd} index={loaderIndex} />\n                )}\n              </ServerAPIProvider>\n            ) : null}\n          </Drawer>\n        </Card>\n      </Col>\n\n      <Drawer\n        open={!!selectedNode}\n        onClose={() => setSelectedNode(null)}\n        maskClosable\n        width={drawerWidth}\n        zIndex={999}\n        bodyStyle={{ padding: 0 }}\n      >\n        {selectedNode && (\n          <Row>\n            <Col span={24}>\n              <Card\n                title={\n                  <Tooltip\n                    title={React.cloneElement(\n                      selectedNode.title as React.ReactElement,\n                      { style: { color: '#fff' } },\n                    )}\n                  >\n                    <Typography.Text>\n                      {`Statistics of`}\n                      {selectedNode.title as React.ReactNode}\n                    </Typography.Text>\n                  </Tooltip>\n                }\n              >\n                <ServerAPIProvider\n                  api={SDK.ServerAPI.API.GetLoaderFolderStatistics}\n                  body={{ folder: selectedNode[inlinedResourcePathKey] }}\n                >\n                  {(tableData) => (\n                    <Table\n                      style={{\n                        width: '100%',\n                        maxHeight,\n                        height: '40rem',\n                        overflowY: 'scroll',\n                        wordBreak: 'break-all',\n                      }}\n                      pagination={false}\n                      bordered\n                      rowKey={(e) => e.loader}\n                      columns={[\n                        {\n                          title: 'Loader Name',\n                          dataIndex: 'loader',\n                        },\n                        {\n                          title: 'Files',\n                          dataIndex: 'files',\n                        },\n                        {\n                          title: 'Total Duration',\n                          dataIndex: 'costs',\n                          render: (v) => (\n                            <Typography.Text strong>\n                              {formatCosts(v)}\n                            </Typography.Text>\n                          ),\n                          sorter: (a, b) => a.costs - b.costs,\n                          defaultSortOrder: 'descend',\n                          sortDirections: ['descend', 'ascend'],\n                        },\n                      ]}\n                      dataSource={tableData!}\n                    />\n                  )}\n                </ServerAPIProvider>\n              </Card>\n            </Col>\n          </Row>\n        )}\n      </Drawer>\n    </Row>\n  );\n};\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}