admin/logs: nicer display of api requests
Massimo Melina committed
Jun 29, 2023 at 12:12 UTC
4179a4a49185e1bacf1096f15acbe49dfe61855e
3 files changed
+20
-5
admin/src/LogsPage.ts
+12
-2
@@ -2,9 +2,9 @@
2
3
import { createElement as h, Fragment, useState } from 'react';
4
import { Tab, Tabs } from '@mui/material'
5
-import { useApiList } from './api'
5
+import { API_URL, useApiList } from './api'
6
import { DataGrid } from '@mui/x-data-grid'
7
-import { formatBytes } from '@hfs/shared'
7
+import { formatBytes, tryJson } from '@hfs/shared'
8
import { logLabels } from './OptionsPage'
9
import { typedKeys } from './misc';
10
@@ -74,6 +74,16 @@ function LogFile({ file }: { file: string }) {
74
headerName: "URI",
75
flex: 2,
76
minWidth: 100,
77
+ valueFormatter: ({ value }) => {
78
+ if (!value.startsWith(API_URL))
79
+ return value
80
+ const ofs = API_URL.length
81
+ const i = value.indexOf('?', ofs)
82
+ const name = value.slice(ofs, i > 0 ? i : Infinity)
83
+ const params = i < 0 ? ''
84
+ : Array.from(new URLSearchParams(value.slice(i))).map(x => `${x[0]}=${tryJson(x[1]) ?? x[1]}`).join(' ; ')
85
+ return `API ${name} ${params}`
86
+ }
87
},
88
]
89
})
shared/api.ts
+3
-3
@@ -4,7 +4,7 @@ import _ from 'lodash';
4
import { useCallback, useEffect, useRef } from 'react';
5
import { Dict, Falsy, getCookie, getPrefixUrl, pendingPromise, useStateMounted } from '.'
6
7
-const PREFIX = getPrefixUrl() + '/~/api/'
7
+export const API_URL = getPrefixUrl() + '/~/api/'
8
9
const timeoutByApi: Dict = {
10
loginSrp1: 90, // support antibrute
@@ -31,7 +31,7 @@ export function apiCall<T=any>(cmd: string, params?: Dict, options: ApiCallOptio
31
const controller = new AbortController()
32
if (options.timeout !== false)
33
setTimeout(() => controller.abort('timeout'), 1000*(timeoutByApi[cmd] ?? options.timeout ?? 10))
34
- return Object.assign(fetch(PREFIX + cmd, {
34
+ return Object.assign(fetch(API_URL + cmd, {
35
method: 'POST',
36
headers: { 'content-type': 'application/json' },
37
signal: controller.signal,
@@ -111,7 +111,7 @@ export function apiEvents(cmd: string, params: Dict, cb:EventHandler) {
111
const csrf = getCsrf()
112
if (csrf)
113
processed.csrf = JSON.stringify(csrf)
114
- const source = new EventSource(PREFIX + cmd + '?' + new URLSearchParams(processed))
114
+ const source = new EventSource(API_URL + cmd + '?' + new URLSearchParams(processed))
115
source.onopen = () => cb('connected')
116
source.onerror = err => cb('error', err)
117
source.onmessage = ({ data }) => {
shared/index.ts
+5
@@ -203,3 +203,8 @@ export function makeSessionRefresher(state: any) {
203
setTimeout(() => apiCall('refresh_session').then(sessionRefresher), t)
204
}
205
}
206
+
207
+export function tryJson(s?: string) {
208
+ try { return s && JSON.parse(s) }
209
+ catch {}
210
+}