@rsdoctor/components 1.5.3-alpha.0 → 1.5.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/common/svg/cursor.mjs +22 -0
- package/dist/common/svg/cursor.mjs.map +1 -0
- package/dist/common/svg/trae.mjs +21 -0
- package/dist/common/svg/trae.mjs.map +1 -0
- package/dist/common/svg/vscode.mjs +158 -0
- package/dist/common/svg/vscode.mjs.map +1 -0
- package/dist/components/Configuration/builder.d.ts +1 -1
- package/dist/components/Loader/Analysis/index.d.ts +1 -1
- package/dist/components/Opener/code.mjs +1 -1
- package/dist/components/Opener/code.mjs.map +1 -1
- package/dist/components/Opener/{vscode.d.ts → ide.d.ts} +2 -0
- package/dist/components/Opener/ide.mjs +62 -0
- package/dist/components/Opener/ide.mjs.map +1 -0
- package/dist/components/Opener/index.d.ts +1 -1
- package/dist/components/Opener/index.mjs +1 -1
- package/dist/components/base/CodeViewer/index.d.ts +1 -1
- package/dist/components/base/CodeViewer/index.mjs +9 -2
- package/dist/components/base/CodeViewer/index.mjs.map +1 -1
- package/dist/components/base/CodeViewer/interface.d.ts +5 -0
- package/dist/pages/ModuleAnalyze/fileTree.d.ts +2 -0
- package/dist/pages/ModuleAnalyze/fileTree.mjs +168 -33
- package/dist/pages/ModuleAnalyze/fileTree.mjs.map +1 -1
- package/dist/pages/ModuleAnalyze/index.mjs +87 -76
- package/dist/pages/ModuleAnalyze/index.mjs.map +1 -1
- package/package.json +8 -8
- package/dist/components/Opener/vscode.mjs +0 -33
- package/dist/components/Opener/vscode.mjs.map +0 -1
|
@@ -1,60 +1,195 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Card, Col, Empty, Popover, Typography } from "antd";
|
|
2
|
+
import { Card, Col, Empty, Popover, Tooltip, Typography } from "antd";
|
|
3
3
|
import { useEffect, useMemo, useState } from "react";
|
|
4
4
|
import { Size } from "../../constants.mjs";
|
|
5
|
+
import { openCursor, openTrae, openVSCode } from "../../components/Opener/index.mjs";
|
|
6
|
+
import { CodeViewer } from "../../components/base/index.mjs";
|
|
7
|
+
import vscode from "../../common/svg/vscode.mjs";
|
|
8
|
+
import cursor from "../../common/svg/cursor.mjs";
|
|
9
|
+
import trae from "../../common/svg/trae.mjs";
|
|
5
10
|
import { FileTree } from "./components/fileTreeCom.mjs";
|
|
6
11
|
import { clsNamePrefix } from "./constants.mjs";
|
|
7
12
|
import dependency from "./dependency.mjs";
|
|
8
13
|
import { getImporteds } from "./utils/index.mjs";
|
|
9
14
|
import { useCreateFileTreeData } from "./utils/hooks.mjs";
|
|
10
15
|
import { TabList } from "./index.mjs";
|
|
11
|
-
const BailoutReasonCard = ({ reasons })=>{
|
|
12
|
-
if (!reasons || !reasons.length) return
|
|
16
|
+
const BailoutReasonCard = ({ reasons, sideEffectCodes, modulePath })=>{
|
|
17
|
+
if ((!reasons || !reasons.length) && (!sideEffectCodes || !sideEffectCodes.length)) return /*#__PURE__*/ jsx(Card, {
|
|
18
|
+
className: `${clsNamePrefix}-bailout-card`,
|
|
19
|
+
bordered: false,
|
|
20
|
+
bodyStyle: {
|
|
21
|
+
padding: 20,
|
|
22
|
+
height: '100%'
|
|
23
|
+
},
|
|
24
|
+
children: /*#__PURE__*/ jsx(Empty, {})
|
|
25
|
+
});
|
|
13
26
|
return /*#__PURE__*/ jsxs(Card, {
|
|
14
27
|
className: `${clsNamePrefix}-bailout-card`,
|
|
15
28
|
bordered: false,
|
|
16
29
|
bodyStyle: {
|
|
17
|
-
padding: 20
|
|
30
|
+
padding: 20,
|
|
31
|
+
height: '100%'
|
|
18
32
|
},
|
|
19
33
|
children: [
|
|
20
|
-
/*#__PURE__*/
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
34
|
+
reasons && /*#__PURE__*/ jsxs(Fragment, {
|
|
35
|
+
children: [
|
|
36
|
+
/*#__PURE__*/ jsx(Typography.Text, {
|
|
37
|
+
strong: true,
|
|
38
|
+
className: `${clsNamePrefix}-bailout-card-title`,
|
|
39
|
+
children: "Bailout Reasons"
|
|
40
|
+
}),
|
|
41
|
+
/*#__PURE__*/ jsx("div", {
|
|
42
|
+
className: `${clsNamePrefix}-bailout-card-list`,
|
|
43
|
+
style: {
|
|
44
|
+
maxHeight: 156,
|
|
45
|
+
overflowY: 'auto'
|
|
46
|
+
},
|
|
47
|
+
children: reasons.length > 0 ? reasons.map((reason, index)=>/*#__PURE__*/ jsxs("div", {
|
|
48
|
+
className: `${clsNamePrefix}-bailout-card-item`,
|
|
49
|
+
children: [
|
|
50
|
+
/*#__PURE__*/ jsx(Popover, {
|
|
51
|
+
content: reason,
|
|
52
|
+
trigger: "hover",
|
|
53
|
+
children: /*#__PURE__*/ jsx(Typography.Paragraph, {
|
|
54
|
+
ellipsis: {
|
|
55
|
+
rows: 1
|
|
56
|
+
},
|
|
57
|
+
className: `${clsNamePrefix}-bailout-card-text`,
|
|
58
|
+
style: {
|
|
59
|
+
marginBottom: 0
|
|
60
|
+
},
|
|
61
|
+
children: reason
|
|
62
|
+
})
|
|
63
|
+
}),
|
|
64
|
+
/*#__PURE__*/ jsxs(Typography.Text, {
|
|
65
|
+
type: "secondary",
|
|
66
|
+
className: `${clsNamePrefix}-bailout-card-meta`,
|
|
67
|
+
children: [
|
|
68
|
+
"#",
|
|
69
|
+
String(index + 1).padStart(2, '0')
|
|
70
|
+
]
|
|
71
|
+
})
|
|
72
|
+
]
|
|
73
|
+
}, `${reason}-${index}`)) : /*#__PURE__*/ jsx(Empty, {})
|
|
74
|
+
})
|
|
75
|
+
]
|
|
24
76
|
}),
|
|
25
|
-
/*#__PURE__*/
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
77
|
+
sideEffectCodes && sideEffectCodes.length > 0 && /*#__PURE__*/ jsxs(Fragment, {
|
|
78
|
+
children: [
|
|
79
|
+
/*#__PURE__*/ jsxs("div", {
|
|
80
|
+
style: {
|
|
81
|
+
display: 'flex',
|
|
82
|
+
alignItems: 'center',
|
|
83
|
+
gap: 8,
|
|
84
|
+
marginTop: reasons?.length ? 12 : 0
|
|
85
|
+
},
|
|
33
86
|
children: [
|
|
34
|
-
/*#__PURE__*/ jsx(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
children:
|
|
38
|
-
|
|
39
|
-
|
|
87
|
+
/*#__PURE__*/ jsx(Typography.Text, {
|
|
88
|
+
strong: true,
|
|
89
|
+
className: `${clsNamePrefix}-bailout-card-title`,
|
|
90
|
+
children: "Side Effect Codes"
|
|
91
|
+
}),
|
|
92
|
+
modulePath && sideEffectCodes[0] && /*#__PURE__*/ jsx(Tooltip, {
|
|
93
|
+
title: `Open in VSCode: line ${sideEffectCodes[0].startLine}`,
|
|
94
|
+
children: /*#__PURE__*/ jsx(vscode, {
|
|
95
|
+
style: {
|
|
96
|
+
width: 16,
|
|
97
|
+
height: 16,
|
|
98
|
+
cursor: 'pointer',
|
|
99
|
+
flexShrink: 0,
|
|
100
|
+
marginBottom: 12
|
|
40
101
|
},
|
|
41
|
-
|
|
102
|
+
onClick: ()=>openVSCode({
|
|
103
|
+
file: modulePath,
|
|
104
|
+
line: sideEffectCodes[0].startLine
|
|
105
|
+
})
|
|
106
|
+
})
|
|
107
|
+
}),
|
|
108
|
+
modulePath && sideEffectCodes[0] && /*#__PURE__*/ jsx(Tooltip, {
|
|
109
|
+
title: `Open in Cursor: line ${sideEffectCodes[0].startLine}`,
|
|
110
|
+
children: /*#__PURE__*/ jsx(cursor, {
|
|
42
111
|
style: {
|
|
43
|
-
|
|
112
|
+
width: 16,
|
|
113
|
+
height: 16,
|
|
114
|
+
cursor: 'pointer',
|
|
115
|
+
flexShrink: 0,
|
|
116
|
+
marginBottom: 12
|
|
44
117
|
},
|
|
45
|
-
|
|
118
|
+
onClick: ()=>openCursor({
|
|
119
|
+
file: modulePath,
|
|
120
|
+
line: sideEffectCodes[0].startLine
|
|
121
|
+
})
|
|
46
122
|
})
|
|
47
123
|
}),
|
|
48
|
-
/*#__PURE__*/
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
124
|
+
modulePath && sideEffectCodes[0] && /*#__PURE__*/ jsx(Tooltip, {
|
|
125
|
+
title: `Open in Trae: line ${sideEffectCodes[0].startLine}`,
|
|
126
|
+
children: /*#__PURE__*/ jsx(trae, {
|
|
127
|
+
style: {
|
|
128
|
+
width: 16,
|
|
129
|
+
height: 16,
|
|
130
|
+
cursor: 'pointer',
|
|
131
|
+
flexShrink: 0,
|
|
132
|
+
marginBottom: 12
|
|
133
|
+
},
|
|
134
|
+
onClick: ()=>openTrae({
|
|
135
|
+
file: modulePath,
|
|
136
|
+
line: sideEffectCodes[0].startLine
|
|
137
|
+
})
|
|
138
|
+
})
|
|
55
139
|
})
|
|
56
140
|
]
|
|
57
|
-
},
|
|
141
|
+
}),
|
|
142
|
+
/*#__PURE__*/ jsx("div", {
|
|
143
|
+
className: `${clsNamePrefix}-bailout-card-list`,
|
|
144
|
+
style: {
|
|
145
|
+
minHeight: '50vh',
|
|
146
|
+
display: 'flex',
|
|
147
|
+
flexDirection: 'column',
|
|
148
|
+
gap: 12,
|
|
149
|
+
overflow: 'auto'
|
|
150
|
+
},
|
|
151
|
+
children: sideEffectCodes.map((item, index)=>/*#__PURE__*/ jsx("div", {
|
|
152
|
+
className: `${clsNamePrefix}-bailout-card-item`,
|
|
153
|
+
style: {
|
|
154
|
+
display: 'flex',
|
|
155
|
+
flexDirection: 'column',
|
|
156
|
+
alignItems: 'flex-start',
|
|
157
|
+
gap: 8,
|
|
158
|
+
minHeight: 0,
|
|
159
|
+
flex: '1 1 0'
|
|
160
|
+
},
|
|
161
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
162
|
+
style: {
|
|
163
|
+
flex: 1,
|
|
164
|
+
minHeight: 0,
|
|
165
|
+
width: '100%',
|
|
166
|
+
display: 'flex',
|
|
167
|
+
flexDirection: 'column'
|
|
168
|
+
},
|
|
169
|
+
children: item.code ? /*#__PURE__*/ jsx(CodeViewer, {
|
|
170
|
+
code: item.code,
|
|
171
|
+
ranges: [
|
|
172
|
+
{
|
|
173
|
+
start: {
|
|
174
|
+
line: item.startLine || 0,
|
|
175
|
+
column: 0
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
],
|
|
179
|
+
filePath: '',
|
|
180
|
+
lang: "javascript",
|
|
181
|
+
style: {
|
|
182
|
+
flex: 1,
|
|
183
|
+
minHeight: '40vh',
|
|
184
|
+
width: '100%'
|
|
185
|
+
},
|
|
186
|
+
isLightTheme: false,
|
|
187
|
+
formatOnMount: true
|
|
188
|
+
}) : /*#__PURE__*/ jsx(Empty, {})
|
|
189
|
+
})
|
|
190
|
+
}, `${item.moduleId}-${index}`))
|
|
191
|
+
})
|
|
192
|
+
]
|
|
58
193
|
})
|
|
59
194
|
]
|
|
60
195
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pages/ModuleAnalyze/fileTree.mjs","sources":["../../../src/pages/ModuleAnalyze/fileTree.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Card, Col, Empty, Popover, Typography } from 'antd';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { Size } from 'src/constants';\nimport { FileTree } from './components/fileTreeCom';\nimport { clsNamePrefix } from './constants';\nimport DependencyTree from './dependency';\nimport { getImporteds } from './utils';\nimport { useCreateFileTreeData } from './utils/hooks';\nimport { TabList } from './index';\n\nexport const BailoutReasonCard: React.FC<{ reasons?: string[] }> = ({\n reasons,\n}) => {\n if (!reasons || !reasons.length) {\n return null;\n }\n return (\n <Card\n className={`${clsNamePrefix}-bailout-card`}\n bordered={false}\n bodyStyle={{ padding: 20 }}\n >\n <Typography.Text strong className={`${clsNamePrefix}-bailout-card-title`}>\n Bailout Reasons\n </Typography.Text>\n <div\n className={`${clsNamePrefix}-bailout-card-list`}\n style={{ maxHeight: 156, overflowY: 'auto' }}\n >\n {reasons.map((reason, index) => (\n <div\n className={`${clsNamePrefix}-bailout-card-item`}\n key={`${reason}-${index}`}\n >\n <Popover content={reason} trigger=\"hover\">\n <Typography.Paragraph\n ellipsis={{ rows: 1 }}\n className={`${clsNamePrefix}-bailout-card-text`}\n style={{ marginBottom: 0 }}\n >\n {reason}\n </Typography.Paragraph>\n </Popover>\n <Typography.Text\n type=\"secondary\"\n className={`${clsNamePrefix}-bailout-card-meta`}\n >\n #{String(index + 1).padStart(2, '0')}\n </Typography.Text>\n </div>\n ))}\n </div>\n </Card>\n );\n};\n\nexport const ModuleFilesTree: React.FC<{\n modules: SDK.ModuleData[];\n dependencies: SDK.DependencyData[];\n curModule: SDK.ModuleData;\n cwd: string;\n selectedChunk: string;\n activeTabKey: string;\n}> = (props) => {\n const {\n curModule,\n modules,\n dependencies,\n cwd,\n activeTabKey,\n selectedChunk = '',\n } = props;\n const [importedModules, setImportedModules] = useState(\n [] as SDK.ModuleData[],\n );\n\n const { data: fileStructures } = useCreateFileTreeData(\n modules,\n importedModules,\n curModule,\n );\n\n useEffect(() => {\n const importeds = getImporteds(curModule, modules);\n setImportedModules(importeds);\n }, [curModule, modules]);\n\n const mainContent = useMemo(() => {\n if (activeTabKey === TabList[TabList.Reasons]) {\n return importedModules ? (\n <FileTree\n cwd={cwd}\n treeData={fileStructures}\n needCode={true}\n needShowAllTree={true}\n needJumpto={true}\n selectedChunk={selectedChunk}\n defaultOpenFather={1}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n );\n }\n\n return (\n <div\n className={`${clsNamePrefix}-file-tree`}\n style={{ padding: Size.BasePadding / 2 }}\n >\n <Col span={24} style={{ marginTop: Size.BasePadding / 2 }}>\n {curModule ? (\n <DependencyTree\n module={curModule}\n dependencies={dependencies}\n cwd={cwd}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n )}\n </Col>\n </div>\n );\n }, [\n activeTabKey,\n curModule,\n dependencies,\n fileStructures,\n importedModules,\n cwd,\n selectedChunk,\n ]);\n\n return <>{mainContent}</>;\n};\n"],"names":["BailoutReasonCard","reasons","Card","clsNamePrefix","Typography","reason","index","Popover","String","ModuleFilesTree","props","curModule","modules","dependencies","cwd","activeTabKey","selectedChunk","importedModules","setImportedModules","useState","fileStructures","useCreateFileTreeData","useEffect","importeds","getImporteds","mainContent","useMemo","TabList","FileTree","Empty","Size","Col","DependencyTree"],"mappings":";;;;;;;;;;AAWO,MAAMA,oBAAsD,CAAC,EAClEC,OAAO,EACR;IACC,IAAI,CAACA,WAAW,CAACA,QAAQ,MAAM,EAC7B,OAAO;IAET,OAAO,WAAP,GACE,KAACC,MAAIA;QACH,WAAW,GAAGC,cAAc,aAAa,CAAC;QAC1C,UAAU;QACV,WAAW;YAAE,SAAS;QAAG;;0BAEzB,IAACC,WAAW,IAAI;gBAAC,QAAM;gBAAC,WAAW,GAAGD,cAAc,mBAAmB,CAAC;0BAAE;;0BAG1E,IAAC;gBACC,WAAW,GAAGA,cAAc,kBAAkB,CAAC;gBAC/C,OAAO;oBAAE,WAAW;oBAAK,WAAW;gBAAO;0BAE1CF,QAAQ,GAAG,CAAC,CAACI,QAAQC,QAAAA,WAAAA,GACpB,KAAC;wBACC,WAAW,GAAGH,cAAc,kBAAkB,CAAC;;0CAG/C,IAACI,SAAOA;gCAAC,SAASF;gCAAQ,SAAQ;0CAChC,kBAACD,WAAW,SAAS;oCACnB,UAAU;wCAAE,MAAM;oCAAE;oCACpB,WAAW,GAAGD,cAAc,kBAAkB,CAAC;oCAC/C,OAAO;wCAAE,cAAc;oCAAE;8CAExBE;;;0CAGL,KAACD,WAAW,IAAI;gCACd,MAAK;gCACL,WAAW,GAAGD,cAAc,kBAAkB,CAAC;;oCAChD;oCACGK,OAAOF,QAAQ,GAAG,QAAQ,CAAC,GAAG;;;;uBAf7B,GAAGD,OAAO,CAAC,EAAEC,OAAO;;;;AAsBrC;AAEO,MAAMG,kBAOR,CAACC;IACJ,MAAM,EACJC,SAAS,EACTC,OAAO,EACPC,YAAY,EACZC,GAAG,EACHC,YAAY,EACZC,gBAAgB,EAAE,EACnB,GAAGN;IACJ,MAAM,CAACO,iBAAiBC,mBAAmB,GAAGC,SAC5C,EAAE;IAGJ,MAAM,EAAE,MAAMC,cAAc,EAAE,GAAGC,sBAC/BT,SACAK,iBACAN;IAGFW,UAAU;QACR,MAAMC,YAAYC,aAAab,WAAWC;QAC1CM,mBAAmBK;IACrB,GAAG;QAACZ;QAAWC;KAAQ;IAEvB,MAAMa,cAAcC,QAAQ;QAC1B,IAAIX,iBAAiBY,OAAO,CAACA,QAAQ,OAAO,CAAC,EAC3C,OAAOV,kBAAkB,WAAlBA,GACL,IAACW,UAAQA;YACP,KAAKd;YACL,UAAUM;YACV,UAAU;YACV,iBAAiB;YACjB,YAAY;YACZ,eAAeJ;YACf,mBAAmB;2BAGrB,IAACa,OAAKA;YAAC,WAAW,GAAG1B,cAAc,MAAM,CAAC;;QAI9C,OAAO,WAAP,GACE,IAAC;YACC,WAAW,GAAGA,cAAc,UAAU,CAAC;YACvC,OAAO;gBAAE,SAAS2B,KAAK,WAAW,GAAG;YAAE;sBAEvC,kBAACC,KAAGA;gBAAC,MAAM;gBAAI,OAAO;oBAAE,WAAWD,KAAK,WAAW,GAAG;gBAAE;0BACrDnB,YAAY,WAAZA,GACC,IAACqB,YAAcA;oBACb,QAAQrB;oBACR,cAAcE;oBACd,KAAKC;mCAGP,IAACe,OAAKA;oBAAC,WAAW,GAAG1B,cAAc,MAAM,CAAC;;;;IAKpD,GAAG;QACDY;QACAJ;QACAE;QACAO;QACAH;QACAH;QACAE;KACD;IAED,OAAO,WAAP,GAAO;kBAAGS;;AACZ"}
|
|
1
|
+
{"version":3,"file":"pages/ModuleAnalyze/fileTree.mjs","sources":["../../../src/pages/ModuleAnalyze/fileTree.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Card, Col, Empty, Popover, Tooltip, Typography } from 'antd';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { Size } from 'src/constants';\nimport { openVSCode, openCursor, openTrae } from 'src/components/Opener';\nimport { CodeViewer } from 'src/components/base';\nimport VSCodeIcon from '../../common/svg/vscode.svg';\nimport CursorIcon from '../../common/svg/cursor.svg';\nimport TraeIcon from '../../common/svg/trae.svg';\nimport { FileTree } from './components/fileTreeCom';\nimport { clsNamePrefix } from './constants';\nimport DependencyTree from './dependency';\nimport { getImporteds } from './utils';\nimport { useCreateFileTreeData } from './utils/hooks';\nimport { TabList } from './index';\n\nexport const BailoutReasonCard: React.FC<{\n reasons?: string[];\n sideEffectCodes?: SDK.SideEffectCodeData[];\n modulePath?: string;\n}> = ({ reasons, sideEffectCodes, modulePath }) => {\n if (\n (!reasons || !reasons.length) &&\n (!sideEffectCodes || !sideEffectCodes.length)\n ) {\n return (\n <Card\n className={`${clsNamePrefix}-bailout-card`}\n bordered={false}\n bodyStyle={{ padding: 20, height: '100%' }}\n >\n <Empty />\n </Card>\n );\n }\n\n return (\n <Card\n className={`${clsNamePrefix}-bailout-card`}\n bordered={false}\n bodyStyle={{ padding: 20, height: '100%' }}\n >\n {reasons && (\n <>\n <Typography.Text\n strong\n className={`${clsNamePrefix}-bailout-card-title`}\n >\n Bailout Reasons\n </Typography.Text>\n <div\n className={`${clsNamePrefix}-bailout-card-list`}\n style={{ maxHeight: 156, overflowY: 'auto' }}\n >\n {reasons.length > 0 ? (\n reasons.map((reason, index) => (\n <div\n className={`${clsNamePrefix}-bailout-card-item`}\n key={`${reason}-${index}`}\n >\n <Popover content={reason} trigger=\"hover\">\n <Typography.Paragraph\n ellipsis={{ rows: 1 }}\n className={`${clsNamePrefix}-bailout-card-text`}\n style={{ marginBottom: 0 }}\n >\n {reason}\n </Typography.Paragraph>\n </Popover>\n <Typography.Text\n type=\"secondary\"\n className={`${clsNamePrefix}-bailout-card-meta`}\n >\n #{String(index + 1).padStart(2, '0')}\n </Typography.Text>\n </div>\n ))\n ) : (\n <Empty />\n )}\n </div>\n </>\n )}\n {sideEffectCodes && sideEffectCodes.length > 0 && (\n <>\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 8,\n marginTop: reasons?.length ? 12 : 0,\n }}\n >\n <Typography.Text\n strong\n className={`${clsNamePrefix}-bailout-card-title`}\n >\n Side Effect Codes\n </Typography.Text>\n {modulePath && sideEffectCodes[0] && (\n <Tooltip\n title={`Open in VSCode: line ${sideEffectCodes[0].startLine}`}\n >\n <VSCodeIcon\n style={{\n width: 16,\n height: 16,\n cursor: 'pointer',\n flexShrink: 0,\n marginBottom: 12,\n }}\n onClick={() =>\n openVSCode({\n file: modulePath,\n line: sideEffectCodes[0].startLine,\n })\n }\n />\n </Tooltip>\n )}\n {modulePath && sideEffectCodes[0] && (\n <Tooltip\n title={`Open in Cursor: line ${sideEffectCodes[0].startLine}`}\n >\n <CursorIcon\n style={{\n width: 16,\n height: 16,\n cursor: 'pointer',\n flexShrink: 0,\n marginBottom: 12,\n }}\n onClick={() =>\n openCursor({\n file: modulePath,\n line: sideEffectCodes[0].startLine,\n })\n }\n />\n </Tooltip>\n )}\n {modulePath && sideEffectCodes[0] && (\n <Tooltip\n title={`Open in Trae: line ${sideEffectCodes[0].startLine}`}\n >\n <TraeIcon\n style={{\n width: 16,\n height: 16,\n cursor: 'pointer',\n flexShrink: 0,\n marginBottom: 12,\n }}\n onClick={() =>\n openTrae({\n file: modulePath,\n line: sideEffectCodes[0].startLine,\n })\n }\n />\n </Tooltip>\n )}\n </div>\n <div\n className={`${clsNamePrefix}-bailout-card-list`}\n style={{\n minHeight: '50vh',\n display: 'flex',\n flexDirection: 'column',\n gap: 12,\n overflow: 'auto',\n }}\n >\n {sideEffectCodes.map((item, index) => (\n <div\n className={`${clsNamePrefix}-bailout-card-item`}\n key={`${item.moduleId}-${index}`}\n style={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: 8,\n minHeight: 0,\n flex: '1 1 0',\n }}\n >\n <div\n style={{\n flex: 1,\n minHeight: 0,\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n }}\n >\n {item.code ? (\n <CodeViewer\n code={item.code}\n ranges={[\n {\n start: {\n line: item.startLine || 0,\n column: 0,\n },\n },\n ]}\n filePath={''}\n lang=\"javascript\"\n style={{ flex: 1, minHeight: '40vh', width: '100%' }}\n isLightTheme={false}\n formatOnMount\n />\n ) : (\n <Empty />\n )}\n </div>\n </div>\n ))}\n </div>\n </>\n )}\n </Card>\n );\n};\n\nexport const ModuleFilesTree: React.FC<{\n modules: SDK.ModuleData[];\n dependencies: SDK.DependencyData[];\n curModule: SDK.ModuleData;\n cwd: string;\n selectedChunk: string;\n activeTabKey: string;\n}> = (props) => {\n const {\n curModule,\n modules,\n dependencies,\n cwd,\n activeTabKey,\n selectedChunk = '',\n } = props;\n const [importedModules, setImportedModules] = useState(\n [] as SDK.ModuleData[],\n );\n\n const { data: fileStructures } = useCreateFileTreeData(\n modules,\n importedModules,\n curModule,\n );\n\n useEffect(() => {\n const importeds = getImporteds(curModule, modules);\n setImportedModules(importeds);\n }, [curModule, modules]);\n\n const mainContent = useMemo(() => {\n if (activeTabKey === TabList[TabList.Reasons]) {\n return importedModules ? (\n <FileTree\n cwd={cwd}\n treeData={fileStructures}\n needCode={true}\n needShowAllTree={true}\n needJumpto={true}\n selectedChunk={selectedChunk}\n defaultOpenFather={1}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n );\n }\n\n return (\n <div\n className={`${clsNamePrefix}-file-tree`}\n style={{ padding: Size.BasePadding / 2 }}\n >\n <Col span={24} style={{ marginTop: Size.BasePadding / 2 }}>\n {curModule ? (\n <DependencyTree\n module={curModule}\n dependencies={dependencies}\n cwd={cwd}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n )}\n </Col>\n </div>\n );\n }, [\n activeTabKey,\n curModule,\n dependencies,\n fileStructures,\n importedModules,\n cwd,\n selectedChunk,\n ]);\n\n return <>{mainContent}</>;\n};\n"],"names":["BailoutReasonCard","reasons","sideEffectCodes","modulePath","Card","clsNamePrefix","Empty","Typography","reason","index","Popover","String","Tooltip","VSCodeIcon","openVSCode","CursorIcon","openCursor","TraeIcon","openTrae","item","CodeViewer","ModuleFilesTree","props","curModule","modules","dependencies","cwd","activeTabKey","selectedChunk","importedModules","setImportedModules","useState","fileStructures","useCreateFileTreeData","useEffect","importeds","getImporteds","mainContent","useMemo","TabList","FileTree","Size","Col","DependencyTree"],"mappings":";;;;;;;;;;;;;;;AAgBO,MAAMA,oBAIR,CAAC,EAAEC,OAAO,EAAEC,eAAe,EAAEC,UAAU,EAAE;IAC5C,IACG,EAACF,WAAW,CAACA,QAAQ,MAAK,KAC1B,EAACC,mBAAmB,CAACA,gBAAgB,MAAK,GAE3C,OAAO,WAAP,GACE,IAACE,MAAIA;QACH,WAAW,GAAGC,cAAc,aAAa,CAAC;QAC1C,UAAU;QACV,WAAW;YAAE,SAAS;YAAI,QAAQ;QAAO;kBAEzC,kBAACC,OAAKA,CAAAA;;IAKZ,OAAO,WAAP,GACE,KAACF,MAAIA;QACH,WAAW,GAAGC,cAAc,aAAa,CAAC;QAC1C,UAAU;QACV,WAAW;YAAE,SAAS;YAAI,QAAQ;QAAO;;YAExCJ,WAAW,WAAXA,GACC;;kCACE,IAACM,WAAW,IAAI;wBACd,QAAM;wBACN,WAAW,GAAGF,cAAc,mBAAmB,CAAC;kCACjD;;kCAGD,IAAC;wBACC,WAAW,GAAGA,cAAc,kBAAkB,CAAC;wBAC/C,OAAO;4BAAE,WAAW;4BAAK,WAAW;wBAAO;kCAE1CJ,QAAQ,MAAM,GAAG,IAChBA,QAAQ,GAAG,CAAC,CAACO,QAAQC,QAAAA,WAAAA,GACnB,KAAC;gCACC,WAAW,GAAGJ,cAAc,kBAAkB,CAAC;;kDAG/C,IAACK,SAAOA;wCAAC,SAASF;wCAAQ,SAAQ;kDAChC,kBAACD,WAAW,SAAS;4CACnB,UAAU;gDAAE,MAAM;4CAAE;4CACpB,WAAW,GAAGF,cAAc,kBAAkB,CAAC;4CAC/C,OAAO;gDAAE,cAAc;4CAAE;sDAExBG;;;kDAGL,KAACD,WAAW,IAAI;wCACd,MAAK;wCACL,WAAW,GAAGF,cAAc,kBAAkB,CAAC;;4CAChD;4CACGM,OAAOF,QAAQ,GAAG,QAAQ,CAAC,GAAG;;;;+BAf7B,GAAGD,OAAO,CAAC,EAAEC,OAAO,mBAoB7B,IAACH,OAAKA,CAAAA;;;;YAKbJ,mBAAmBA,gBAAgB,MAAM,GAAG,KAAK,WAAL,GAC3C;;kCACE,KAAC;wBACC,OAAO;4BACL,SAAS;4BACT,YAAY;4BACZ,KAAK;4BACL,WAAWD,SAAS,SAAS,KAAK;wBACpC;;0CAEA,IAACM,WAAW,IAAI;gCACd,QAAM;gCACN,WAAW,GAAGF,cAAc,mBAAmB,CAAC;0CACjD;;4BAGAF,cAAcD,eAAe,CAAC,EAAE,IAAI,WAAJ,GAC/B,IAACU,SAAOA;gCACN,OAAO,CAAC,qBAAqB,EAAEV,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE;0CAE7D,kBAACW,QAAUA;oCACT,OAAO;wCACL,OAAO;wCACP,QAAQ;wCACR,QAAQ;wCACR,YAAY;wCACZ,cAAc;oCAChB;oCACA,SAAS,IACPC,WAAW;4CACT,MAAMX;4CACN,MAAMD,eAAe,CAAC,EAAE,CAAC,SAAS;wCACpC;;;4BAKPC,cAAcD,eAAe,CAAC,EAAE,IAAI,WAAJ,GAC/B,IAACU,SAAOA;gCACN,OAAO,CAAC,qBAAqB,EAAEV,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE;0CAE7D,kBAACa,QAAUA;oCACT,OAAO;wCACL,OAAO;wCACP,QAAQ;wCACR,QAAQ;wCACR,YAAY;wCACZ,cAAc;oCAChB;oCACA,SAAS,IACPC,WAAW;4CACT,MAAMb;4CACN,MAAMD,eAAe,CAAC,EAAE,CAAC,SAAS;wCACpC;;;4BAKPC,cAAcD,eAAe,CAAC,EAAE,IAAI,WAAJ,GAC/B,IAACU,SAAOA;gCACN,OAAO,CAAC,mBAAmB,EAAEV,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE;0CAE3D,kBAACe,MAAQA;oCACP,OAAO;wCACL,OAAO;wCACP,QAAQ;wCACR,QAAQ;wCACR,YAAY;wCACZ,cAAc;oCAChB;oCACA,SAAS,IACPC,SAAS;4CACP,MAAMf;4CACN,MAAMD,eAAe,CAAC,EAAE,CAAC,SAAS;wCACpC;;;;;kCAMV,IAAC;wBACC,WAAW,GAAGG,cAAc,kBAAkB,CAAC;wBAC/C,OAAO;4BACL,WAAW;4BACX,SAAS;4BACT,eAAe;4BACf,KAAK;4BACL,UAAU;wBACZ;kCAECH,gBAAgB,GAAG,CAAC,CAACiB,MAAMV,QAAAA,WAAAA,GAC1B,IAAC;gCACC,WAAW,GAAGJ,cAAc,kBAAkB,CAAC;gCAE/C,OAAO;oCACL,SAAS;oCACT,eAAe;oCACf,YAAY;oCACZ,KAAK;oCACL,WAAW;oCACX,MAAM;gCACR;0CAEA,kBAAC;oCACC,OAAO;wCACL,MAAM;wCACN,WAAW;wCACX,OAAO;wCACP,SAAS;wCACT,eAAe;oCACjB;8CAECc,KAAK,IAAI,GAAG,WAAH,GACR,IAACC,YAAUA;wCACT,MAAMD,KAAK,IAAI;wCACf,QAAQ;4CACN;gDACE,OAAO;oDACL,MAAMA,KAAK,SAAS,IAAI;oDACxB,QAAQ;gDACV;4CACF;yCACD;wCACD,UAAU;wCACV,MAAK;wCACL,OAAO;4CAAE,MAAM;4CAAG,WAAW;4CAAQ,OAAO;wCAAO;wCACnD,cAAc;wCACd,eAAa;uDAGf,IAACb,OAAKA,CAAAA;;+BArCL,GAAGa,KAAK,QAAQ,CAAC,CAAC,EAAEV,OAAO;;;;;;AA+ChD;AAEO,MAAMY,kBAOR,CAACC;IACJ,MAAM,EACJC,SAAS,EACTC,OAAO,EACPC,YAAY,EACZC,GAAG,EACHC,YAAY,EACZC,gBAAgB,EAAE,EACnB,GAAGN;IACJ,MAAM,CAACO,iBAAiBC,mBAAmB,GAAGC,SAC5C,EAAE;IAGJ,MAAM,EAAE,MAAMC,cAAc,EAAE,GAAGC,sBAC/BT,SACAK,iBACAN;IAGFW,UAAU;QACR,MAAMC,YAAYC,aAAab,WAAWC;QAC1CM,mBAAmBK;IACrB,GAAG;QAACZ;QAAWC;KAAQ;IAEvB,MAAMa,cAAcC,QAAQ;QAC1B,IAAIX,iBAAiBY,OAAO,CAACA,QAAQ,OAAO,CAAC,EAC3C,OAAOV,kBAAkB,WAAlBA,GACL,IAACW,UAAQA;YACP,KAAKd;YACL,UAAUM;YACV,UAAU;YACV,iBAAiB;YACjB,YAAY;YACZ,eAAeJ;YACf,mBAAmB;2BAGrB,IAACtB,OAAKA;YAAC,WAAW,GAAGD,cAAc,MAAM,CAAC;;QAI9C,OAAO,WAAP,GACE,IAAC;YACC,WAAW,GAAGA,cAAc,UAAU,CAAC;YACvC,OAAO;gBAAE,SAASoC,KAAK,WAAW,GAAG;YAAE;sBAEvC,kBAACC,KAAGA;gBAAC,MAAM;gBAAI,OAAO;oBAAE,WAAWD,KAAK,WAAW,GAAG;gBAAE;0BACrDlB,YAAY,WAAZA,GACC,IAACoB,YAAcA;oBACb,QAAQpB;oBACR,cAAcE;oBACd,KAAKC;mCAGP,IAACpB,OAAKA;oBAAC,WAAW,GAAGD,cAAc,MAAM,CAAC;;;;IAKpD,GAAG;QACDsB;QACAJ;QACAE;QACAO;QACAH;QACAH;QACAE;KACD;IAED,OAAO,WAAP,GAAO;kBAAGS;;AACZ"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { SDK } from "@rsdoctor/types";
|
|
3
|
-
import { Badge, Card, Drawer, Popover, Space, Typography } from "antd";
|
|
3
|
+
import { Badge, Card, Drawer, Popover, Space, Tabs, Typography } from "antd";
|
|
4
4
|
import { useState } from "react";
|
|
5
5
|
import { ServerAPIProvider } from "../../components/Manifest/index.mjs";
|
|
6
6
|
import { getShortPath } from "../../utils/index.mjs";
|
|
@@ -32,7 +32,7 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
|
|
|
32
32
|
body: {
|
|
33
33
|
moduleId: +moduleId
|
|
34
34
|
},
|
|
35
|
-
children: ({ module, dependencies })=>/*#__PURE__*/ jsx(Drawer, {
|
|
35
|
+
children: ({ module, dependencies, sideEffectCodes })=>/*#__PURE__*/ jsx(Drawer, {
|
|
36
36
|
title: /*#__PURE__*/ jsxs("div", {
|
|
37
37
|
className: "module-analyze-box",
|
|
38
38
|
children: [
|
|
@@ -56,83 +56,94 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
|
|
|
56
56
|
api: SDK.ServerAPI.API.GetAllChunkGraph,
|
|
57
57
|
body: {},
|
|
58
58
|
children: (_chunks)=>/*#__PURE__*/ jsx(ModuleGraphListContext.Consumer, {
|
|
59
|
-
children: ({ moduleJumpList, setModuleJumpList })=>/*#__PURE__*/
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
children: /*#__PURE__*/ jsx(
|
|
66
|
-
reasons: module.bailoutReason
|
|
67
|
-
})
|
|
68
|
-
}),
|
|
69
|
-
/*#__PURE__*/ jsx(Card, {
|
|
70
|
-
style: {
|
|
71
|
-
minHeight: 400
|
|
72
|
-
},
|
|
73
|
-
tabList: tabslist,
|
|
74
|
-
activeTabKey: activeTabKey,
|
|
75
|
-
tabProps: {
|
|
76
|
-
size: 'small',
|
|
77
|
-
style: {
|
|
78
|
-
fontSize: 12
|
|
79
|
-
}
|
|
80
|
-
},
|
|
81
|
-
onTabChange: (k)=>setActiveTabKey(k),
|
|
82
|
-
styles: {
|
|
83
|
-
title: {
|
|
84
|
-
paddingTop: 0
|
|
85
|
-
}
|
|
86
|
-
},
|
|
87
|
-
title: /*#__PURE__*/ jsxs(Space, {
|
|
59
|
+
children: ({ moduleJumpList, setModuleJumpList })=>/*#__PURE__*/ jsx(Tabs, {
|
|
60
|
+
defaultActiveKey: "bailout",
|
|
61
|
+
items: [
|
|
62
|
+
{
|
|
63
|
+
key: 'moduleTree',
|
|
64
|
+
label: 'Module Tree',
|
|
65
|
+
children: /*#__PURE__*/ jsx(Card, {
|
|
88
66
|
style: {
|
|
89
|
-
|
|
67
|
+
minHeight: 400
|
|
68
|
+
},
|
|
69
|
+
tabList: tabslist,
|
|
70
|
+
activeTabKey: activeTabKey,
|
|
71
|
+
tabProps: {
|
|
72
|
+
size: 'small',
|
|
73
|
+
style: {
|
|
74
|
+
fontSize: 12
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
onTabChange: (k)=>setActiveTabKey(k),
|
|
78
|
+
styles: {
|
|
79
|
+
title: {
|
|
80
|
+
paddingTop: 0
|
|
81
|
+
}
|
|
90
82
|
},
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
color: 'rgba(28, 31, 35, 0.8)'
|
|
104
|
-
},
|
|
105
|
-
children: "Current Module Imported Reasons Tree"
|
|
106
|
-
}),
|
|
107
|
-
/*#__PURE__*/ jsx(Popover, {
|
|
108
|
-
content: /*#__PURE__*/ jsx("div", {
|
|
109
|
-
children: /*#__PURE__*/ jsxs("div", {
|
|
110
|
-
children: [
|
|
111
|
-
/*#__PURE__*/ jsx(Badge, {
|
|
112
|
-
status: "success",
|
|
113
|
-
text: " "
|
|
114
|
-
}),
|
|
115
|
-
/*#__PURE__*/ jsx(RightSquareTwoTone, {}),
|
|
116
|
-
/*#__PURE__*/ jsx(Typography.Text, {
|
|
117
|
-
children: ': Jump button, click to jump to the Module dependency analysis page of this module.'
|
|
118
|
-
})
|
|
119
|
-
]
|
|
120
|
-
})
|
|
83
|
+
title: /*#__PURE__*/ jsxs(Space, {
|
|
84
|
+
style: {
|
|
85
|
+
padding: '10px 0px'
|
|
86
|
+
},
|
|
87
|
+
children: [
|
|
88
|
+
/*#__PURE__*/ jsx(LeftSquareOutlined, {
|
|
89
|
+
onClick: ()=>{
|
|
90
|
+
const _list = [
|
|
91
|
+
...moduleJumpList.slice(0, -1)
|
|
92
|
+
];
|
|
93
|
+
setModuleJumpList(_list);
|
|
94
|
+
}
|
|
121
95
|
}),
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
96
|
+
/*#__PURE__*/ jsx(Typography.Text, {
|
|
97
|
+
style: {
|
|
98
|
+
fontSize: 14,
|
|
99
|
+
color: 'rgba(28, 31, 35, 0.8)'
|
|
100
|
+
},
|
|
101
|
+
children: "Current Module Imported Reasons Tree"
|
|
102
|
+
}),
|
|
103
|
+
/*#__PURE__*/ jsx(Popover, {
|
|
104
|
+
content: /*#__PURE__*/ jsx("div", {
|
|
105
|
+
children: /*#__PURE__*/ jsxs("div", {
|
|
106
|
+
children: [
|
|
107
|
+
/*#__PURE__*/ jsx(Badge, {
|
|
108
|
+
status: "success",
|
|
109
|
+
text: " "
|
|
110
|
+
}),
|
|
111
|
+
/*#__PURE__*/ jsx(RightSquareTwoTone, {}),
|
|
112
|
+
/*#__PURE__*/ jsx(Typography.Text, {
|
|
113
|
+
children: ': Jump button, click to jump to the Module dependency analysis page of this module.'
|
|
114
|
+
})
|
|
115
|
+
]
|
|
116
|
+
})
|
|
117
|
+
}),
|
|
118
|
+
title: "Usage",
|
|
119
|
+
children: /*#__PURE__*/ jsx(QuestionCircleOutlined, {})
|
|
120
|
+
})
|
|
121
|
+
]
|
|
122
|
+
}),
|
|
123
|
+
children: /*#__PURE__*/ jsx(ModuleFilesTree, {
|
|
124
|
+
curModule: module,
|
|
125
|
+
modules: modules,
|
|
126
|
+
dependencies: dependencies,
|
|
127
|
+
cwd: cwd,
|
|
128
|
+
selectedChunk: selectedChunk,
|
|
129
|
+
activeTabKey: activeTabKey
|
|
130
|
+
})
|
|
131
|
+
})
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
key: 'bailout',
|
|
135
|
+
label: 'Bailout',
|
|
136
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
137
|
+
style: {
|
|
138
|
+
marginTop: 16
|
|
139
|
+
},
|
|
140
|
+
children: /*#__PURE__*/ jsx(BailoutReasonCard, {
|
|
141
|
+
reasons: module.bailoutReason,
|
|
142
|
+
sideEffectCodes: sideEffectCodes,
|
|
143
|
+
modulePath: module.path
|
|
144
|
+
})
|
|
134
145
|
})
|
|
135
|
-
}
|
|
146
|
+
}
|
|
136
147
|
]
|
|
137
148
|
})
|
|
138
149
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Badge, Card, Drawer, Popover, Space, Typography } from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree, BailoutReasonCard } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n LeftSquareOutlined,\n QuestionCircleOutlined,\n RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n Reasons,\n Dependencies,\n}\n\nconst tabslist = [\n {\n key: TabList[TabList.Reasons],\n label: TabList[TabList.Reasons],\n },\n {\n key: TabList[TabList.Dependencies],\n label: TabList[TabList.Dependencies],\n },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n modules: SDK.ModuleData[];\n cwd: string;\n moduleId: string | number;\n show: boolean;\n setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n const [selectedChunk, _setSelectedChunk] = useState('' as string);\n const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetModuleDetails}\n body={{ moduleId: +moduleId }}\n >\n {({ module, dependencies }) => {\n return (\n <Drawer\n title={\n <div className=\"module-analyze-box\">\n <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n <Typography.Text\n style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}\n >\n {`Current Module: ${module.path}`}\n </Typography.Text>\n </div>\n }\n open={show}\n maskClosable\n width={drawerWidth * 0.8}\n onClose={() => setShow(false)}\n >\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllChunkGraph}\n body={{}}\n >\n {(_chunks) => {\n return (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n
|
|
1
|
+
{"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Badge, Card, Drawer, Popover, Space, Tabs, Typography } from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree, BailoutReasonCard } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n LeftSquareOutlined,\n QuestionCircleOutlined,\n RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n Reasons,\n Dependencies,\n}\n\nconst tabslist = [\n {\n key: TabList[TabList.Reasons],\n label: TabList[TabList.Reasons],\n },\n {\n key: TabList[TabList.Dependencies],\n label: TabList[TabList.Dependencies],\n },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n modules: SDK.ModuleData[];\n cwd: string;\n moduleId: string | number;\n show: boolean;\n setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n const [selectedChunk, _setSelectedChunk] = useState('' as string);\n const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetModuleDetails}\n body={{ moduleId: +moduleId }}\n >\n {({ module, dependencies, sideEffectCodes }) => {\n return (\n <Drawer\n title={\n <div className=\"module-analyze-box\">\n <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n <Typography.Text\n style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}\n >\n {`Current Module: ${module.path}`}\n </Typography.Text>\n </div>\n }\n open={show}\n maskClosable\n width={drawerWidth * 0.8}\n onClose={() => setShow(false)}\n >\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllChunkGraph}\n body={{}}\n >\n {(_chunks) => {\n return (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n <Tabs\n defaultActiveKey=\"bailout\"\n items={[\n {\n key: 'moduleTree',\n label: 'Module Tree',\n children: (\n <Card\n style={{ minHeight: 400 }}\n tabList={tabslist}\n activeTabKey={activeTabKey}\n tabProps={{\n size: 'small',\n style: {\n fontSize: 12,\n },\n }}\n onTabChange={(k) => setActiveTabKey(k)}\n styles={{\n title: { paddingTop: 0 },\n }}\n title={\n <Space style={{ padding: '10px 0px' }}>\n <LeftSquareOutlined\n onClick={() => {\n const _list = [\n ...moduleJumpList.slice(0, -1),\n ];\n setModuleJumpList(_list);\n }}\n />\n <Typography.Text\n style={{\n fontSize: 14,\n color: 'rgba(28, 31, 35, 0.8)',\n }}\n >\n Current Module Imported Reasons Tree\n </Typography.Text>\n <Popover\n content={\n <div>\n <div>\n <Badge\n status=\"success\"\n text=\" \"\n />\n <RightSquareTwoTone />\n <Typography.Text>\n {\n ': Jump button, click to jump to the Module dependency analysis page of this module.'\n }\n </Typography.Text>\n </div>\n </div>\n }\n title=\"Usage\"\n >\n <QuestionCircleOutlined />\n </Popover>\n </Space>\n }\n >\n <ModuleFilesTree\n curModule={module}\n modules={modules}\n dependencies={dependencies}\n cwd={cwd}\n selectedChunk={selectedChunk}\n activeTabKey={activeTabKey}\n />\n </Card>\n ),\n },\n {\n key: 'bailout',\n label: 'Bailout',\n children: (\n <div style={{ marginTop: 16 }}>\n <BailoutReasonCard\n reasons={module.bailoutReason}\n sideEffectCodes={sideEffectCodes}\n modulePath={module.path}\n />\n </div>\n ),\n },\n ]}\n />\n );\n }}\n </ModuleGraphListContext.Consumer>\n );\n }}\n </ServerAPIProvider>\n </Drawer>\n );\n }}\n </ServerAPIProvider>\n );\n};\n"],"names":["TabList","tabslist","ModuleAnalyzeComponent","modules","cwd","moduleId","show","setShow","selectedChunk","_setSelectedChunk","useState","activeTabKey","setActiveTabKey","ServerAPIProvider","SDK","module","dependencies","sideEffectCodes","Drawer","Typography","getShortPath","drawerWidth","_chunks","ModuleGraphListContext","moduleJumpList","setModuleJumpList","Tabs","Card","k","Space","LeftSquareOutlined","_list","Popover","Badge","RightSquareTwoTone","QuestionCircleOutlined","ModuleFilesTree","BailoutReasonCard"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rsdoctor/components",
|
|
3
|
-
"version": "1.5.3
|
|
3
|
+
"version": "1.5.3",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"repository": {
|
|
@@ -39,12 +39,12 @@
|
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"@rsbuild/plugin-check-syntax": "1.6.1",
|
|
42
|
-
"@rsbuild/plugin-react": "^1.4.
|
|
43
|
-
"@rsbuild/plugin-sass": "^1.
|
|
42
|
+
"@rsbuild/plugin-react": "^1.4.5",
|
|
43
|
+
"@rsbuild/plugin-sass": "^1.5.0",
|
|
44
44
|
"@rsbuild/plugin-svgr": "^1.2.4",
|
|
45
45
|
"@types/node": "^22.8.1",
|
|
46
46
|
"@types/path-browserify": "1.0.3",
|
|
47
|
-
"@types/react": "^18.3.
|
|
47
|
+
"@types/react": "^18.3.28",
|
|
48
48
|
"@types/react-highlight-words": "^0.20.1",
|
|
49
49
|
"@types/url-parse": "1.4.11",
|
|
50
50
|
"react": "18.3.1",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"@monaco-editor/react": "4.7.0",
|
|
57
57
|
"ansi-to-react": "6.2.6",
|
|
58
58
|
"antd": "5.19.1",
|
|
59
|
-
"axios": "^1.13.
|
|
59
|
+
"axios": "^1.13.6",
|
|
60
60
|
"clsx": "^2.1.1",
|
|
61
61
|
"dayjs": "1.11.19",
|
|
62
62
|
"echarts": "^5.6.0",
|
|
@@ -74,9 +74,9 @@
|
|
|
74
74
|
"react-markdown": "^9.1.0",
|
|
75
75
|
"socket.io-client": "4.8.1",
|
|
76
76
|
"url-parse": "1.5.10",
|
|
77
|
-
"@rsdoctor/
|
|
78
|
-
"@rsdoctor/
|
|
79
|
-
"@rsdoctor/
|
|
77
|
+
"@rsdoctor/types": "1.5.3",
|
|
78
|
+
"@rsdoctor/graph": "1.5.3",
|
|
79
|
+
"@rsdoctor/utils": "1.5.3"
|
|
80
80
|
},
|
|
81
81
|
"peerDependencies": {
|
|
82
82
|
"react": ">=18.3.1",
|