jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat ui: filter by method in network panel

Browse source
This commit is contained in:
nick-delirium 2024-06-25 12:59:10 +02:00
parent 6a42d96e21
commit a71bafc17a
No known key found for this signature in database
GPG key ID: 93ABD695DF5FDBA0
1 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
frontend/app/components/shared/DevTools/NetworkPanel/NetworkPanel.tsx
View file

@ -373,7 +373,7 @@ const NetworkPanelComp = observer(
}, [showOnlyErrors, list]); }, [showOnlyErrors, list]);
filteredList = useRegExListFilterMemo( filteredList = useRegExListFilterMemo(
filteredList, filteredList,
(it) => [it.status, it.name, it.type], (it) => [it.status, it.name, it.type, it.method],
filter filter
); );
filteredList = useTabListFilterMemo(filteredList, (it) => TYPE_TO_TAB[it.type], ALL, activeTab); filteredList = useTabListFilterMemo(filteredList, (it) => TYPE_TO_TAB[it.type], ALL, activeTab);
@ -484,12 +484,12 @@ const NetworkPanelComp = observer(
</div> </div>
<Input <Input
className="input-small" className="input-small"
placeholder="Filter by name, type or value" placeholder="Filter by name, type, method or value"
icon="search" icon="search"
name="filter" name="filter"
onChange={onFilterChange} onChange={onFilterChange}
height={28} height={28}
width={230} width={240}
value={filter} value={filter}
/> />
</BottomBlock.Header> </BottomBlock.Header>
@ -498,7 +498,7 @@ const NetworkPanelComp = observer(
<div> <div>
<Toggler <Toggler
checked={showOnlyErrors} checked={showOnlyErrors}
name="test" name="show-errors-only"
onChange={() => setShowOnlyErrors(!showOnlyErrors)} onChange={() => setShowOnlyErrors(!showOnlyErrors)}
label="4xx-5xx Only" label="4xx-5xx Only"
/> />
@ -577,6 +577,11 @@ const NetworkPanelComp = observer(
width: 90, width: 90,
render: renderType, render: renderType,
}, },
{
label: 'Method',
width: 80,
dataKey: 'method',
},
{ {
label: 'Name', label: 'Name',
width: 240, width: 240,