LF-4718: fix web deploy tsc error

packages/webapp/src/components/Menu/FloatingButtonMenu/FloatingMenu.tsx

@@ -0,0 +1,52 @@
+/*
+ *  Copyright 2023 LiteFarm.org
+ *  This file is part of LiteFarm.
+ *
+ *  LiteFarm is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  LiteFarm is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ *  GNU General Public License for more details, see <https://www.gnu.org/licenses/>.
+ */
+import React, { forwardRef } from 'react';
+import clsx from 'clsx';
+import MenuItem from '@mui/material/MenuItem';
+import MenuList from '@mui/material/MenuList';
+import styles from './styles.module.scss';
+
+export type FloatingMenuProps = {
+  options: { label: React.ReactNode; onClick: () => void }[];
+  classes?: { menuList?: string; menuItem?: string };
+  onCloseMenu?: () => void;
+};
+
+const FloatingMenu = forwardRef<HTMLUListElement, FloatingMenuProps>(
+  ({ options, classes = {}, onCloseMenu, ...props }, ref) => {
+    return (
+      <MenuList ref={ref} className={clsx(styles.menuList, classes.menuList)} {...props}>
+        {options.map(({ label, onClick }, index) => {
+          return (
+            <MenuItem
+              key={index}
+              onClick={() => {
+                onClick();
+                onCloseMenu?.();
+              }}
+              className={clsx(styles.menuItem, classes.menuItem)}
+            >
+              {label}
+            </MenuItem>
+          );
+        })}
+      </MenuList>
+    );
+  },
+);
+
+FloatingMenu.displayName = 'FloatingMenu';
+
+export default FloatingMenu;

packages/webapp/src/components/Menu/MeatballsMenu/index.tsx

@@ -15,7 +15,7 @@
 import { forwardRef, ReactNode } from 'react';
 import clsx from 'clsx';
 import { BsThreeDots } from 'react-icons/bs';
-import FloatingMenu from '../FloatingButtonMenu/FloatingMenu';
+import FloatingMenu, { FloatingMenuProps } from '../FloatingButtonMenu/FloatingMenu';
 import DropdownButton from '../../Form/DropDownButton';
 import styles from './styles.module.scss';
 
@@ -26,19 +26,17 @@ export type MeatballsMenuProps = {
 };
 
 const MeatballsMenu = ({ options, classes, disabled = false }: MeatballsMenuProps) => {
+  const Menu = forwardRef<HTMLUListElement, FloatingMenuProps>((menuProps, ref) => (
+    <FloatingMenu ref={ref} classes={{ menuItem: styles.menuItem }} {...menuProps} />
+  ));
+  Menu.displayName = 'Menu';
+
   return (
     <DropdownButton
       type={'v2'}
       noIcon
       classes={{ button: clsx(styles.menuButton, classes?.button) }}
-      Menu={forwardRef((menuProps, ref) => (
-        <FloatingMenu
-          ref={ref}
-          options={options}
-          classes={{ menuItem: styles.menuItem }}
-          {...menuProps}
-        />
-      ))}
+      Menu={Menu}
       menuPositionOffset={[0, 1]}
       disabled={disabled}
     >

packages/webapp/src/components/Modals/ModalComponent/v2/index.jsx

@@ -13,7 +13,7 @@ import { BsX } from 'react-icons/bs';
 import { Close } from '@mui/icons-material';
 
 export default function ModalComponent({
-  title,
+  title = '',
   titleClassName,
   icon,
   contents,