mirror of
https://github.com/overleaf/overleaf.git
synced 2024-12-15 14:40:59 -05:00
38efea39f2
Move user settings to a context GitOrigin-RevId: 9a9d55dfee9f71cee323fe64d1442303ac7cfeb2
31 lines
1 KiB
TypeScript
31 lines
1 KiB
TypeScript
import { memo, useEffect, useRef, useState } from 'react'
|
|
import { useLayoutContext } from '../../../shared/context/layout-context'
|
|
import { useUserSettingsContext } from '@/shared/context/user-settings-context'
|
|
|
|
export default memo(function LeftMenuMask() {
|
|
const { setLeftMenuShown } = useLayoutContext()
|
|
const { userSettings } = useUserSettingsContext()
|
|
const { editorTheme, overallTheme } = userSettings
|
|
const [original] = useState({ editorTheme, overallTheme })
|
|
const maskRef = useRef<HTMLDivElement | null>(null)
|
|
|
|
useEffect(() => {
|
|
if (maskRef.current) {
|
|
if (
|
|
editorTheme !== original.editorTheme ||
|
|
overallTheme !== original.overallTheme
|
|
) {
|
|
maskRef.current.style.opacity = '0'
|
|
}
|
|
}
|
|
}, [editorTheme, overallTheme, original])
|
|
|
|
return (
|
|
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
|
|
<div
|
|
id="left-menu-mask"
|
|
ref={maskRef}
|
|
onClick={() => setLeftMenuShown(false)}
|
|
/>
|
|
)
|
|
})
|