Files
Alaister YoungandKevin Grüneberg 70da0f1d1d chore: cleanup packages (#27770)
* chore: cleanup packages

- Avoid circular imports
- Export API-types as types
- pg-format without depending on Node internal Buffer (not browser-compatible)
- Avoid importing from barrel files in ui dir

* chore: avoid barrel file imports in studio (#27771)

* chore: avoid barrel file imports

- Removes some unused imports
- Avoids barrel file import for faster builds + less memory

* add eslint rule

* type fixes

* delete layouts barrel

* delete components/grid barrel file

* delete components/grid/utils barrel file

* delete components/grid/components/common barrel file

* delete components/grid/components/editor barrel file

* delete components/grid/components/formatter barrel file

* delete components/grid/components/grid barrel file

* delete components/grid/components/header/filter barrel file

* remote components/grid/store barrel file

* remove components/interfaces/Auth/Policies barrel file

* delete components/interfaces/Settings/Logs barrel file

* delete components/ui/CodeEditor barrel file

* delete components/ui/Forms barrel file

* delete components/ui/Shimmers barrel file

* delete data/analytics barrel file

* delete hooks barrel file

* cleanup lib/common/fetch barrel file

* final * barral files cleanup

* global react-data-grid styles

* remove console.log

---------

Co-authored-by: Kevin Grüneberg <k.grueneberg1994@gmail.com>

* fix build

---------

Co-authored-by: Kevin Grüneberg <k.grueneberg1994@gmail.com>
2024-07-04 14:48:10 +08:00

68 lines
2.6 KiB
TypeScript

import { filterFunctionsRequestResponse } from 'lib/logs'
import { LOGS_TAILWIND_CLASSES } from '../Logs.constants'
import type { PreviewLogData } from '../Logs.types'
import {
jsonSyntaxHighlight,
ResponseCodeFormatter,
SelectionDetailedRow,
SelectionDetailedTimestampRow,
} from '../LogsFormatters'
const FunctionInvocationSelectionRender = ({ log }: { log: PreviewLogData }) => {
const metadata = log.metadata?.[0]
const request = metadata?.request?.[0]
const response = metadata?.response?.[0]
const method = request?.method
const status = response?.status_code
const requestUrl = request?.url !== undefined ? new URL(request?.url) : undefined
const executionTimeMs = metadata.execution_time_ms
const deploymentId = metadata.deployment_id
return (
<>
<div className={`${LOGS_TAILWIND_CLASSES.log_selection_x_padding} space-y-2`}>
<SelectionDetailedRow
label="Status"
value={status}
valueRender={<ResponseCodeFormatter value={status} />}
/>
<SelectionDetailedRow label="Method" value={method} />
<SelectionDetailedTimestampRow value={log.timestamp} />
<SelectionDetailedRow label="Execution Time" value={`${executionTimeMs}ms`} />
<SelectionDetailedRow label="Execution ID" value={metadata.execution_id} />
<SelectionDetailedRow label="Deployment ID" value={deploymentId} />
<SelectionDetailedRow label="Log ID" value={log.id} />
{requestUrl !== undefined && (
<SelectionDetailedRow
label="Request Path"
value={requestUrl.pathname + requestUrl.search}
/>
)}
</div>
<div className={`${LOGS_TAILWIND_CLASSES.log_selection_x_padding}`}>
<h3 className="text-lg text-foreground mb-4">Request Metadata</h3>
<pre className="text-sm syntax-highlight overflow-x-auto">
<div
className="text-wrap"
dangerouslySetInnerHTML={{
__html: request ? jsonSyntaxHighlight(filterFunctionsRequestResponse(request)) : '',
}}
/>
</pre>
</div>
<div className={`${LOGS_TAILWIND_CLASSES.log_selection_x_padding}`}>
<h3 className="text-lg text-foreground mb-4">Response Metadata</h3>
<pre className="text-sm syntax-highlight overflow-x-auto">
<div
dangerouslySetInnerHTML={{
__html: response ? jsonSyntaxHighlight(filterFunctionsRequestResponse(response)) : '',
}}
/>
</pre>
</div>
</>
)
}
export default FunctionInvocationSelectionRender