diff --git a/web/src/components/inputs/text.tsx b/web/src/components/inputs/text.tsx index 754624f..ff91b48 100644 --- a/web/src/components/inputs/text.tsx +++ b/web/src/components/inputs/text.tsx @@ -4,6 +4,7 @@ import { classNames, get } from "../../utils"; import { useToggle } from "../../hooks/hooks"; import { EyeIcon, EyeSlashIcon } from "@heroicons/react/24/solid"; import { ErrorMessage } from "@hookform/error-message"; +import type { FieldValues } from "react-hook-form"; export type FormErrorMessageProps = { className?: string; @@ -81,7 +82,7 @@ export const Input: FC = forwardRef( export type FormInputProps = { name: Path; rules?: RegisterOptions; - register?: UseFormRegister; + register?: UseFormRegister; errors?: Partial>; } & Omit; diff --git a/web/src/components/panels/index.tsx b/web/src/components/panels/index.tsx index 442aea2..ee86e5a 100644 --- a/web/src/components/panels/index.tsx +++ b/web/src/components/panels/index.tsx @@ -1,26 +1,27 @@ -import React, {Fragment, useRef} from "react"; -import {XMarkIcon} from "@heroicons/react/24/solid"; -import {Dialog, Transition} from "@headlessui/react"; -import {Form, Formik} from "formik"; +import React, { Fragment, useRef } from "react"; +import { XMarkIcon } from "@heroicons/react/24/solid"; +import { Dialog, Transition } from "@headlessui/react"; +import { Form, Formik } from "formik"; +import type { FormikValues } from "formik"; import DEBUG from "../debug"; -import {useToggle} from "../../hooks/hooks"; -import {DeleteModal} from "../modals"; -import {classNames} from "../../utils"; +import { useToggle } from "../../hooks/hooks"; +import { DeleteModal } from "../modals"; +import { classNames } from "../../utils"; interface SlideOverProps { - title: string; - initialValues: DataType; - validate?: (values: DataType) => void; - onSubmit: (values?: DataType) => void; - isOpen: boolean; - toggle: () => void; - children?: (values: DataType) => React.ReactNode; - deleteAction?: () => void; - type: "CREATE" | "UPDATE"; - testFn?: (data: unknown) => void; - isTesting?: boolean; - isTestSuccessful?: boolean; - isTestError?: boolean; + title: string; + initialValues: FormikValues & DataType; + validate?: (values: DataType) => void; + onSubmit: (values?: DataType) => void; + isOpen: boolean; + toggle: () => void; + children?: (values: DataType) => React.ReactNode; + deleteAction?: () => void; + type: "CREATE" | "UPDATE"; + testFn?: (data: unknown) => void; + isTesting?: boolean; + isTestSuccessful?: boolean; + isTestError?: boolean; } function SlideOver({ @@ -81,7 +82,7 @@ function SlideOver({ onSubmit={onSubmit} validate={validate} > - {({ handleSubmit, values }) => ( + {({ handleSubmit, values }) => (
diff --git a/web/src/forms/settings/FeedForms.tsx b/web/src/forms/settings/FeedForms.tsx index 80af371..4698d8d 100644 --- a/web/src/forms/settings/FeedForms.tsx +++ b/web/src/forms/settings/FeedForms.tsx @@ -16,6 +16,17 @@ interface UpdateProps { feed: Feed; } +interface InitialValues { + id: number; + indexer: string; + enabled: boolean; + type: FeedType; + name: string; + url: string; + api_key: string; + interval: number; +} + export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { const [isTesting, setIsTesting] = useState(false); const [isTestSuccessful, setIsSuccessfulTest] = useState(false); @@ -26,7 +37,7 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { { onSuccess: () => { queryClient.invalidateQueries(["feeds"]); - toast.custom((t) => ); + toast.custom((t) => ); toggle(); } } @@ -41,12 +52,11 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { { onSuccess: () => { queryClient.invalidateQueries(["feeds"]); - toast.custom((t) => ); + toast.custom((t) => ); } } ); - const deleteAction = () => { deleteMutation.mutate(feed.id); }; @@ -85,7 +95,7 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { testFeedMutation.mutate(data as Feed); }; - const initialValues = { + const initialValues: InitialValues = { id: feed.id, indexer: feed.indexer, enabled: feed.enabled, @@ -97,7 +107,7 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { }; return ( - type="UPDATE" title="Feed" isOpen={isOpen} @@ -112,7 +122,7 @@ export function FeedUpdateForm({ isOpen, toggle, feed }: UpdateProps) { > {(values) => (
- +
- +
{componentMap[values.type]} @@ -150,10 +160,10 @@ function FormFieldsTorznab() { help="Torznab url" /> - + + help="Minutes. Recommended 15-30. Too low and risk ban." />
); } @@ -167,12 +177,12 @@ function FormFieldsRSS() { help="RSS url" /> - +
); } const componentMap: componentMapType = { - TORZNAB: , + TORZNAB: , RSS: }; diff --git a/web/src/forms/settings/NotificationForms.tsx b/web/src/forms/settings/NotificationForms.tsx index 0bb1e5a..94bc113 100644 --- a/web/src/forms/settings/NotificationForms.tsx +++ b/web/src/forms/settings/NotificationForms.tsx @@ -394,6 +394,18 @@ interface UpdateProps { notification: Notification; } +interface InitialValues { + id: number; + enabled: boolean; + type: NotificationType; + name: string; + webhook?: string; + token?: string; + api_key?: string; + channel?: string; + events: NotificationEvent[]; +} + export function NotificationUpdateForm({ isOpen, toggle, notification }: UpdateProps) { const mutation = useMutation( (notification: Notification) => APIClient.notifications.update(notification), @@ -437,7 +449,7 @@ export function NotificationUpdateForm({ isOpen, toggle, notification }: UpdateP testMutation.mutate(data as Notification); }; - const initialValues = { + const initialValues: InitialValues = { id: notification.id, enabled: notification.enabled, type: notification.type, @@ -450,7 +462,7 @@ export function NotificationUpdateForm({ isOpen, toggle, notification }: UpdateP }; return ( - type="UPDATE" title="Notification" isOpen={isOpen} diff --git a/web/src/screens/Base.tsx b/web/src/screens/Base.tsx index 1667f57..d80adbe 100644 --- a/web/src/screens/Base.tsx +++ b/web/src/screens/Base.tsx @@ -62,6 +62,7 @@ export default function Base() { "transition-colors duration-200", isActive ? "text-black dark:text-gray-50 font-bold" : "text-gray-600 dark:text-gray-500" )} + end={item.path === "/"} > {item.name}