mirror of
https://github.com/sct/overseerr.git
synced 2025-09-17 17:24:35 +02:00
fix(frontend): new radarr/sonarr ports will be converted to a number before posting
This commit is contained in:
sct
@@ -63,126 +63,122 @@ const Modal: React.FC<ModalProps> = ({
|
|||||||
});
|
});
|
||||||
useLockBodyScroll(true, disableScrollLock);
|
useLockBodyScroll(true, disableScrollLock);
|
||||||
|
|
||||||
return (
|
return ReactDOM.createPortal(
|
||||||
<>
|
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
||||||
{ReactDOM.createPortal(
|
<div
|
||||||
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
className="fixed top-0 left-0 right-0 bottom-0 bg-gray-800 bg-opacity-50 w-full h-full z-50 flex justify-center items-center"
|
||||||
|
onKeyDown={(e) => {
|
||||||
|
if (e.key === 'Escape') {
|
||||||
|
typeof onCancel === 'function' && backgroundClickable
|
||||||
|
? onCancel()
|
||||||
|
: undefined;
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Transition
|
||||||
|
enter="transition opacity-0 duration-300 transform scale-75"
|
||||||
|
enterFrom="opacity-0 scale-75"
|
||||||
|
enterTo="opacity-100 scale-100"
|
||||||
|
leave="transition opacity-100 duration-300"
|
||||||
|
leaveFrom="opacity-100"
|
||||||
|
leaveTo="opacity-0"
|
||||||
|
show={loading}
|
||||||
|
>
|
||||||
|
<div style={{ position: 'absolute' }}>
|
||||||
|
<LoadingSpinner />
|
||||||
|
</div>
|
||||||
|
</Transition>
|
||||||
|
<Transition
|
||||||
|
enter="transition opacity-0 duration-300 transform scale-75"
|
||||||
|
enterFrom="opacity-0 scale-75"
|
||||||
|
enterTo="opacity-100 scale-100"
|
||||||
|
leave="transition opacity-100 duration-300"
|
||||||
|
leaveFrom="opacity-100"
|
||||||
|
leaveTo="opacity-0"
|
||||||
|
show={!loading}
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
className="fixed top-0 left-0 right-0 bottom-0 bg-gray-800 bg-opacity-50 w-full h-full z-50 flex justify-center items-center"
|
className="inline-block align-bottom bg-gray-700 sm:rounded-lg px-4 pt-5 pb-4 text-left overflow-auto shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-3xl w-full sm:p-6 max-h-full"
|
||||||
onKeyDown={(e) => {
|
role="dialog"
|
||||||
if (e.key === 'Escape') {
|
aria-modal="true"
|
||||||
typeof onCancel === 'function' && backgroundClickable
|
aria-labelledby="modal-headline"
|
||||||
? onCancel()
|
ref={modalRef}
|
||||||
: undefined;
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
<Transition
|
<div className="sm:flex sm:items-center">
|
||||||
enter="transition opacity-0 duration-300 transform scale-75"
|
{iconSvg && (
|
||||||
enterFrom="opacity-0 scale-75"
|
<div className="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-gray-600 text-white sm:mx-0 sm:h-10 sm:w-10">
|
||||||
enterTo="opacity-100 scale-100"
|
{iconSvg}
|
||||||
leave="transition opacity-100 duration-300"
|
|
||||||
leaveFrom="opacity-100"
|
|
||||||
leaveTo="opacity-0"
|
|
||||||
show={loading}
|
|
||||||
>
|
|
||||||
<div style={{ position: 'absolute' }}>
|
|
||||||
<LoadingSpinner />
|
|
||||||
</div>
|
|
||||||
</Transition>
|
|
||||||
<Transition
|
|
||||||
enter="transition opacity-0 duration-300 transform scale-75"
|
|
||||||
enterFrom="opacity-0 scale-75"
|
|
||||||
enterTo="opacity-100 scale-100"
|
|
||||||
leave="transition opacity-100 duration-300"
|
|
||||||
leaveFrom="opacity-100"
|
|
||||||
leaveTo="opacity-0"
|
|
||||||
show={!loading}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className="inline-block align-bottom bg-gray-700 sm:rounded-lg px-4 pt-5 pb-4 text-left overflow-auto shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-3xl w-full sm:p-6 max-h-full"
|
|
||||||
role="dialog"
|
|
||||||
aria-modal="true"
|
|
||||||
aria-labelledby="modal-headline"
|
|
||||||
ref={modalRef}
|
|
||||||
>
|
|
||||||
<div className="sm:flex sm:items-center">
|
|
||||||
{iconSvg && (
|
|
||||||
<div className="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-gray-600 text-white sm:mx-0 sm:h-10 sm:w-10">
|
|
||||||
{iconSvg}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div
|
|
||||||
className={`mt-3 text-center sm:mt-0 sm:text-left ${
|
|
||||||
iconSvg ? 'sm:ml-4' : 'mb-6'
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
{title && (
|
|
||||||
<h3
|
|
||||||
className="text-lg leading-6 font-medium text-white"
|
|
||||||
id="modal-headline"
|
|
||||||
>
|
|
||||||
{title}
|
|
||||||
</h3>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{children && (
|
)}
|
||||||
<div className="mt-4 text-sm leading-5 text-gray-300">
|
<div
|
||||||
{children}
|
className={`mt-3 text-center sm:mt-0 sm:text-left ${
|
||||||
</div>
|
iconSvg ? 'sm:ml-4' : 'mb-6'
|
||||||
)}
|
}`}
|
||||||
{(onCancel || onOk || onSecondary || onTertiary) && (
|
>
|
||||||
<div className="mt-5 sm:mt-4 flex justify-center sm:justify-start flex-row-reverse">
|
{title && (
|
||||||
{typeof onOk === 'function' && (
|
<h3
|
||||||
<Button
|
className="text-lg leading-6 font-medium text-white"
|
||||||
buttonType={okButtonType}
|
id="modal-headline"
|
||||||
onClick={onOk}
|
>
|
||||||
className="ml-3"
|
{title}
|
||||||
disabled={okDisabled}
|
</h3>
|
||||||
>
|
|
||||||
{okText ? okText : 'Ok'}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{typeof onSecondary === 'function' && secondaryText && (
|
|
||||||
<Button
|
|
||||||
buttonType={secondaryButtonType}
|
|
||||||
onClick={onSecondary}
|
|
||||||
className="ml-3"
|
|
||||||
disabled={secondaryDisabled}
|
|
||||||
>
|
|
||||||
{secondaryText}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{typeof onTertiary === 'function' && tertiaryText && (
|
|
||||||
<Button
|
|
||||||
buttonType={tertiaryButtonType}
|
|
||||||
onClick={onTertiary}
|
|
||||||
className="ml-3"
|
|
||||||
disabled={tertiaryDisabled}
|
|
||||||
>
|
|
||||||
{tertiaryText}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{typeof onCancel === 'function' && (
|
|
||||||
<Button
|
|
||||||
buttonType={cancelButtonType}
|
|
||||||
onClick={onCancel}
|
|
||||||
className="ml-3 sm:ml-0 sm:px-4"
|
|
||||||
>
|
|
||||||
{cancelText
|
|
||||||
? cancelText
|
|
||||||
: intl.formatMessage(globalMessages.cancel)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</Transition>
|
</div>
|
||||||
</div>,
|
{children && (
|
||||||
document.body
|
<div className="mt-4 text-sm leading-5 text-gray-300">
|
||||||
)}
|
{children}
|
||||||
</>
|
</div>
|
||||||
|
)}
|
||||||
|
{(onCancel || onOk || onSecondary || onTertiary) && (
|
||||||
|
<div className="mt-5 sm:mt-4 flex justify-center sm:justify-start flex-row-reverse">
|
||||||
|
{typeof onOk === 'function' && (
|
||||||
|
<Button
|
||||||
|
buttonType={okButtonType}
|
||||||
|
onClick={onOk}
|
||||||
|
className="ml-3"
|
||||||
|
disabled={okDisabled}
|
||||||
|
>
|
||||||
|
{okText ? okText : 'Ok'}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
{typeof onSecondary === 'function' && secondaryText && (
|
||||||
|
<Button
|
||||||
|
buttonType={secondaryButtonType}
|
||||||
|
onClick={onSecondary}
|
||||||
|
className="ml-3"
|
||||||
|
disabled={secondaryDisabled}
|
||||||
|
>
|
||||||
|
{secondaryText}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
{typeof onTertiary === 'function' && tertiaryText && (
|
||||||
|
<Button
|
||||||
|
buttonType={tertiaryButtonType}
|
||||||
|
onClick={onTertiary}
|
||||||
|
className="ml-3"
|
||||||
|
disabled={tertiaryDisabled}
|
||||||
|
>
|
||||||
|
{tertiaryText}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
{typeof onCancel === 'function' && (
|
||||||
|
<Button
|
||||||
|
buttonType={cancelButtonType}
|
||||||
|
onClick={onCancel}
|
||||||
|
className="ml-3 sm:ml-0 sm:px-4"
|
||||||
|
>
|
||||||
|
{cancelText
|
||||||
|
? cancelText
|
||||||
|
: intl.formatMessage(globalMessages.cancel)}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</Transition>
|
||||||
|
</div>,
|
||||||
|
document.body
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -108,7 +108,7 @@ const RadarrModal: React.FC<RadarrModalProps> = ({
|
|||||||
{
|
{
|
||||||
hostname,
|
hostname,
|
||||||
apiKey,
|
apiKey,
|
||||||
port,
|
port: Number(port),
|
||||||
baseUrl,
|
baseUrl,
|
||||||
useSsl,
|
useSsl,
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ const SonarrModal: React.FC<SonarrModalProps> = ({
|
|||||||
{
|
{
|
||||||
hostname,
|
hostname,
|
||||||
apiKey,
|
apiKey,
|
||||||
port,
|
port: Number(port),
|
||||||
baseUrl,
|
baseUrl,
|
||||||
useSsl,
|
useSsl,
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -15,7 +15,7 @@ const useClickOutside = (
|
|||||||
): void => {
|
): void => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleBodyClick = (e: MouseEvent) => {
|
const handleBodyClick = (e: MouseEvent) => {
|
||||||
if (!ref.current?.contains(e.target as Node)) {
|
if (ref.current && !ref.current.contains(e.target as Node)) {
|
||||||
callback(e);
|
callback(e);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user