mirror of
https://github.com/sct/overseerr.git
synced 2025-09-27 04:22:37 +02:00
refactor(ui): improved alerts for services settings & removed alert titles (#1280)
* refactor(ui): improved alerts for services settings & removed alert titles * fix(ui): set styling of alert links to be consistent w/ others * fix(ui): clarify appropriate 4K setting when user has not configured a default non-4K server * fix: remove unused var/eslint-disable & correct string
This commit is contained in:
@@ -38,9 +38,8 @@ const messages = defineMessages({
|
||||
toastPlexConnecting: 'Attempting to connect to Plex…',
|
||||
toastPlexConnectingSuccess: 'Plex connection established successfully!',
|
||||
toastPlexConnectingFailure: 'Failed to connect to Plex.',
|
||||
settingUpPlex: 'Setting Up Plex',
|
||||
settingUpPlexDescription:
|
||||
'To set up Plex, you can either enter your details manually or select a server retrieved from <RegisterPlexTVLink>plex.tv</RegisterPlexTVLink>. Press the button to the right of the dropdown to check connectivity and retrieve available servers.',
|
||||
'To set up Plex, you can either enter your details manually or select a server retrieved from <RegisterPlexTVLink>plex.tv</RegisterPlexTVLink>. Press the button to the right of the dropdown to fetch the list of available servers.',
|
||||
hostname: 'Hostname or IP Address',
|
||||
port: 'Port',
|
||||
enablessl: 'Enable SSL',
|
||||
@@ -81,7 +80,6 @@ interface PresetServerDisplay {
|
||||
ssl: boolean;
|
||||
uri: string;
|
||||
address: string;
|
||||
host?: string;
|
||||
port: number;
|
||||
local: boolean;
|
||||
status?: boolean;
|
||||
@@ -94,7 +92,6 @@ interface SettingsPlexProps {
|
||||
const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
const [isSyncing, setIsSyncing] = useState(false);
|
||||
const [isRefreshingPresets, setIsRefreshingPresets] = useState(false);
|
||||
const [submitError, setSubmitError] = useState<string | null>(null);
|
||||
const [availableServers, setAvailableServers] = useState<PlexDevice[] | null>(
|
||||
null
|
||||
);
|
||||
@@ -268,13 +265,13 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
{intl.formatMessage(messages.plexsettingsDescription)}
|
||||
</p>
|
||||
<div className="section">
|
||||
<Alert title={intl.formatMessage(messages.settingUpPlex)} type="info">
|
||||
{intl.formatMessage(messages.settingUpPlexDescription, {
|
||||
<Alert
|
||||
title={intl.formatMessage(messages.settingUpPlexDescription, {
|
||||
RegisterPlexTVLink: function RegisterPlexTVLink(msg) {
|
||||
return (
|
||||
<a
|
||||
href="https://plex.tv"
|
||||
className="text-indigo-100 hover:text-white hover:underline"
|
||||
className="text-white transition duration-300 hover:underline"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
@@ -283,7 +280,8 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
);
|
||||
},
|
||||
})}
|
||||
</Alert>
|
||||
type="info"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Formik
|
||||
@@ -314,7 +312,6 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
} as PlexSettings);
|
||||
|
||||
revalidate();
|
||||
setSubmitError(null);
|
||||
if (toastId) {
|
||||
removeToast(toastId);
|
||||
}
|
||||
@@ -333,7 +330,6 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
autoDismiss: true,
|
||||
appearance: 'error',
|
||||
});
|
||||
setSubmitError(e.response.data.message);
|
||||
}
|
||||
}}
|
||||
>
|
||||
@@ -513,18 +509,6 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{submitError && (
|
||||
<div className="mt-6 sm:gap-4 sm:items-start">
|
||||
<Alert
|
||||
title={intl.formatMessage(
|
||||
messages.toastPlexConnectingFailure
|
||||
)}
|
||||
type="error"
|
||||
>
|
||||
{submitError}
|
||||
</Alert>
|
||||
</div>
|
||||
)}
|
||||
<div className="actions">
|
||||
<div className="flex justify-end">
|
||||
<span className="inline-flex ml-3 rounded-md shadow-sm">
|
||||
|
Reference in New Issue
Block a user