Enhance notification drawer responsiveness by adjusting width based on mobile screen size.
This commit is contained in:
parent
e4255443a0
commit
62f0e047e2
@ -12,6 +12,7 @@ import { AuthContext } from './AuthContext'
|
||||
import { ApiServerContext } from './ApiServerContext'
|
||||
import NotificationCenter from '../common/NotificationCenter'
|
||||
import Notification from '../common/Notification'
|
||||
import { useMediaQuery } from 'react-responsive'
|
||||
|
||||
const NotificationContext = createContext()
|
||||
|
||||
@ -34,6 +35,8 @@ const NotificationProvider = ({ children }) => {
|
||||
const [notifications, setNotifications] = useState([])
|
||||
const [notificationsLoading, setNotificationsLoading] = useState(false)
|
||||
|
||||
const isMobile = useMediaQuery({ maxWidth: 768 })
|
||||
|
||||
const fetchNotifications = useCallback(async () => {
|
||||
if (!authenticated) return []
|
||||
setNotificationsLoading(true)
|
||||
@ -174,7 +177,7 @@ const NotificationProvider = ({ children }) => {
|
||||
<Drawer
|
||||
title='Notifications'
|
||||
placement='right'
|
||||
width={400}
|
||||
width={isMobile ? '100%' : 460}
|
||||
onClose={() => setNotificationCenterVisible(false)}
|
||||
open={notificationCenterVisible}
|
||||
>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user