chrisryn/requestarr
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

chore(deps): update react to 18 (#2943)

Browse Source
This commit is contained in:
Ryan Cohen
2022-08-18 17:05:58 +09:00
committed by GitHub
parent 72d7a3477f
commit e5d8c93ab8
164 changed files with 982 additions and 915 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/components/Settings/Notifications/NotificationsDiscord.tsx
View File

@@ -29,7 +29,7 @@ const messages = defineMessages({
enableMentions: 'Enable Mentions',
});
const NotificationsDiscord: React.FC = () => {
const NotificationsDiscord = () => {
const intl = useIntl();
const settings = useSettings();
const { addToast, removeToast } = useToasts();
@@ -168,18 +168,16 @@ const NotificationsDiscord: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.webhookUrlTip, {
DiscordWebhookLink: function DiscordWebhookLink(msg) {
return (
<a
href="https://support.discord.com/hc/en-us/articles/228383668-Intro-to-Webhooks"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
DiscordWebhookLink: (msg: React.ReactNode) => (
<a
href="https://support.discord.com/hc/en-us/articles/228383668-Intro-to-Webhooks"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -192,9 +190,11 @@ const NotificationsDiscord: React.FC = () => {
inputMode="url"
/>
</div>
{errors.webhookUrl && touched.webhookUrl && (
<div className="error">{errors.webhookUrl}</div>
)}
{errors.webhookUrl &&
touched.webhookUrl &&
typeof errors.webhookUrl === 'string' && (
<div className="error">{errors.webhookUrl}</div>
)}
</div>
</div>
<div className="form-row">
@@ -210,9 +210,11 @@ const NotificationsDiscord: React.FC = () => {
placeholder={settings.currentSettings.applicationTitle}
/>
</div>
{errors.botUsername && touched.botUsername && (
<div className="error">{errors.botUsername}</div>
)}
{errors.botUsername &&
touched.botUsername &&
typeof errors.botUsername === 'string' && (
<div className="error">{errors.botUsername}</div>
)}
</div>
</div>
<div className="form-row">
@@ -228,9 +230,11 @@ const NotificationsDiscord: React.FC = () => {
inputMode="url"
/>
</div>
{errors.botAvatarUrl && touched.botAvatarUrl && (
<div className="error">{errors.botAvatarUrl}</div>
)}
{errors.botAvatarUrl &&
touched.botAvatarUrl &&
typeof errors.botAvatarUrl === 'string' && (
<div className="error">{errors.botAvatarUrl}</div>
)}
</div>
</div>
<div className="form-row">

44
src/components/Settings/Notifications/NotificationsEmail.tsx
View File

@@ -46,7 +46,7 @@ const messages = defineMessages({
validationPgpPassword: 'You must provide a PGP password',
});
export function OpenPgpLink(msg: string): JSX.Element {
export function OpenPgpLink(msg: React.ReactNode) {
return (
<a href="https://www.openpgp.org/" target="_blank" rel="noreferrer">
{msg}
@@ -54,7 +54,7 @@ export function OpenPgpLink(msg: string): JSX.Element {
);
}
const NotificationsEmail: React.FC = () => {
const NotificationsEmail = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -265,9 +265,11 @@ const NotificationsEmail: React.FC = () => {
inputMode="email"
/>
</div>
{errors.emailFrom && touched.emailFrom && (
<div className="error">{errors.emailFrom}</div>
)}
{errors.emailFrom &&
touched.emailFrom &&
typeof errors.emailFrom === 'string' && (
<div className="error">{errors.emailFrom}</div>
)}
</div>
</div>
<div className="form-row">
@@ -284,9 +286,11 @@ const NotificationsEmail: React.FC = () => {
inputMode="url"
/>
</div>
{errors.smtpHost && touched.smtpHost && (
<div className="error">{errors.smtpHost}</div>
)}
{errors.smtpHost &&
touched.smtpHost &&
typeof errors.smtpHost === 'string' && (
<div className="error">{errors.smtpHost}</div>
)}
</div>
</div>
<div className="form-row">
@@ -302,9 +306,11 @@ const NotificationsEmail: React.FC = () => {
inputMode="numeric"
className="short"
/>
{errors.smtpPort && touched.smtpPort && (
<div className="error">{errors.smtpPort}</div>
)}
{errors.smtpPort &&
touched.smtpPort &&
typeof errors.smtpPort === 'string' && (
<div className="error">{errors.smtpPort}</div>
)}
</div>
</div>
<div className="form-row">
@@ -396,9 +402,11 @@ const NotificationsEmail: React.FC = () => {
className="font-mono text-xs"
/>
</div>
{errors.pgpPrivateKey && touched.pgpPrivateKey && (
<div className="error">{errors.pgpPrivateKey}</div>
)}
{errors.pgpPrivateKey &&
touched.pgpPrivateKey &&
typeof errors.pgpPrivateKey === 'string' && (
<div className="error">{errors.pgpPrivateKey}</div>
)}
</div>
</div>
<div className="form-row">
@@ -424,9 +432,11 @@ const NotificationsEmail: React.FC = () => {
autoComplete="one-time-code"
/>
</div>
{errors.pgpPassword && touched.pgpPassword && (
<div className="error">{errors.pgpPassword}</div>
)}
{errors.pgpPassword &&
touched.pgpPassword &&
typeof errors.pgpPassword === 'string' && (
<div className="error">{errors.pgpPassword}</div>
)}
</div>
</div>
<div className="actions">

18
src/components/Settings/Notifications/NotificationsGotify/index.tsx
View File

@@ -26,7 +26,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsGotify: React.FC = () => {
const NotificationsGotify = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -173,9 +173,11 @@ const NotificationsGotify: React.FC = () => {
<div className="form-input-field">
<Field id="url" name="url" type="text" />
</div>
{errors.url && touched.url && (
<div className="error">{errors.url}</div>
)}
{errors.url &&
touched.url &&
typeof errors.url === 'string' && (
<div className="error">{errors.url}</div>
)}
</div>
</div>
<div className="form-row">
@@ -187,9 +189,11 @@ const NotificationsGotify: React.FC = () => {
<div className="form-input-field">
<Field id="token" name="token" type="text" />
</div>
{errors.token && touched.token && (
<div className="error">{errors.token}</div>
)}
{errors.token &&
touched.token &&
typeof errors.token === 'string' && (
<div className="error">{errors.token}</div>
)}
</div>
</div>
<NotificationTypeSelector

38
src/components/Settings/Notifications/NotificationsLunaSea/index.tsx
View File

@@ -27,7 +27,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsLunaSea: React.FC = () => {
const NotificationsLunaSea = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -155,18 +155,16 @@ const NotificationsLunaSea: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.webhookUrlTip, {
LunaSeaLink: function LunaSeaLink(msg) {
return (
<a
href="https://docs.lunasea.app/lunasea/notifications/overseerr"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
LunaSeaLink: (msg: React.ReactNode) => (
<a
href="https://docs.lunasea.app/lunasea/notifications/overseerr"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -179,9 +177,11 @@ const NotificationsLunaSea: React.FC = () => {
inputMode="url"
/>
</div>
{errors.webhookUrl && touched.webhookUrl && (
<div className="error">{errors.webhookUrl}</div>
)}
{errors.webhookUrl &&
touched.webhookUrl &&
typeof errors.webhookUrl === 'string' && (
<div className="error">{errors.webhookUrl}</div>
)}
</div>
</div>
<div className="form-row">
@@ -189,9 +189,9 @@ const NotificationsLunaSea: React.FC = () => {
{intl.formatMessage(messages.profileName)}
<span className="label-tip">
{intl.formatMessage(messages.profileNameTip, {
code: function code(msg) {
return <code className="bg-opacity-50">{msg}</code>;
},
code: (msg: React.ReactNode) => (
<code className="bg-opacity-50">{msg}</code>
),
})}
</span>
</label>

34
src/components/Settings/Notifications/NotificationsPushbullet/index.tsx
View File

@@ -28,7 +28,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsPushbullet: React.FC = () => {
const NotificationsPushbullet = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -154,20 +154,16 @@ const NotificationsPushbullet: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.accessTokenTip, {
PushbulletSettingsLink: function PushbulletSettingsLink(
msg
) {
return (
<a
href="https://www.pushbullet.com/#settings/account"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
PushbulletSettingsLink: (msg: React.ReactNode) => (
<a
href="https://www.pushbullet.com/#settings/account"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -180,9 +176,11 @@ const NotificationsPushbullet: React.FC = () => {
autoComplete="one-time-code"
/>
</div>
{errors.accessToken && touched.accessToken && (
<div className="error">{errors.accessToken}</div>
)}
{errors.accessToken &&
touched.accessToken &&
typeof errors.accessToken === 'string' && (
<div className="error">{errors.accessToken}</div>
)}
</div>
</div>
<div className="form-row">

63
src/components/Settings/Notifications/NotificationsPushover/index.tsx
View File

@@ -29,7 +29,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsPushover: React.FC = () => {
const NotificationsPushover = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -172,19 +172,16 @@ const NotificationsPushover: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.accessTokenTip, {
ApplicationRegistrationLink:
function ApplicationRegistrationLink(msg) {
return (
<a
href="https://pushover.net/api#registration"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
ApplicationRegistrationLink: (msg: React.ReactNode) => (
<a
href="https://pushover.net/api#registration"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -192,9 +189,11 @@ const NotificationsPushover: React.FC = () => {
<div className="form-input-field">
<Field id="accessToken" name="accessToken" type="text" />
</div>
{errors.accessToken && touched.accessToken && (
<div className="error">{errors.accessToken}</div>
)}
{errors.accessToken &&
touched.accessToken &&
typeof errors.accessToken === 'string' && (
<div className="error">{errors.accessToken}</div>
)}
</div>
</div>
<div className="form-row">
@@ -203,18 +202,16 @@ const NotificationsPushover: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.userTokenTip, {
UsersGroupsLink: function UsersGroupsLink(msg) {
return (
<a
href="https://pushover.net/api#identifiers"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
UsersGroupsLink: (msg: React.ReactNode) => (
<a
href="https://pushover.net/api#identifiers"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -222,9 +219,11 @@ const NotificationsPushover: React.FC = () => {
<div className="form-input-field">
<Field id="userToken" name="userToken" type="text" />
</div>
{errors.userToken && touched.userToken && (
<div className="error">{errors.userToken}</div>
)}
{errors.userToken &&
touched.userToken &&
typeof errors.userToken === 'string' && (
<div className="error">{errors.userToken}</div>
)}
</div>
</div>
<NotificationTypeSelector

32
src/components/Settings/Notifications/NotificationsSlack/index.tsx
View File

@@ -25,7 +25,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsSlack: React.FC = () => {
const NotificationsSlack = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -150,18 +150,16 @@ const NotificationsSlack: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.webhookUrlTip, {
WebhookLink: function WebhookLink(msg) {
return (
<a
href="https://my.slack.com/services/new/incoming-webhook/"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
WebhookLink: (msg: React.ReactNode) => (
<a
href="https://my.slack.com/services/new/incoming-webhook/"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
})}
</span>
</label>
@@ -174,9 +172,11 @@ const NotificationsSlack: React.FC = () => {
inputMode="url"
/>
</div>
{errors.webhookUrl && touched.webhookUrl && (
<div className="error">{errors.webhookUrl}</div>
)}
{errors.webhookUrl &&
touched.webhookUrl &&
typeof errors.webhookUrl === 'string' && (
<div className="error">{errors.webhookUrl}</div>
)}
</div>
</div>
<NotificationTypeSelector

100
src/components/Settings/Notifications/NotificationsTelegram.tsx
View File

@@ -34,7 +34,7 @@ const messages = defineMessages({
sendSilentlyTip: 'Send notifications with no sound',
});
const NotificationsTelegram: React.FC = () => {
const NotificationsTelegram = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -179,33 +179,29 @@ const NotificationsTelegram: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.botApiTip, {
CreateBotLink: function CreateBotLink(msg) {
return (
<a
href="https://core.telegram.org/bots#6-botfather"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
GetIdBotLink: function GetIdBotLink(msg) {
return (
<a
href="https://telegram.me/get_id_bot"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
code: function code(msg) {
return <code className="bg-opacity-50">{msg}</code>;
},
CreateBotLink: (msg: React.ReactNode) => (
<a
href="https://core.telegram.org/bots#6-botfather"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
GetIdBotLink: (msg: React.ReactNode) => (
<a
href="https://telegram.me/get_id_bot"
className="text-white transition duration-300 hover:underline"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
code: (msg: React.ReactNode) => (
<code className="bg-opacity-50">{msg}</code>
),
})}
</span>
</label>
@@ -218,9 +214,11 @@ const NotificationsTelegram: React.FC = () => {
autoComplete="one-time-code"
/>
</div>
{errors.botAPI && touched.botAPI && (
<div className="error">{errors.botAPI}</div>
)}
{errors.botAPI &&
touched.botAPI &&
typeof errors.botAPI === 'string' && (
<div className="error">{errors.botAPI}</div>
)}
</div>
</div>
<div className="form-row">
@@ -234,9 +232,11 @@ const NotificationsTelegram: React.FC = () => {
<div className="form-input-field">
<Field id="botUsername" name="botUsername" type="text" />
</div>
{errors.botUsername && touched.botUsername && (
<div className="error">{errors.botUsername}</div>
)}
{errors.botUsername &&
touched.botUsername &&
typeof errors.botUsername === 'string' && (
<div className="error">{errors.botUsername}</div>
)}
</div>
</div>
<div className="form-row">
@@ -245,20 +245,16 @@ const NotificationsTelegram: React.FC = () => {
<span className="label-required">*</span>
<span className="label-tip">
{intl.formatMessage(messages.chatIdTip, {
GetIdBotLink: function GetIdBotLink(msg) {
return (
<a
href="https://telegram.me/get_id_bot"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
);
},
code: function code(msg) {
return <code>{msg}</code>;
},
GetIdBotLink: (msg: React.ReactNode) => (
<a
href="https://telegram.me/get_id_bot"
target="_blank"
rel="noreferrer"
>
{msg}
</a>
),
code: (msg: React.ReactNode) => <code>{msg}</code>,
})}
</span>
</label>
@@ -266,9 +262,11 @@ const NotificationsTelegram: React.FC = () => {
<div className="form-input-field">
<Field id="chatId" name="chatId" type="text" />
</div>
{errors.chatId && touched.chatId && (
<div className="error">{errors.chatId}</div>
)}
{errors.chatId &&
touched.chatId &&
typeof errors.chatId === 'string' && (
<div className="error">{errors.chatId}</div>
)}
</div>
</div>
<div className="form-row">

2
src/components/Settings/Notifications/NotificationsWebPush/index.tsx
View File

@@ -21,7 +21,7 @@ const messages = defineMessages({
'In order to receive web push notifications, Overseerr must be served over HTTPS.',
});
const NotificationsWebPush: React.FC = () => {
const NotificationsWebPush = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);

18
src/components/Settings/Notifications/NotificationsWebhook/index.tsx
View File

@@ -70,7 +70,7 @@ const messages = defineMessages({
validationTypes: 'You must select at least one notification type',
});
const NotificationsWebhook: React.FC = () => {
const NotificationsWebhook = () => {
const intl = useIntl();
const { addToast, removeToast } = useToasts();
const [isTesting, setIsTesting] = useState(false);
@@ -244,9 +244,11 @@ const NotificationsWebhook: React.FC = () => {
inputMode="url"
/>
</div>
{errors.webhookUrl && touched.webhookUrl && (
<div className="error">{errors.webhookUrl}</div>
)}
{errors.webhookUrl &&
touched.webhookUrl &&
typeof errors.webhookUrl === 'string' && (
<div className="error">{errors.webhookUrl}</div>
)}
</div>
</div>
<div className="form-row">
@@ -273,9 +275,11 @@ const NotificationsWebhook: React.FC = () => {
onBlur={() => setFieldTouched('jsonPayload')}
/>
</div>
{errors.jsonPayload && touched.jsonPayload && (
<div className="error">{errors.jsonPayload}</div>
)}
{errors.jsonPayload &&
touched.jsonPayload &&
typeof errors.jsonPayload === 'string' && (
<div className="error">{errors.jsonPayload}</div>
)}
<div className="mt-2">
<Button
buttonSize="sm"