Fix compilation

packages/editor/src/classes/default-widget-manager/index.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useRef, useState } from 'react';
 import {
   WidgetManager,
   Topic,
@@ -7,7 +7,7 @@ import {
   NoteModel,
   NoteIcon,
 } from '@wisemapping/mindplot';
-import { linkContent, noteContent } from '../../components/menu/contents';
+import { linkContent, noteContent } from '../../components/toolbar/contents';
 
 export class DefaultWidgetManager extends WidgetManager {
   private editorOpen: boolean;
@@ -63,6 +63,14 @@ export class DefaultWidgetManager extends WidgetManager {
     this.setPopoverOpen(true);
     topic.closeEditors();
   }
+
+  static create(): [boolean, Element | undefined, DefaultWidgetManager] {
+    const [popoverOpen, setPopoverOpen] = useState(false);
+    const [popoverTarget, setPopoverTarget] = useState(undefined);
+    const widgetManager = useRef(new DefaultWidgetManager(setPopoverOpen, setPopoverTarget));
+
+    return [popoverOpen, popoverTarget, widgetManager.current];
+  }
 }
 
 export default DefaultWidgetManager;

packages/editor/src/components/header/index.tsx

@@ -1,34 +0,0 @@
-import React from 'react';
-import ActionConfig from '../../classes/action-config';
-import MaterialToolbar from '@mui/material/Toolbar';
-import AppBar from '@mui/material/AppBar';
-import { ToolbarMenuItem } from '../toolbar/Toolbar';
-
-/**
- * App bar
- * @param props.configurations the configurations array
- * @returns toolbar wich contains an entry for each configuration in the array
- */
-const Header = (props: { configurations: ActionConfig[] }) => {
-  return (
-    <AppBar
-      role="menubar"
-      position="absolute"
-      color="default"
-      className="material-menubar"
-      sx={{
-        '& MuiButtonBase-root': {
-          marginX: '1rem',
-        },
-      }}
-    >
-      <MaterialToolbar>
-        {props.configurations.map((c, i) => {
-          return <ToolbarMenuItem key={i} configuration={c} />;
-        })}
-      </MaterialToolbar>
-    </AppBar>
-  );
-};
-
-export default Header;

packages/editor/src/components/menu/contents.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-import { NoteForm, UrlForm } from '../toolbar/toolbarCustomComponents';
-
-function linkContent(linkModel, closeModal): React.ReactElement {
-  return <UrlForm closeModal={closeModal} urlModel={linkModel}></UrlForm>;
-}
-
-function noteContent(noteModel, closeModal): React.ReactElement {
-  return <NoteForm closeModal={closeModal} noteModel={noteModel}></NoteForm>;
-}
-
-export { linkContent, noteContent };

packages/editor/src/components/menu/useMuiWidgetManager.ts

@@ -1,10 +0,0 @@
-import { useState, useRef } from 'react';
-import DefaultWidgetManager from '../../classes/default-widget-manager';
-
-export const useMuiWidgetManager = (): [boolean, Element | undefined, DefaultWidgetManager] => {
-  const [popoverOpen, setPopoverOpen] = useState(false);
-  const [popoverTarget, setPopoverTarget] = useState(undefined);
-  const widgetManager = useRef(new DefaultWidgetManager(setPopoverOpen, setPopoverTarget));
-
-  return [popoverOpen, popoverTarget, widgetManager.current];
-};

packages/editor/src/components/toolbar/contents.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { NoteForm, UrlForm } from './toolbarCustomComponents';
 
-function linkContent(linkModel, closeModal): React.ReactElement {
+const linkContent = (linkModel, closeModal): React.ReactElement => {
   return <UrlForm closeModal={closeModal} urlModel={linkModel}></UrlForm>;
-}
+};
 
-function noteContent(noteModel, closeModal): React.ReactElement {
+const noteContent = (noteModel, closeModal): React.ReactElement => {
   return <NoteForm closeModal={closeModal} noteModel={noteModel}></NoteForm>;
-}
+};
 
 export { linkContent, noteContent };

packages/editor/src/components/toolbar/useMuiWidgetManager.ts

@@ -1,10 +0,0 @@
-import { useState, useRef } from 'react';
-import DefaultWidgetManager from '../../classes/default-widget-manager';
-
-export const useMuiWidgetManager = (): [boolean, Element | undefined, DefaultWidgetManager] => {
-  const [popoverOpen, setPopoverOpen] = useState(false);
-  const [popoverTarget, setPopoverTarget] = useState(undefined);
-  const widgetManager = useRef(new DefaultWidgetManager(setPopoverOpen, setPopoverTarget));
-
-  return [popoverOpen, popoverTarget, widgetManager.current];
-};

packages/editor/src/index.tsx

@@ -24,13 +24,13 @@ import {
 } from '@wisemapping/mindplot';
 import './global-styled.css';
 import I18nMsg from './classes/i18n-msg';
-import { useMuiWidgetManager } from './components/menu/useMuiWidgetManager';
 import Toolbar, { horizontalPosition, Appbar, configurationBuilder } from './components/toolbar';
 import { theme as defaultEditorTheme } from './theme';
 import ThemeProvider from '@mui/material/styles/ThemeProvider';
 import { Theme } from '@mui/material/styles';
 import { Notifier } from './components/footer/styled';
 import Footer from './components/footer';
+import DefaultWidgetManager from './classes/default-widget-manager';
 
 declare global {
   // used in mindplot
@@ -112,7 +112,7 @@ const Editor = ({
     setMindplotComponent(node);
   }, []);
 
-  const [popoverOpen, popoverTarget, widgetManager] = useMuiWidgetManager();
+  const [popoverOpen, popoverTarget, widgetManager] = DefaultWidgetManager.create();
 
   const onNodeBlurHandler = () => {
     if (!mindplotComponent.getDesigner().getModel().selectedTopic())
@@ -200,8 +200,8 @@ const Editor = ({
   const locale = options.locale;
   const msg = I18nMsg.loadLocaleData(locale);
   const menubarConfiguration = configurationBuilder.buildEditorAppBarConfiguration(
-    options.mapTitle,
     mindplotComponent?.getDesigner(),
+    options.mapTitle,
     onAction,
     () => {
       mindplotComponent.save(true);