fix: filter list toggle (#55)

This commit is contained in:
Ludvig Lundgren 2021-12-27 16:10:15 +01:00 committed by GitHub
parent e1ef47e09a
commit 48155e5f82
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 73 additions and 2 deletions

View file

@ -90,6 +90,7 @@ const APIClient = {
getByID: (id: number) => appClient.Get(`api/filters/${id}`),
create: (filter: Filter) => appClient.Post(`api/filters`, filter),
update: (filter: Filter) => appClient.Put(`api/filters/${filter.id}`, filter),
toggleEnable: (id: number, enabled: boolean) => appClient.Put(`api/filters/${id}/enabled`, { enabled }),
delete: (id: number) => appClient.Delete(`api/filters/${id}`),
},
indexers: {

View file

@ -7,10 +7,13 @@ import {
} from "react-router-dom";
import { Filter } from "../../domain/interfaces";
import { useToggle } from "../../hooks/hooks";
import { useQuery } from "react-query";
import { useMutation, useQuery } from "react-query";
import { classNames } from "../../utils";
import { FilterAddForm } from "../../forms";
import APIClient from "../../api/APIClient";
import Toast from "../../components/notifications/Toast";
import toast from "react-hot-toast";
import { queryClient } from "../../App";
export default function Filters() {
const [createFilterIsOpen, toggleCreateFilter] = useToggle(false)
@ -116,10 +119,18 @@ interface FilterListItemProps {
function FilterListItem({ filter, idx }: FilterListItemProps) {
const [enabled, setEnabled] = useState(filter.enabled)
const updateMutation = useMutation((status: boolean) => APIClient.filters.toggleEnable(filter.id, status), {
onSuccess: () => {
toast.custom((t) => <Toast type="success" body={`${filter.name} was ${enabled ? "disabled" : "enabled"} successfully`} t={t} />)
queryClient.invalidateQueries("filter");
}
})
const toggleActive = (status: boolean) => {
console.log(status)
setEnabled(status)
// call api
updateMutation.mutate(status)
}
return (