Resolve "Allow plugin to add entries to context menu"

Closes #307 (closed)

src/components/FunctionalArea/ContextMenu/ContextMenu.component.tsx

@@ -47,6 +47,7 @@ export const ContextMenu = (): React.ReactNode => {
     callback: (coordinates: ClickCoordinates, element: BioEntity | Reaction | undefined) => void,
   ) => {
     return () => {
+      dispatch(closeContextMenu());
       return callback(
         {
           modelId,
@@ -59,9 +60,6 @@ export const ContextMenu = (): React.ReactNode => {
     };
   };
 
-  // eslint-disable-next-line no-console
-  console.log(pluginContextMenu);
-
   return (
     <div
       className={twMerge(
@@ -76,7 +74,7 @@ export const ContextMenu = (): React.ReactNode => {
     >
       <button
         className={twMerge(
-          'cursor-pointer text-xs font-normal',
+          'w-full cursor-pointer text-left text-xs font-normal',
           !isUnitProtIdAvailable() ? 'cursor-not-allowed text-greyscale-700' : '',
         )}
         onClick={handleOpenMolArtClick}
@@ -87,13 +85,15 @@ export const ContextMenu = (): React.ReactNode => {
       </button>
       <hr />
       <button
-        className={twMerge('cursor-pointer text-xs font-normal')}
+        className={twMerge('w-full cursor-pointer text-left text-xs font-normal')}
         onClick={handleAddCommentClick}
         type="button"
         data-testid="add-comment"
       >
         Add comment
       </button>
+      {pluginContextMenu.length && <hr />}
+
       {pluginContextMenu.map(contextMenuEntry => (
         <button
           key={contextMenuEntry.id}