mirror of
https://github.com/idanoo/autobrr
synced 2025-07-23 08:49:13 +00:00
feat(feeds): add force run (#1243)
* feat(feeds): add force run * fix: simplify ForceRun * add confirmation modal * handle errors by using the test func * require user input to run * make sure to reschedule next job after forcerun * refactor modal centering with grid * refactor: Simplify startJob and forceRun logic - Refactor `startJob` to accept a `runImmediately` flag. This flag controls whether the job should be run immediately or scheduled for later. This change simplifies the `ForceRun` function by allowing it to call `startJob` with `runImmediately` set to `true`. - Remove redundant checks in `ForceRun` related to feed type. These checks are handled in `startJob`. BREAKING CHANGE: The `startJob` function now requires a second argument, `runImmediately`. This change affects all calls to `startJob`. * fix(web) Invalidate queries after forceRun * refactor(feeds): init and test run --------- Co-authored-by: ze0s <43699394+zze0s@users.noreply.github.com>
This commit is contained in:
soup
GitHub
parent
ff70a341ad
commit
2bd1a68a94
10 changed files with 318 additions and 38 deletions
|
|
@ -224,6 +224,7 @@ export const APIClient = {
|
|||
update: (feed: Feed) => appClient.Put(`api/feeds/${feed.id}`, {
|
||||
body: feed
|
||||
}),
|
||||
forceRun: (id: number) => appClient.Post(`api/feeds/${id}/forcerun`),
|
||||
delete: (id: number) => appClient.Delete(`api/feeds/${id}`),
|
||||
deleteCache: (id: number) => appClient.Delete(`api/feeds/${id}/cache`),
|
||||
test: (feed: Feed) => appClient.Post("api/feeds/test", {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@
|
|||
* SPDX-License-Identifier: GPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import { FC, Fragment, MutableRefObject } from "react";
|
||||
|
||||
import { FC, Fragment, MutableRefObject, useState } from "react";
|
||||
import { Dialog, Transition } from "@headlessui/react";
|
||||
import { ExclamationTriangleIcon } from "@heroicons/react/24/solid";
|
||||
|
||||
|
|
@ -18,13 +19,24 @@ interface ModalLowerProps {
|
|||
isOpen: boolean;
|
||||
isLoading: boolean;
|
||||
toggle: () => void;
|
||||
deleteAction: () => void;
|
||||
deleteAction?: () => void;
|
||||
forceRunAction?: () => void;
|
||||
}
|
||||
|
||||
interface DeleteModalProps extends ModalUpperProps, ModalLowerProps {
|
||||
buttonRef: MutableRefObject<HTMLElement | null> | undefined;
|
||||
}
|
||||
|
||||
interface ForceRunModalProps {
|
||||
isOpen: boolean;
|
||||
isLoading: boolean;
|
||||
toggle: () => void;
|
||||
buttonRef: MutableRefObject<HTMLElement | null> | undefined;
|
||||
forceRunAction: () => void;
|
||||
title: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
const ModalUpper = ({ title, text }: ModalUpperProps) => (
|
||||
<div className="bg-white dark:bg-gray-800 px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div className="sm:flex sm:items-start">
|
||||
|
|
@ -55,7 +67,7 @@ const ModalLower = ({ isOpen, isLoading, toggle, deleteAction }: ModalLowerProps
|
|||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
if (isOpen) {
|
||||
deleteAction();
|
||||
deleteAction?.();
|
||||
toggle();
|
||||
}
|
||||
}}
|
||||
|
|
@ -121,3 +133,116 @@ export const DeleteModal: FC<DeleteModalProps> = (props: DeleteModalProps) => (
|
|||
</Dialog>
|
||||
</Transition.Root>
|
||||
);
|
||||
|
||||
export const ForceRunModal: FC<ForceRunModalProps> = (props: ForceRunModalProps) => {
|
||||
const [inputValue, setInputValue] = useState("");
|
||||
const isInputCorrect = inputValue.trim().toLowerCase() === "i understand";
|
||||
|
||||
// A function to reset the input and handle any necessary cleanup
|
||||
const resetAndClose = () => {
|
||||
setInputValue("");
|
||||
props.toggle();
|
||||
};
|
||||
|
||||
// The handleClose function will be passed to the onClose prop of the Dialog
|
||||
const handleClose = () => {
|
||||
setTimeout(() => {
|
||||
resetAndClose();
|
||||
}, 200);
|
||||
};
|
||||
|
||||
const handleForceRun = (e: React.MouseEvent<HTMLButtonElement>) => {
|
||||
e.preventDefault();
|
||||
if (props.isOpen && isInputCorrect) {
|
||||
props.forceRunAction();
|
||||
props.toggle();
|
||||
// Delay the reset of the input until after the transition finishes
|
||||
setTimeout(() => {
|
||||
setInputValue("");
|
||||
}, 400);
|
||||
}
|
||||
};
|
||||
|
||||
// When the 'Cancel' button is clicked
|
||||
const handleCancel = (e: React.MouseEvent<HTMLButtonElement>) => {
|
||||
e.preventDefault();
|
||||
resetAndClose();
|
||||
};
|
||||
|
||||
return (
|
||||
<Transition.Root show={props.isOpen} as={Fragment}>
|
||||
<Dialog
|
||||
as="div"
|
||||
static
|
||||
className="fixed z-10 inset-0 overflow-y-auto"
|
||||
initialFocus={props.buttonRef}
|
||||
open={props.isOpen}
|
||||
onClose={handleClose}
|
||||
>
|
||||
<div className="grid place-items-center min-h-screen">
|
||||
<Transition.Child
|
||||
as={Fragment}
|
||||
enter="ease-out duration-300"
|
||||
enterFrom="opacity-0"
|
||||
enterTo="opacity-100"
|
||||
leave="ease-in duration-200"
|
||||
leaveFrom="opacity-100"
|
||||
leaveTo="opacity-0"
|
||||
>
|
||||
<Dialog.Overlay className="fixed inset-0 bg-gray-700/60 dark:bg-black/60 transition-opacity" />
|
||||
</Transition.Child>
|
||||
|
||||
<Transition.Child
|
||||
as={Fragment}
|
||||
enter="ease-out duration-300"
|
||||
enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
||||
enterTo="opacity-100 translate-y-0 sm:scale-100"
|
||||
leave="ease-in duration-200"
|
||||
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
|
||||
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
||||
>
|
||||
<div className="inline-block align-bottom border border-transparent dark:border-gray-700 rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
|
||||
<ModalUpper title={props.title} text={props.text} />
|
||||
|
||||
<div className="bg-gray-50 dark:bg-gray-800 px-4 py-3 sm:px-6 flex justify-center">
|
||||
<input
|
||||
type="text"
|
||||
className="w-96 shadow-sm sm:text-sm rounded-md border py-2.5 focus:ring-blue-500 dark:focus:ring-blue-500 focus:border-blue-500 dark:focus:border-blue-500 border-gray-400 dark:border-gray-700 bg-gray-100 dark:bg-gray-900 dark:text-gray-100"
|
||||
placeholder="Type 'I understand' to enable the button"
|
||||
value={inputValue}
|
||||
onChange={(e) => setInputValue(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-50 dark:bg-gray-800 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
{props.isLoading ? (
|
||||
<SectionLoader $size="small" />
|
||||
) : (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
disabled={!isInputCorrect}
|
||||
className={`w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 ${
|
||||
isInputCorrect ? "bg-red-600 text-white hover:bg-red-700" : "bg-gray-300"
|
||||
} text-base font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm`}
|
||||
onClick={handleForceRun}
|
||||
>
|
||||
Force Run
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 dark:border-gray-600 shadow-sm px-4 py-2 bg-white dark:bg-gray-700 text-base font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 dark:focus:ring-blue-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
onClick={handleCancel}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</Transition.Child>
|
||||
</div>
|
||||
</Dialog>
|
||||
</Transition.Root>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -141,7 +141,7 @@ function SlideOver<DataType extends FormikValues>({
|
|||
Remove
|
||||
</button>
|
||||
)}
|
||||
<div>
|
||||
<div className="flex">
|
||||
{!!values && extraButtons !== undefined && (
|
||||
extraButtons(values)
|
||||
)}
|
||||
|
|
@ -154,7 +154,7 @@ function SlideOver<DataType extends FormikValues>({
|
|||
? "text-green-500 border-green-500 bg-green-50"
|
||||
: isTestError
|
||||
? "text-red-500 border-red-500 bg-red-50"
|
||||
: "border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-400 bg-white dark:bg-gray-700 hover:bg-gray-50 focus:border-rose-700 active:bg-rose-700",
|
||||
: "border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600 focus:border-rose-700 active:bg-rose-700",
|
||||
isTesting ? "cursor-not-allowed" : "",
|
||||
"mr-2 inline-flex items-center px-4 py-2 border font-medium rounded-md shadow-sm text-sm transition ease-in-out duration-150 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 dark:focus:ring-blue-500"
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -78,6 +78,8 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) {
|
|||
setIsSuccessfulTest(false);
|
||||
},
|
||||
onSuccess: () => {
|
||||
toast.custom((t) => <Toast type="success" body={`${feed.name} test OK!`} t={t} />);
|
||||
|
||||
sleep(1000)
|
||||
.then(() => {
|
||||
setIsTesting(false);
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ import {
|
|||
DocumentTextIcon,
|
||||
EllipsisHorizontalIcon,
|
||||
PencilSquareIcon,
|
||||
ForwardIcon,
|
||||
TrashIcon
|
||||
} from "@heroicons/react/24/outline";
|
||||
|
||||
|
|
@ -19,7 +20,7 @@ import { APIClient } from "@api/APIClient";
|
|||
import { useToggle } from "@hooks/hooks";
|
||||
import { baseUrl, classNames, IsEmptyDate, simplifyDate } from "@utils";
|
||||
import Toast from "@components/notifications/Toast";
|
||||
import { DeleteModal } from "@components/modals";
|
||||
import { DeleteModal, ForceRunModal } from "@components/modals";
|
||||
import { FeedUpdateForm } from "@forms/settings/FeedForms";
|
||||
import { EmptySimple } from "@components/emptystates";
|
||||
import { ImplementationBadges } from "./Indexer";
|
||||
|
|
@ -230,6 +231,7 @@ const FeedItemDropdown = ({
|
|||
|
||||
const [deleteModalIsOpen, toggleDeleteModal] = useToggle(false);
|
||||
const [deleteCacheModalIsOpen, toggleDeleteCacheModal] = useToggle(false);
|
||||
const [forceRunModalIsOpen, toggleForceRunModal] = useToggle(false);
|
||||
|
||||
const deleteMutation = useMutation({
|
||||
mutationFn: (id: number) => APIClient.feeds.delete(id),
|
||||
|
|
@ -248,6 +250,22 @@ const FeedItemDropdown = ({
|
|||
}
|
||||
});
|
||||
|
||||
const forceRunMutation = useMutation({
|
||||
mutationFn: (id: number) => APIClient.feeds.forceRun(id),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: feedKeys.lists() });
|
||||
toast.custom((t) => <Toast type="success" body={`Feed ${feed?.name} was force run successfully.`} t={t} />);
|
||||
toggleForceRunModal();
|
||||
},
|
||||
onError: (error: any) => {
|
||||
toast.custom((t) => <Toast type="error" body={`Failed to force run ${feed?.name}. Error: ${error.message}`} t={t} />, {
|
||||
duration: 10000
|
||||
});
|
||||
toggleForceRunModal();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
return (
|
||||
<Menu as="div">
|
||||
<DeleteModal
|
||||
|
|
@ -273,6 +291,18 @@ const FeedItemDropdown = ({
|
|||
title={`Remove feed cache: ${feed.name}`}
|
||||
text="Are you sure you want to remove the feed cache? This action cannot be undone."
|
||||
/>
|
||||
<ForceRunModal
|
||||
isOpen={forceRunModalIsOpen}
|
||||
isLoading={forceRunMutation.isLoading}
|
||||
toggle={toggleForceRunModal}
|
||||
buttonRef={cancelModalButtonRef}
|
||||
forceRunAction={() => {
|
||||
forceRunMutation.mutate(feed.id);
|
||||
toggleForceRunModal();
|
||||
}}
|
||||
title={`Force run feed: ${feed.name}`}
|
||||
text={`Are you sure you want to force run the ${feed.name} feed? Respecting RSS interval rules is crucial to avoid potential IP bans.`}
|
||||
/>
|
||||
<Menu.Button className="px-4 py-2">
|
||||
<EllipsisHorizontalIcon
|
||||
className="w-5 h-5 text-gray-700 hover:text-gray-900 dark:text-gray-100 dark:hover:text-gray-400"
|
||||
|
|
@ -334,6 +364,26 @@ const FeedItemDropdown = ({
|
|||
</Menu.Item>
|
||||
</div>
|
||||
<div className="px-1 py-1">
|
||||
<Menu.Item>
|
||||
{({ active }) => (
|
||||
<button
|
||||
onClick={() => toggleForceRunModal()}
|
||||
className={classNames(
|
||||
active ? "bg-blue-600 text-white" : "text-gray-900 dark:text-gray-300",
|
||||
"font-medium group flex rounded-md items-center w-full px-2 py-2 text-sm"
|
||||
)}
|
||||
>
|
||||
<ForwardIcon
|
||||
className={classNames(
|
||||
active ? "text-white" : "text-blue-500",
|
||||
"w-5 h-5 mr-2"
|
||||
)}
|
||||
aria-hidden="true"
|
||||
/>
|
||||
Force run
|
||||
</button>
|
||||
)}
|
||||
</Menu.Item>
|
||||
<Menu.Item>
|
||||
<ExternalLink
|
||||
href={`${baseUrl()}api/feeds/${feed.id}/latest`}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue