codekingpro/portable-devtools

1import React, { useEffect, useState } from 'react';2import { usePgAdmin } from '../BrowserComponent';3import { Box } from '@mui/material';4import { QueryToolIcon, RowFilterIcon, TerminalIcon, ViewDataIcon } from '../components/ExternalIcon';5import SearchOutlinedIcon from '@mui/icons-material/SearchOutlined';6import { PgButtonGroup, PgIconButton } from '../components/Buttons';7import _ from 'lodash';8import PropTypes from 'prop-types';9import CustomPropTypes from '../custom_prop_types';10 11 12function ToolbarButton({menuItem, icon, ...props}) {13  return (14    <PgIconButton title={menuItem?.label??''} icon={icon} {...props} size="xs"15      disabled={menuItem?.isDisabled??true} onClick={()=>menuItem?.callback()} />16  );17}18ToolbarButton.propTypes = {19  menuItem: PropTypes.object,20  icon: CustomPropTypes.children,21};22 23export default function ObjectExplorerToolbar() {24  const [menus, setMenus] = useState({25    'query_tool': undefined,26    'view_all_rows_context': undefined,27    'view_filtered_rows_context': undefined,28    'search_objects': undefined,29    'psql': undefined,30  });31  const pgAdmin = usePgAdmin();32  const checkMenuState = ()=>{33    const viewMenus = pgAdmin.Browser.MainMenus.34      find((m)=>(m.name=='object'))?.35      menuItems?.36      find((m)=>(m.name=='view_data'))?.37      menu_items;38 39    const toolsMenus = pgAdmin.Browser.MainMenus.40      find((m)=>(m.name=='tools'))?.41      menuItems;42 43    setMenus({44      'query_tool': toolsMenus?.find((m)=>(m.name=='query_tool')),45      'view_all_rows_context': viewMenus?.find((m)=>(m.name=='view_all_rows_context_' + m.node)),46      'view_filtered_rows_context': viewMenus?.find((m)=>(m.name=='view_filtered_rows_context_' + m.node)),47      'search_objects': toolsMenus?.find((m)=>(m.name=='search_objects')),48      'psql': toolsMenus?.find((m)=>(m.name=='psql'))49    });50  };51 52  useEffect(()=>{53    const deregister = pgAdmin.Browser.Events.on('pgadmin:nw-enable-disable-menu-items', _.debounce(checkMenuState, 100));54    checkMenuState();55    return ()=>{56      deregister();57    };58  }, []);59 60  return (61    <Box display="flex" alignItems="center" gap="2px">62      <PgButtonGroup size="small">63        <ToolbarButton icon={<QueryToolIcon />} menuItem={menus['query_tool']} />64        <ToolbarButton icon={<ViewDataIcon />} menuItem={menus['view_all_rows_context']} />65        <ToolbarButton icon={<RowFilterIcon />} menuItem={menus['view_filtered_rows_context']} />66        <ToolbarButton icon={<SearchOutlinedIcon style={{height: '1.4rem'}} />} menuItem={menus['search_objects']} />67        {!_.isUndefined(menus['psql']) && <ToolbarButton icon={<TerminalIcon />} menuItem={menus['psql']} />}68      </PgButtonGroup>69    </Box>70  );71}72