pgadmin4/web/pgadmin/tools/debugger/static/js/components/Results.jsx

63 lines
1.7 KiB
JavaScript

/////////////////////////////////////////////////////////////
//
// pgAdmin 4 - PostgreSQL Tools
//
// Copyright (C) 2013 - 2025, The pgAdmin Development Team
// This software is released under the PostgreSQL Licence
//
//////////////////////////////////////////////////////////////
import _ from 'lodash';
import { styled } from '@mui/material/styles';
import React, { useState } from 'react';
import Paper from '@mui/material/Paper';
import { DebuggerEventsContext } from './DebuggerComponent';
import { DEBUGGER_EVENTS } from '../DebuggerConstants';
import Table from '../../../../../static/js/components/Table';
const StyledPaper = styled(Paper)(() => ({
flexGrow: 1,
minHeight: 0,
overflow: 'auto',
}));
export function Results() {
const eventBus = React.useContext(DebuggerEventsContext);
const [resultData, setResultData] = useState([]);
const [columns, setColumns] = useState([]);
React.useEffect(() => {
eventBus.registerListener(DEBUGGER_EVENTS.SET_RESULTS, (columnsData, values) => {
setResultData(values);
setColumns(columnsData);
});
}, []);
return (
<StyledPaper variant="outlined" elevation={0}>
<Table>
<thead>
<tr key={_.uniqueId('c')}>
{
columns.map((col) => (
<th key={col.name}>{col.name}</th>
))
}
</tr>
</thead>
<tbody>
{resultData.map((row) => (
<tr key={_.uniqueId('c')}>
{
columns.map((col) => (
<td key={_.uniqueId('c')}>{row[col.name]}</td>
))
}
</tr>
))}
</tbody>
</Table>
</StyledPaper>
);
}