mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: disable org menu when in focus mode on the activity page
This commit is contained in:
parent
46bf3f9c82
commit
59b5ac4793
2 changed files with 46 additions and 1 deletions
|
|
@ -161,6 +161,10 @@ function ActivityClient(props: ActivityClientProps) {
|
|||
React.useEffect(() => {
|
||||
if (typeof window !== 'undefined') {
|
||||
localStorage.setItem('globalFocusMode', isFocusMode.toString());
|
||||
// Dispatch custom event for focus mode change
|
||||
window.dispatchEvent(new CustomEvent('focusModeChange', {
|
||||
detail: { isFocusMode }
|
||||
}));
|
||||
isInitialRender.current = false;
|
||||
}
|
||||
}, [isFocusMode]);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
'use client'
|
||||
import React from 'react'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import Link from 'next/link'
|
||||
import { Search } from 'lucide-react'
|
||||
import { getUriWithOrg } from '@services/config/config'
|
||||
|
|
@ -9,6 +9,7 @@ import { getOrgLogoMediaDirectory } from '@services/media/media'
|
|||
import { useLHSession } from '@components/Contexts/LHSessionContext'
|
||||
import { useOrg } from '@components/Contexts/OrgContext'
|
||||
import { SearchBar } from '@components/Objects/Search/SearchBar'
|
||||
import { usePathname } from 'next/navigation'
|
||||
|
||||
export const OrgMenu = (props: any) => {
|
||||
const orgslug = props.orgslug
|
||||
|
|
@ -17,6 +18,41 @@ export const OrgMenu = (props: any) => {
|
|||
const [feedbackModal, setFeedbackModal] = React.useState(false)
|
||||
const org = useOrg() as any;
|
||||
const [isMenuOpen, setIsMenuOpen] = React.useState(false)
|
||||
const [isFocusMode, setIsFocusMode] = useState(false)
|
||||
const pathname = usePathname()
|
||||
|
||||
useEffect(() => {
|
||||
// Only check focus mode if we're in an activity page
|
||||
if (typeof window !== 'undefined' && pathname?.includes('/activity/')) {
|
||||
const saved = localStorage.getItem('globalFocusMode');
|
||||
setIsFocusMode(saved === 'true');
|
||||
} else {
|
||||
setIsFocusMode(false);
|
||||
}
|
||||
|
||||
// Add storage event listener for cross-window changes
|
||||
const handleStorageChange = (e: StorageEvent) => {
|
||||
if (e.key === 'globalFocusMode' && pathname?.includes('/activity/')) {
|
||||
setIsFocusMode(e.newValue === 'true');
|
||||
}
|
||||
};
|
||||
|
||||
// Add custom event listener for same-window changes
|
||||
const handleFocusModeChange = (e: CustomEvent) => {
|
||||
if (pathname?.includes('/activity/')) {
|
||||
setIsFocusMode(e.detail.isFocusMode);
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener('storage', handleStorageChange);
|
||||
window.addEventListener('focusModeChange', handleFocusModeChange as EventListener);
|
||||
|
||||
// Cleanup
|
||||
return () => {
|
||||
window.removeEventListener('storage', handleStorageChange);
|
||||
window.removeEventListener('focusModeChange', handleFocusModeChange as EventListener);
|
||||
};
|
||||
}, [pathname]);
|
||||
|
||||
function closeFeedbackModal() {
|
||||
setFeedbackModal(false)
|
||||
|
|
@ -26,6 +62,11 @@ export const OrgMenu = (props: any) => {
|
|||
setIsMenuOpen(!isMenuOpen)
|
||||
}
|
||||
|
||||
// Only hide menu if we're in an activity page and focus mode is enabled
|
||||
if (pathname?.includes('/activity/') && isFocusMode) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="backdrop-blur-lg h-[60px] blur-3xl -z-10"></div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue