Skip to content

Commit

Permalink
Merge pull request yaklang#247 from yaklang/nonight/perf/risk-and-his…
Browse files Browse the repository at this point in the history
…tory

perf: history页滚动功能优化;漏洞与风险页条件排序
  • Loading branch information
VillanCh authored May 7, 2022
2 parents 78b072a + 566239c commit 5a431c5
Show file tree
Hide file tree
Showing 3 changed files with 56 additions and 29 deletions.
64 changes: 38 additions & 26 deletions app/renderer/src/main/src/components/HTTPFlowTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -513,12 +513,12 @@ const HeaderTable: HTTPFlow = {
Path: "",
Hash: "",
IsHTTPS: false,
Url: "...",
Url: "",
Request: new Uint8Array(),
Response: new Uint8Array(),
StatusCode: 0,
BodyLength: 0,
ContentType: "",
BodyLength: -1,
ContentType: "null",
SourceType: "",
RequestHeader: [],
ResponseHeader: [],
Expand Down Expand Up @@ -556,6 +556,7 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {

const tableRef = useRef(null)
const counter = useRef<number>(0)
const tableTimer = useRef<any>(null)

const ref = useHotkeys('ctrl+r', e => {
const selected = getSelected()
Expand Down Expand Up @@ -628,7 +629,7 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
if (!tableRef || !tableRef.current) return
const table = tableRef.current as unknown as HTMLDivElement
// @ts-ignore
table.scrollTop(20)
table.scrollTop(34)
}, 50)
})
.catch((e: any) => {
Expand All @@ -654,21 +655,21 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
Pagination: {...paginationProps}
})
.then((rsp: YakQueryHTTPFlowResponse) => {
setData(page === 1 ? [HeaderTable].concat(rsp?.Data || []) : [HeaderTable].concat(data.concat(rsp?.Data || [])))
setData(page === 1 ? [HeaderTable].concat(rsp?.Data || []) : data.concat(rsp?.Data || []))
setPagination(rsp.Pagination)
setTotal(rsp.Total)
setTimeout(() => {
if (!tableRef || !tableRef.current) return
const table = tableRef.current as unknown as HTMLDivElement
// @ts-ignore
table.scrollTop(page === 1 ? 20 : (page - 1) * 4100)
table.scrollTop(page === 1 ? 34 : (page - 1) * 4100)
}, 50)
})
.catch((e: any) => {
failed(`query HTTP Flow failed: ${e}`)
})
.finally(() => {
setLoading(false)
setTimeout(() => setLoading(false), 300);
})
})

