2077b0ab4c
- Removed the ErrorProvider component and replaced it with a unified NotificationProvider. - Updated all components to utilize the new NotificationProvider for displaying notifications. - Enhanced notification types to include success, error, warning, and info with customizable messages and titles. - Removed Snackbar components from various views and replaced them with calls to the NotificationProvider. - Updated the ForgotPasswordView, LoginView, SignupView, and other components to handle notifications more effectively. - Improved user experience by providing consistent notification handling across the application.
90 lines
2.7 KiB
JavaScript
90 lines
2.7 KiB
JavaScript
import { Capacitor } from '@capacitor/core'
|
|
import { LocalNotifications } from '@capacitor/local-notifications'
|
|
import { Preferences } from '@capacitor/preferences'
|
|
import { Button, Stack, Typography } from '@mui/joy'
|
|
import { useEffect, useState } from 'react'
|
|
|
|
const NotificationAccessSnackbar = () => {
|
|
const [open, setOpen] = useState(false)
|
|
|
|
if (!Capacitor.isNativePlatform()) {
|
|
return null
|
|
}
|
|
const getNotificationPreferences = async () => {
|
|
const ret = await Preferences.get({ key: 'notificationPreferences' })
|
|
return JSON.parse(ret.value)
|
|
}
|
|
|
|
useEffect(() => {
|
|
getNotificationPreferences().then(data => {
|
|
// if optOut is true then don't show the snackbar
|
|
if (data?.optOut === true || data?.granted === true) {
|
|
return
|
|
}
|
|
setOpen(true)
|
|
})
|
|
}, [])
|
|
|
|
return (
|
|
<Snackbar
|
|
// autoHideDuration={5000}
|
|
variant='solid'
|
|
color='primary'
|
|
size='lg'
|
|
invertedColors
|
|
open={open}
|
|
onClose={() => setOpen(false)}
|
|
anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }}
|
|
sx={theme => ({
|
|
background: `linear-gradient(45deg, ${theme.palette.primary[600]} 30%, ${theme.palette.primary[500]} 90%})`,
|
|
maxWidth: 360,
|
|
})}
|
|
>
|
|
<div>
|
|
<Typography level='title-lg'>Need Notification?</Typography>
|
|
<Typography sx={{ mt: 1, mb: 2 }}>
|
|
You need to enable permission to receive notifications, do you want to
|
|
enable it?
|
|
</Typography>
|
|
<Stack direction='row' spacing={1}>
|
|
<Button
|
|
variant='solid'
|
|
color='primary'
|
|
onClick={() => {
|
|
const notificationPreferences = { optOut: false }
|
|
LocalNotifications.requestPermissions().then(resp => {
|
|
if (resp.display === 'granted') {
|
|
notificationPreferences['granted'] = true
|
|
}
|
|
})
|
|
Preferences.set({
|
|
key: 'notificationPreferences',
|
|
value: JSON.stringify(notificationPreferences),
|
|
})
|
|
setOpen(false)
|
|
}}
|
|
>
|
|
Yes
|
|
</Button>
|
|
<Button
|
|
variant='outlined'
|
|
color='primary'
|
|
onClick={() => {
|
|
const notificationPreferences = { optOut: true }
|
|
Preferences.set({
|
|
key: 'notificationPreferences',
|
|
value: JSON.stringify(notificationPreferences),
|
|
})
|
|
setOpen(false)
|
|
}}
|
|
>
|
|
No, Keep it Disabled
|
|
</Button>
|
|
</Stack>
|
|
</div>
|
|
</Snackbar>
|
|
)
|
|
}
|
|
|
|
export default NotificationAccessSnackbar
|