Line data    Source code

       1              : import * as React from 'react';
       2              : import * as styles from './query_result_view.module.css';
       3              : 
       4              : import { QueryExecutionState } from '../../query/query_execution_state.js';
       5              : import { DataTable } from './data_table.js';
       6              : import { TableColumnHeader } from './data_table_cell.js';
       7              : import { useComputationRegistry } from '../../compute/computation_registry.js';
       8              : import { classNames } from '../../utils/classnames.js';
       9              : 
      10              : interface Props {
      11              :     query: QueryExecutionState | null;
      12              :     debugMode: boolean;
      13              :     maxRows?: number;
      14              :     columnHeader?: TableColumnHeader;
      15              :     cellBackground?: string;
      16              :     onShowTable?: () => void;
      17              :     fitHeight?: boolean;
      18              :     fillHeight?: boolean;
      19              :     maxHeight?: number;
      20              :     compact?: boolean;
      21              : }
      22              : 
      23            1 : export function QueryResultView(props: Props) {
      24            1 :     const [computationState, computationDispatch] = useComputationRegistry();
      25              : 
      26              :     // Query is null?
      27            1 :     if (props.query == null) {
      28            0 :         return <div />;
      29              :     }
      30              :     // Resolve the table computation
      31            1 :     const tableComputation = computationState.tableComputations[props.query.queryId] ?? null;
      32            1 :     if (tableComputation == null) {
      33            0 :         return <div />;
      34              :     }
      35              :     // Toggle data info
      36            1 :     return (
      37            1 :         <div className={classNames(styles.root, { [styles.root_fit_height]: props.fitHeight })}>
      38            1 :             <DataTable
      39            1 :                 className={styles.data_table}
      40            1 :                 table={tableComputation}
      41            1 :                 dispatchComputation={computationDispatch}
      42            1 :                 debugMode={props.debugMode}
      43            1 :                 maxRows={props.maxRows}
      44            1 :                 columnHeader={props.columnHeader}
      45            1 :                 cellBackground={props.cellBackground}
      46            1 :                 onShowTable={props.onShowTable}
      47            1 :                 fitHeight={props.fitHeight}
      48            1 :                 fillHeight={props.fillHeight}
      49            1 :                 maxHeight={props.maxHeight}
      50            1 :                 compact={props.compact}
      51            1 :             />
      52            1 :         </div>
      53              :     );
      54            1 : }