{"version":3,"file":"pages/TreeShaking/index.mjs","sources":["../../../src/pages/TreeShaking/index.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { Card, Col, Row, Radio } from 'antd';\nimport { Lodash } from '@rsdoctor/utils/common';\nimport { FileSearchOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport path from 'path-browserify';\nimport {\n  ConnectManifestData,\n  ServerAPIProvider,\n} from 'src/components/Manifest';\nimport { Size } from '../../constants';\nimport { FileTree } from '../../components/FileTree';\nimport { KeywordInput } from '../../components/Form/keyword';\nimport { getTreeFilesDefaultExpandedKeys, useFileStructures } from './utils';\nimport {\n  fetchManifest,\n  useModuleGraphInstanceByModuleGraph,\n} from '../../utils';\nimport { CodeEditor } from './editor';\nimport { Space } from './space';\nimport { TreeShakingTable } from './table';\nimport type { TableKind, SetEditorStatus } from './types';\n\nimport './index.sass';\nexport * from './constants';\n\nconst Component: React.FC<{ data: SDK.ModuleGraphData; cwd: string }> = ({\n  data,\n  cwd,\n}) => {\n  const moduleGraph = useModuleGraphInstanceByModuleGraph(data);\n\n  if (moduleGraph.size() === 0) {\n    return <Space />;\n  }\n\n  const [searchInput, setSearchInput] = useState('');\n  const [toLine, setToLine] = useState(1);\n  const [ranges, setRanges] = useState<SDK.SourceRange[]>([]);\n  const [tableKind, setTableKind] = useState<TableKind>('side-effect');\n  const filteredModules = useMemo(\n    () =>\n      moduleGraph\n        .getModules()\n        .filter(\n          (item) =>\n            item.kind === SDK.ModuleKind.Normal &&\n            path.basename(item.path).includes(searchInput),\n        ),\n    [searchInput],\n  );\n\n  const entry = useMemo(\n    () => filteredModules.find((item) => item.isEntry)!,\n    [],\n  );\n  const [selectedModule, setSelectedModule] = useState(\n    entry || (filteredModules?.length && filteredModules?.[0]),\n  );\n  const files = useFileStructures(\n    filteredModules,\n    moduleGraph,\n    searchInput,\n    selectedModule,\n    (file) => {\n      setEditorData(filteredModules.find((item) => item.path === file)!, []);\n    },\n    cwd,\n  );\n  const setEditorData: SetEditorStatus = (module, ranges, line) => {\n    setSelectedModule(module);\n    setRanges(ranges.slice());\n\n    if (Lodash.isNumber(line)) {\n      setToLine(line);\n    }\n  };\n\n  return (\n    <Card\n      title=\"Tree Shaking Analysis\"\n      bodyStyle={{ paddingTop: 0 }}\n      className=\"tree-shaking-page\"\n    >\n      <Row\n        justify=\"space-between\"\n        align=\"middle\"\n        style={{ marginBottom: Size.BasePadding, marginTop: Size.BasePadding }}\n      >\n        <KeywordInput\n          icon={<FileSearchOutlined />}\n          width={400}\n          label=\"FileName\"\n          placeholder=\"search filename by keyword\"\n          style={{ width: 'auto' }}\n          onChange={(e) => setSearchInput(e)}\n        />\n        <Radio.Group\n          value={tableKind}\n          onChange={({ target }) => setTableKind(target.value)}\n        >\n          <Radio.Button value=\"side-effect\">SideEffects</Radio.Button>\n          <Radio.Button value=\"export\">Export Variables</Radio.Button>\n        </Radio.Group>\n      </Row>\n      <Row\n        justify=\"space-between\"\n        align=\"top\"\n        wrap={false}\n        gutter={[Size.BasePadding, Size.BasePadding]}\n      >\n        <Col span={7}>\n          <Card\n            title={`Total Files: ${filteredModules.length}`}\n            className=\"tree-shaking-files-box\"\n          >\n            <FileTree\n              style={{ height: '80%' }}\n              className=\"tree-shaking-files\"\n              selectedKeys={selectedModule ? [selectedModule.path] : []}\n              defaultExpandedKeys={getTreeFilesDefaultExpandedKeys(files)}\n              treeData={files}\n              expandAction=\"click\"\n            />\n          </Card>\n        </Col>\n        <Col span={9}>\n          <ServerAPIProvider\n            api={SDK.ServerAPI.API.GetModuleCodeByModuleId}\n            body={{ moduleId: selectedModule.id }}\n          >\n            {(source) => {\n              return (\n                <CodeEditor\n                  module={selectedModule}\n                  moduleGraph={moduleGraph}\n                  ranges={ranges}\n                  toLine={toLine}\n                  setEditorData={setEditorData}\n                  source={source}\n                />\n              );\n            }}\n          </ServerAPIProvider>\n        </Col>\n        <Col flex={1}>\n          <TreeShakingTable\n            kind={tableKind}\n            setEditorData={setEditorData}\n            module={selectedModule}\n            moduleGraph={moduleGraph}\n          />\n        </Col>\n      </Row>\n    </Card>\n  );\n};\n\nexport const TreeShakingPage = ConnectManifestData(\n  fetchManifest,\n  [\n    ['moduleGraph', 'data'],\n    ['root', 'cwd'],\n  ],\n  Component,\n);\n"],"names":["Component","data","cwd","moduleGraph","useModuleGraphInstanceByModuleGraph","Space","searchInput","setSearchInput","useState","toLine","setToLine","ranges","setRanges","tableKind","setTableKind","filteredModules","useMemo","item","SDK","path","entry","selectedModule","setSelectedModule","files","useFileStructures","file","setEditorData","module","line","Lodash","Card","Row","Size","KeywordInput","FileSearchOutlined","e","Radio","target","Col","FileTree","getTreeFilesDefaultExpandedKeys","ServerAPIProvider","source","CodeEditor","TreeShakingTable","TreeShakingPage","ConnectManifestData","fetchManifest"],"mappings":";;;;;;;;;;;;;;;;;;AA0BA,MAAMA,YAAkE,CAAC,EACvEC,IAAI,EACJC,GAAG,EACJ;IACC,MAAMC,cAAcC,oCAAoCH;IAExD,IAAIE,AAAuB,MAAvBA,YAAY,IAAI,IAClB,OAAO,WAAP,GAAO,IAACE,OAAKA,CAAAA;IAGf,MAAM,CAACC,aAAaC,eAAe,GAAGC,SAAS;IAC/C,MAAM,CAACC,QAAQC,UAAU,GAAGF,SAAS;IACrC,MAAM,CAACG,QAAQC,UAAU,GAAGJ,SAA4B,EAAE;IAC1D,MAAM,CAACK,WAAWC,aAAa,GAAGN,SAAoB;IACtD,MAAMO,kBAAkBC,QACtB,IACEb,YACG,UAAU,GACV,MAAM,CACL,CAACc,OACCA,KAAK,IAAI,KAAKC,IAAI,UAAU,CAAC,MAAM,IACnCC,gBAAAA,QAAa,CAACF,KAAK,IAAI,EAAE,QAAQ,CAACX,eAE1C;QAACA;KAAY;IAGf,MAAMc,QAAQJ,QACZ,IAAMD,gBAAgB,IAAI,CAAC,CAACE,OAASA,KAAK,OAAO,GACjD,EAAE;IAEJ,MAAM,CAACI,gBAAgBC,kBAAkB,GAAGd,SAC1CY,SAAUL,iBAAiB,UAAUA,iBAAiB,CAAC,EAAE;IAE3D,MAAMQ,QAAQC,kBACZT,iBACAZ,aACAG,aACAe,gBACA,CAACI;QACCC,cAAcX,gBAAgB,IAAI,CAAC,CAACE,OAASA,KAAK,IAAI,KAAKQ,OAAQ,EAAE;IACvE,GACAvB;IAEF,MAAMwB,gBAAiC,CAACC,QAAQhB,QAAQiB;QACtDN,kBAAkBK;QAClBf,UAAUD,OAAO,KAAK;QAEtB,IAAIkB,OAAO,QAAQ,CAACD,OAClBlB,UAAUkB;IAEd;IAEA,OAAO,WAAP,GACE,KAACE,MAAIA;QACH,OAAM;QACN,WAAW;YAAE,YAAY;QAAE;QAC3B,WAAU;;0BAEV,KAACC,KAAGA;gBACF,SAAQ;gBACR,OAAM;gBACN,OAAO;oBAAE,cAAcC,KAAK,WAAW;oBAAE,WAAWA,KAAK,WAAW;gBAAC;;kCAErE,IAACC,cAAYA;wBACX,oBAAM,IAACC,oBAAkBA,CAAAA;wBACzB,OAAO;wBACP,OAAM;wBACN,aAAY;wBACZ,OAAO;4BAAE,OAAO;wBAAO;wBACvB,UAAU,CAACC,IAAM5B,eAAe4B;;kCAElC,KAACC,MAAM,KAAK;wBACV,OAAOvB;wBACP,UAAU,CAAC,EAAEwB,MAAM,EAAE,GAAKvB,aAAauB,OAAO,KAAK;;0CAEnD,IAACD,MAAM,MAAM;gCAAC,OAAM;0CAAc;;0CAClC,IAACA,MAAM,MAAM;gCAAC,OAAM;0CAAS;;;;;;0BAGjC,KAACL,KAAGA;gBACF,SAAQ;gBACR,OAAM;gBACN,MAAM;gBACN,QAAQ;oBAACC,KAAK,WAAW;oBAAEA,KAAK,WAAW;iBAAC;;kCAE5C,IAACM,KAAGA;wBAAC,MAAM;kCACT,kBAACR,MAAIA;4BACH,OAAO,CAAC,aAAa,EAAEf,gBAAgB,MAAM,EAAE;4BAC/C,WAAU;sCAEV,kBAACwB,UAAQA;gCACP,OAAO;oCAAE,QAAQ;gCAAM;gCACvB,WAAU;gCACV,cAAclB,iBAAiB;oCAACA,eAAe,IAAI;iCAAC,GAAG,EAAE;gCACzD,qBAAqBmB,gCAAgCjB;gCACrD,UAAUA;gCACV,cAAa;;;;kCAInB,IAACe,KAAGA;wBAAC,MAAM;kCACT,kBAACG,mBAAiBA;4BAChB,KAAKvB,IAAI,SAAS,CAAC,GAAG,CAAC,uBAAuB;4BAC9C,MAAM;gCAAE,UAAUG,eAAe,EAAE;4BAAC;sCAEnC,CAACqB,SACO,WAAP,GACE,IAACC,YAAUA;oCACT,QAAQtB;oCACR,aAAalB;oCACb,QAAQQ;oCACR,QAAQF;oCACR,eAAeiB;oCACf,QAAQgB;;;;kCAMlB,IAACJ,KAAGA;wBAAC,MAAM;kCACT,kBAACM,kBAAgBA;4BACf,MAAM/B;4BACN,eAAea;4BACf,QAAQL;4BACR,aAAalB;;;;;;;AAMzB;AAEO,MAAM0C,kBAAkBC,oBAC7BC,eACA;IACE;QAAC;QAAe;KAAO;IACvB;QAAC;QAAQ;KAAM;CAChB,EACD/C"}