diff --git a/frontend/app/layout/Layout.tsx b/frontend/app/layout/Layout.tsx
index f2e753f9a..a914884a1 100644
--- a/frontend/app/layout/Layout.tsx
+++ b/frontend/app/layout/Layout.tsx
@@ -55,7 +55,7 @@ function Layout(props: Props) {
collapsed={settingsStore.menuCollapsed || collapsed}
width={250}
>
-
+
) : null}
diff --git a/frontend/app/layout/SideMenu.tsx b/frontend/app/layout/SideMenu.tsx
index 7c3345b26..eed6ce9b0 100644
--- a/frontend/app/layout/SideMenu.tsx
+++ b/frontend/app/layout/SideMenu.tsx
@@ -1,4 +1,4 @@
-import { Divider, Menu, Tag, Typography } from 'antd';
+import { Divider, Menu, Tag, Typography, Popover, Button } from 'antd';
import cn from 'classnames';
import React from 'react';
import { RouteComponentProps, withRouter } from 'react-router-dom';
@@ -26,6 +26,7 @@ import {
spotOnlyCats
} from './data';
import { useStore } from 'App/mstore';
+import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG';
const { Text } = Typography;
@@ -36,13 +37,14 @@ interface Props extends RouteComponentProps {
function SideMenu(props: Props) {
const {
- location
+ location,
+ isCollapsed
} = props;
const isPreferencesActive = location.pathname.includes('/client/');
const [supportOpen, setSupportOpen] = React.useState(false);
const { searchStore, projectsStore, userStore } = useStore();
- const spotOnly = userStore.scopeState === 1;
+ const spotOnly = true; //userStore.scopeState === 1;
const account = userStore.account;
const modules = account.settings?.modules ?? [];
const isAdmin = account.admin || account.superAdmin;
@@ -50,16 +52,6 @@ function SideMenu(props: Props) {
const siteId = projectsStore.siteId;
const isMobile = projectsStore.isMobile;
- const [isModalVisible, setIsModalVisible] = React.useState(false);
-
- const handleModalOpen = () => {
- setIsModalVisible(true);
- };
-
- const handleModalClose = () => {
- setIsModalVisible(false);
- };
-
let menu: any[] = React.useMemo(() => {
const sourceMenu = isPreferencesActive ? preferences : main_menu;
@@ -151,7 +143,7 @@ function SideMenu(props: Props) {
[PREFERENCES_MENU.NOTIFICATIONS]: () => client(CLIENT_TABS.NOTIFICATIONS),
[PREFERENCES_MENU.BILLING]: () => client(CLIENT_TABS.BILLING),
[PREFERENCES_MENU.MODULES]: () => client(CLIENT_TABS.MODULES),
- [MENU.HIGHLIGHTS]: () => withSiteId(routes.highlights(''), siteId),
+ [MENU.HIGHLIGHTS]: () => withSiteId(routes.highlights(''), siteId)
};
const handleClick = (item: any) => {
@@ -326,13 +318,7 @@ function SideMenu(props: Props) {
))}
{spotOnly && !isPreferencesActive ? (
- <>
-
-
- >
+
) : null}
setSupportOpen(false)} open={supportOpen} />
>
@@ -340,3 +326,32 @@ function SideMenu(props: Props) {
}
export default withRouter(observer(SideMenu));
+
+
+const SpotMenuItem = ({ isCollapsed }: any) => {
+ const [isModalVisible, setIsModalVisible] = React.useState(false);
+
+ return (
+ <>
+ setIsModalVisible(false)}
+ />
+ {isCollapsed ? (
+ setIsModalVisible(true)} />}
+ trigger="hover"
+ placement="right"
+ >
+
+
+ ) : (
+ <>
+ setIsModalVisible(true)} />
+ >
+ )}
+ >
+ );
+};