subprojects/frontend/src/editor/SearchPanelPortal.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

import Portal from '@mui/material/Portal';
import { observer } from 'mobx-react-lite';
import React from 'react';

import type EditorStore from './EditorStore';
import SearchToolbar from './SearchToolbar';

function SearchPanelPortal({
  editorStore: { searchPanel: searchPanelStore },
}: {
  editorStore: EditorStore;
}): JSX.Element | null {
  const { element: searchPanelContainer } = searchPanelStore;

  if (searchPanelContainer === undefined) {
    return null;
  }
  return (
    <Portal container={searchPanelContainer}>
      <SearchToolbar searchPanelStore={searchPanelStore} />
    </Portal>
  );
}

export default observer(SearchPanelPortal);