import axios from 'axios'; import { Field, Form, Formik } from 'formik'; import { useRouter } from 'next/router'; import React from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { useToasts } from 'react-toast-notifications'; import useSWR from 'swr'; import { useUser } from '../../../../hooks/useUser'; import Error from '../../../../pages/_error'; import Button from '../../../Common/Button'; import LoadingSpinner from '../../../Common/LoadingSpinner'; import { UserSettingsNotificationsResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces'; import * as Yup from 'yup'; const messages = defineMessages({ notificationsettings: 'Notification Settings', enableNotifications: 'Enable Notifications', discordId: 'Discord User ID', discordIdTip: 'The ID number for your Discord user account', validationDiscordId: 'You must provide a valid Discord user ID', telegramChatId: 'Telegram Chat ID', telegramChatIdTip: 'Add @get_id_bot to the chat', telegramChatIdTipLong: 'Start a chat, add @get_id_bot, and issue the /my_id command', sendSilently: 'Send Telegram Messages Silently', sendSilentlyDescription: 'Send notifications with no sound', validationTelegramChatId: 'You must provide a valid Telegram chat ID', save: 'Save Changes', saving: 'Saving…', plexuser: 'Plex User', localuser: 'Local User', toastSettingsSuccess: 'Settings successfully saved!', toastSettingsFailure: 'Something went wrong while saving settings.', }); const UserNotificationSettings: React.FC = () => { const intl = useIntl(); const { addToast } = useToasts(); const router = useRouter(); const { user, mutate } = useUser({ id: Number(router.query.userId) }); const { data, error, revalidate } = useSWR( user ? `/api/v1/user/${user?.id}/settings/notifications` : null ); const UserNotificationSettingsSchema = Yup.object().shape({ discordId: Yup.string() .nullable() .matches(/^\d{17,18}$/, intl.formatMessage(messages.validationDiscordId)), telegramChatId: Yup.string() .nullable() .matches( /^[-]?\d+$/, intl.formatMessage(messages.validationTelegramChatId) ), }); if (!data && !error) { return ; } if (!data) { return ; } return ( <>

{intl.formatMessage(messages.notificationsettings)}

{ try { await axios.post( `/api/v1/user/${user?.id}/settings/notifications`, { enableNotifications: values.enableNotifications, discordId: values.discordId, telegramChatId: values.telegramChatId, telegramSendSilently: values.telegramSendSilently, } ); addToast(intl.formatMessage(messages.toastSettingsSuccess), { autoDismiss: true, appearance: 'success', }); } catch (e) { addToast(intl.formatMessage(messages.toastSettingsFailure), { autoDismiss: true, appearance: 'error', }); } finally { revalidate(); mutate(); } }} > {({ errors, touched, isSubmitting }) => { return (
{errors.discordId && touched.discordId && (
{errors.discordId}
)}
{errors.telegramChatId && touched.telegramChatId && (
{errors.telegramChatId}
)}
); }}
); }; export default UserNotificationSettings;