mirror of
https://github.com/sct/overseerr.git
synced 2025-09-17 17:24:35 +02:00
feat(notif): add Gotify agent (#2196)
* feat(notifications): adds gotify notifications adds new settings screen for gotify notifications including url, token and types settings fix #2183 * feat(notif): add Gotify agent addresses PR comments, runs i18n:extract fix #2183 * reword validationTokenRequired change wording to indicate presence, not validity Co-authored-by: TheCatLady <52870424+TheCatLady@users.noreply.github.com> * feat(notifications): gotify notifications fix applies changes from #2077 in which Yup validation was failing for types fix #2183 * feat(notifications): adds gotify notifications adds new settings screen for gotify notifications including url, token and types settings fix #2183 * feat(notif): add Gotify agent addresses PR comments, runs i18n:extract fix #2183 * reword validationTokenRequired change wording to indicate presence, not validity Co-authored-by: TheCatLady <52870424+TheCatLady@users.noreply.github.com> * feat(notifications): gotify notifications fix applies changes from #2077 in which Yup validation was failing for types fix #2183 * feat(notifications): incorporate issue feature into gotify notifications * feat(notifications): adds gotify notifications adds new settings screen for gotify notifications including url, token and types settings fix #2183 * feat(notif): add Gotify agent addresses PR comments, runs i18n:extract fix #2183 * reword validationTokenRequired change wording to indicate presence, not validity Co-authored-by: TheCatLady <52870424+TheCatLady@users.noreply.github.com> * feat: add missing ts field include notifyAdmin in test notification endpoint * feat: apply formatting/line break items add addition line break before conditional, change ordering of notifyAdmin/notifyUser in test endpoint * feat: remove duplicated endpoints during rebase, notification endpoints were duplicated upon rebasing. remove duplicate routes * feat: correct linting quirks * feat: formatting improvements * feat(gotify): refactor axios post to leverage 'getNotificationPayload' Co-authored-by: TheCatLady <52870424+TheCatLady@users.noreply.github.com>
This commit is contained in:
Sean Chambers
@@ -0,0 +1,256 @@
|
||||
import { BeakerIcon, SaveIcon } from '@heroicons/react/solid';
|
||||
import axios from 'axios';
|
||||
import { Field, Form, Formik } from 'formik';
|
||||
import React, { useState } from 'react';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
import { useToasts } from 'react-toast-notifications';
|
||||
import useSWR from 'swr';
|
||||
import * as Yup from 'yup';
|
||||
import globalMessages from '../../../../i18n/globalMessages';
|
||||
import Button from '../../../Common/Button';
|
||||
import LoadingSpinner from '../../../Common/LoadingSpinner';
|
||||
import NotificationTypeSelector from '../../../NotificationTypeSelector';
|
||||
|
||||
const messages = defineMessages({
|
||||
agentenabled: 'Enable Agent',
|
||||
url: 'Server URL',
|
||||
token: 'Application Token',
|
||||
validationUrlRequired: 'You must provide a valid URL',
|
||||
validationUrlTrailingSlash: 'URL must not end in a trailing slash',
|
||||
validationTokenRequired: 'You must provide an application token',
|
||||
gotifysettingssaved: 'Gotify notification settings saved successfully!',
|
||||
gotifysettingsfailed: 'Gotify notification settings failed to save.',
|
||||
toastGotifyTestSending: 'Sending Gotify test notification…',
|
||||
toastGotifyTestSuccess: 'Gotify test notification sent!',
|
||||
toastGotifyTestFailed: 'Gotify test notification failed to send.',
|
||||
validationTypes: 'You must select at least one notification type',
|
||||
});
|
||||
|
||||
const NotificationsGotify: React.FC = () => {
|
||||
const intl = useIntl();
|
||||
const { addToast, removeToast } = useToasts();
|
||||
const [isTesting, setIsTesting] = useState(false);
|
||||
const { data, error, revalidate } = useSWR(
|
||||
'/api/v1/settings/notifications/gotify'
|
||||
);
|
||||
|
||||
const NotificationsGotifySchema = Yup.object().shape({
|
||||
url: Yup.string()
|
||||
.when('enabled', {
|
||||
is: true,
|
||||
then: Yup.string()
|
||||
.nullable()
|
||||
.required(intl.formatMessage(messages.validationUrlRequired)),
|
||||
otherwise: Yup.string().nullable(),
|
||||
})
|
||||
.matches(
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
/^(https?:)?\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*)?([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i,
|
||||
intl.formatMessage(messages.validationUrlRequired)
|
||||
)
|
||||
.test(
|
||||
'no-trailing-slash',
|
||||
intl.formatMessage(messages.validationUrlTrailingSlash),
|
||||
(value) => !value || !value.endsWith('/')
|
||||
),
|
||||
token: Yup.string().when('enabled', {
|
||||
is: true,
|
||||
then: Yup.string()
|
||||
.nullable()
|
||||
.required(intl.formatMessage(messages.validationTokenRequired)),
|
||||
otherwise: Yup.string().nullable(),
|
||||
}),
|
||||
});
|
||||
|
||||
if (!data && !error) {
|
||||
return <LoadingSpinner />;
|
||||
}
|
||||
|
||||
return (
|
||||
<Formik
|
||||
initialValues={{
|
||||
enabled: data?.enabled,
|
||||
types: data?.types,
|
||||
url: data?.options.url,
|
||||
token: data?.options.token,
|
||||
}}
|
||||
validationSchema={NotificationsGotifySchema}
|
||||
onSubmit={async (values) => {
|
||||
try {
|
||||
await axios.post('/api/v1/settings/notifications/gotify', {
|
||||
enabled: values.enabled,
|
||||
types: values.types,
|
||||
options: {
|
||||
url: values.url,
|
||||
token: values.token,
|
||||
},
|
||||
});
|
||||
addToast(intl.formatMessage(messages.gotifysettingssaved), {
|
||||
appearance: 'success',
|
||||
autoDismiss: true,
|
||||
});
|
||||
} catch (e) {
|
||||
addToast(intl.formatMessage(messages.gotifysettingsfailed), {
|
||||
appearance: 'error',
|
||||
autoDismiss: true,
|
||||
});
|
||||
} finally {
|
||||
revalidate();
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({
|
||||
errors,
|
||||
touched,
|
||||
isSubmitting,
|
||||
values,
|
||||
isValid,
|
||||
setFieldValue,
|
||||
setFieldTouched,
|
||||
}) => {
|
||||
const testSettings = async () => {
|
||||
setIsTesting(true);
|
||||
let toastId: string | undefined;
|
||||
try {
|
||||
addToast(
|
||||
intl.formatMessage(messages.toastGotifyTestSending),
|
||||
{
|
||||
autoDsmiss: false,
|
||||
appearance: 'info',
|
||||
},
|
||||
(id) => {
|
||||
toastId = id;
|
||||
}
|
||||
);
|
||||
await axios.post('/api/v1/settings/notifications/gotify/test', {
|
||||
enabled: true,
|
||||
types: values.types,
|
||||
options: {
|
||||
url: values.url,
|
||||
token: values.token,
|
||||
},
|
||||
});
|
||||
|
||||
if (toastId) {
|
||||
removeToast(toastId);
|
||||
}
|
||||
addToast(intl.formatMessage(messages.toastGotifyTestSuccess), {
|
||||
autoDismiss: true,
|
||||
appearance: 'success',
|
||||
});
|
||||
} catch (e) {
|
||||
if (toastId) {
|
||||
removeToast(toastId);
|
||||
}
|
||||
addToast(intl.formatMessage(messages.toastGotifyTestFailed), {
|
||||
autoDismiss: true,
|
||||
appearance: 'error',
|
||||
});
|
||||
} finally {
|
||||
setIsTesting(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Form className="section">
|
||||
<div className="form-row">
|
||||
<label htmlFor="enabled" className="checkbox-label">
|
||||
{intl.formatMessage(messages.agentenabled)}
|
||||
<span className="label-required">*</span>
|
||||
</label>
|
||||
<div className="form-input">
|
||||
<Field type="checkbox" id="enabled" name="enabled" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-row">
|
||||
<label htmlFor="url" className="text-label">
|
||||
{intl.formatMessage(messages.url)}
|
||||
<span className="label-required">*</span>
|
||||
</label>
|
||||
<div className="form-input">
|
||||
<div className="form-input-field">
|
||||
<Field id="url" name="url" type="text" />
|
||||
</div>
|
||||
{errors.url && touched.url && (
|
||||
<div className="error">{errors.url}</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-row">
|
||||
<label htmlFor="token" className="text-label">
|
||||
{intl.formatMessage(messages.token)}
|
||||
<span className="label-required">*</span>
|
||||
</label>
|
||||
<div className="form-input">
|
||||
<div className="form-input-field">
|
||||
<Field id="token" name="token" type="text" />
|
||||
</div>
|
||||
{errors.token && touched.token && (
|
||||
<div className="error">{errors.token}</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<NotificationTypeSelector
|
||||
currentTypes={values.enabled ? values.types : 0}
|
||||
onUpdate={(newTypes) => {
|
||||
setFieldValue('types', newTypes);
|
||||
setFieldTouched('types');
|
||||
|
||||
if (newTypes) {
|
||||
setFieldValue('enabled', true);
|
||||
}
|
||||
}}
|
||||
error={
|
||||
values.enabled && !values.types && touched.types
|
||||
? intl.formatMessage(messages.validationTypes)
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
<div className="actions">
|
||||
<div className="flex justify-end">
|
||||
<span className="inline-flex ml-3 rounded-md shadow-sm">
|
||||
<Button
|
||||
buttonType="warning"
|
||||
disabled={isSubmitting || !isValid || isTesting}
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
testSettings();
|
||||
}}
|
||||
>
|
||||
<BeakerIcon />
|
||||
<span>
|
||||
{isTesting
|
||||
? intl.formatMessage(globalMessages.testing)
|
||||
: intl.formatMessage(globalMessages.test)}
|
||||
</span>
|
||||
</Button>
|
||||
</span>
|
||||
<span className="inline-flex ml-3 rounded-md shadow-sm">
|
||||
<Button
|
||||
buttonType="primary"
|
||||
type="submit"
|
||||
disabled={
|
||||
isSubmitting ||
|
||||
!isValid ||
|
||||
isTesting ||
|
||||
(values.enabled && !values.types)
|
||||
}
|
||||
>
|
||||
<SaveIcon />
|
||||
<span>
|
||||
{isSubmitting
|
||||
? intl.formatMessage(globalMessages.saving)
|
||||
: intl.formatMessage(globalMessages.save)}
|
||||
</span>
|
||||
</Button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Form>
|
||||
);
|
||||
}}
|
||||
</Formik>
|
||||
);
|
||||
};
|
||||
|
||||
export default NotificationsGotify;
|
||||
@@ -2,6 +2,7 @@ import { CloudIcon, LightningBoltIcon, MailIcon } from '@heroicons/react/solid';
|
||||
import React from 'react';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
import DiscordLogo from '../../assets/extlogos/discord.svg';
|
||||
import GotifyLogo from '../../assets/extlogos/gotify.svg';
|
||||
import LunaSeaLogo from '../../assets/extlogos/lunasea.svg';
|
||||
import PushbulletLogo from '../../assets/extlogos/pushbullet.svg';
|
||||
import PushoverLogo from '../../assets/extlogos/pushover.svg';
|
||||
@@ -58,6 +59,17 @@ const SettingsNotifications: React.FC = ({ children }) => {
|
||||
route: '/settings/notifications/discord',
|
||||
regex: /^\/settings\/notifications\/discord/,
|
||||
},
|
||||
{
|
||||
text: 'Gotify',
|
||||
content: (
|
||||
<span className="flex items-center">
|
||||
<GotifyLogo className="h-4 mr-2" />
|
||||
Gotify
|
||||
</span>
|
||||
),
|
||||
route: '/settings/notifications/gotify',
|
||||
regex: /^\/settings\/notifications\/gotify/,
|
||||
},
|
||||
{
|
||||
text: 'LunaSea',
|
||||
content: (
|
||||
|
||||
Reference in New Issue
Block a user