Expand Down Expand Up @@ -951,7 +952,7 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
cellRender: ({rowData, dataKey, ...props}: any) => {
return (
<div style={{color: StatusCodeToColor(rowData[dataKey])}}>
{rowData[dataKey] === 0 ? "..." : rowData[dataKey]}
{rowData[dataKey] === 0 ? "" : rowData[dataKey]}
</div>
)
}
Expand Down Expand Up @@ -1091,11 +1092,15 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
return (
<div style={{width: 100}}>
{/* 1M 以上的话,是红色*/}
<div style={{color: rowData.BodyLength > 1000000 ? "red" : undefined}}>
{rowData.BodySizeVerbose
? rowData.BodySizeVerbose
: rowData.BodyLength}
</div>
{rowData.BodyLength !== -1 ?
(<div style={{color: rowData.BodyLength > 1000000 ? "red" : undefined}}>
{rowData.BodySizeVerbose
? rowData.BodySizeVerbose
: rowData.BodyLength}
</div>)
:
(<div></div>)
}
</div>
)
}
Expand Down Expand Up @@ -1178,7 +1183,7 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
}
return (
<div>
{contentTypeFixed}
{contentTypeFixed === "null" ? "" : contentTypeFixed}
</div>
)
}
Expand All @@ -1192,9 +1197,9 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
},
cellRender: ({rowData, dataKey, ...props}: any) => {
return <Tooltip
title={formatTimestamp(rowData[dataKey])}
title={rowData[dataKey] === 0 ? "" : formatTimestamp(rowData[dataKey])}
>
{formatTime(rowData[dataKey])}
{rowData[dataKey] === 0 ? "" : formatTime(rowData[dataKey])}
</Tooltip>
}
},
Expand All @@ -1203,6 +1208,7 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
width: 90,
headRender: () => "操作",
cellRender: ({rowData}: any) => {
if(!rowData.Hash) return <></>
return (
<a
onClick={(e) => {
Expand Down Expand Up @@ -1405,18 +1411,24 @@ export const HTTPFlowTable: React.FC<HTTPFlowTableProp> = (props) => {
// 防止无数据触发加载
if(data.length === 0) return
// 防止初始加载的触发
if(top === counter.current) return
if(top !== 0 && top === counter.current) return
counter.current = top
if(top === 0) {
scrollUpdate(1)
setAutoReload(false)
}
// 防止最后一页还进行向下加载
if (parseInt(pagination.Page.toString()) === maxPage) return
if (contextHeight - top - tableContentHeight < 0) {
scrollUpdate(parseInt(pagination.Page.toString()) + 1)
setAutoReload(false)
if(tableTimer.current){
clearTimeout(tableTimer.current)
tableTimer.current = null
}
tableTimer.current = setTimeout(() => {
if(top === 0) {
scrollUpdate(1)
setAutoReload(false)
}
// 防止最后一页还进行向下加载
if (parseInt(pagination.Page.toString()) === maxPage) return
if (contextHeight - top - tableContentHeight < 0) {
scrollUpdate(parseInt(pagination.Page.toString()) + 1)
setAutoReload(false)
}
}, 300);
}}
/>
</div>
Expand Down
1 change: 1 addition & 0 deletions app/renderer/src/main/src/components/PluginList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -216,6 +216,7 @@ export const PluginList: React.FC<PluginListProp> = React.memo((props) => {
/>
<div ref={containerRef as any} style={{height: vlistHeigth, overflow: "auto"}}>
<div ref={wrapperRef as any}>{list.map((i) => <YakScriptCheckbox
key={i.data.ScriptName}
info={i.data} selectScript={selectScript} unSelectScript={unSelectScript}
vlistWidth={vlistWidth} selected={selected} disabled={disabled}
/>)}</div>
Expand Down
20 changes: 17 additions & 3 deletions app/renderer/src/main/src/pages/risks/RiskTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -101,10 +101,24 @@ export const RiskTable: React.FC<RiskTableProp> = (props) => {

const updateRiskAndLevel = useMemoizedFn(() => {
ipcRenderer.invoke("QueryAvailableRiskType", {}).then((f: Fields) => {
setTypes(mergeFieldNames(f).sort((a,b)=>a.Total - b.Total))
setTypes(mergeFieldNames(f).sort((a,b) => {
const diff = a.Total - b.Total
if(diff === 0){
return a.Verbose.localeCompare(b.Verbose)
}else{
return diff
}
}))
})
ipcRenderer.invoke("QueryAvailableRiskLevel", {}).then((i: Fields) => {
setSeverities(mergeFieldNames(i).sort((a,b)=>a.Total - b.Total))
setSeverities(mergeFieldNames(i).sort((a,b) => {
const diff = a.Total - b.Total
if(diff === 0){
return a.Verbose.localeCompare(b.Verbose)
}else{
return diff
}
}))
})
})

Expand Down Expand Up @@ -187,7 +201,7 @@ export const RiskTable: React.FC<RiskTableProp> = (props) => {
item.Names = item.Names || []
return item
})
const severitykind = severities.map((item: any) => {
const severitykind = severities.map((item) => {
item.Names = item.Names || []
return item
})
Expand Down

0 comments on commit 5a431c5

Please sign in to comment.