upgrade react-query to v5

This commit is contained in:
h z
2025-05-09 00:44:53 +01:00
parent 87b4246a9b
commit 101666d26d
20 changed files with 507 additions and 478 deletions

View File

@@ -5,7 +5,7 @@ FRONTEND_HOST="${FRONTEND_HOST:-http://localhost:80}"
KC_CLIENT_ID="${KC_CLIENT_ID:-labdev}"
KC_HOST="${KC_HOST:-https://login.hangman-lab.top}"
KC_REALM="${KC_REALM:-Hangman-Lab}"
DEBUG="${DEBUG:false}"
rm -f /usr/share/nginx/html/config.js
@@ -24,7 +24,8 @@ cat <<EOL > /usr/share/nginx/html/config.json
"scope": "openid profile email roles",
"popup_redirect_uri": "${FRONTEND_HOST}/popup_callback",
"silent_redirect_uri": "${FRONTEND_HOST}/silent_callback"
}
},
"DEBUG": ${DEBUG}
}
EOL

57
package-lock.json generated
View File

@@ -10,7 +10,8 @@
"license": "ISC",
"dependencies": {
"@reduxjs/toolkit": "^2.7.0",
"@tanstack/react-query": "^4.36.1",
"@tanstack/react-query": "^5.75.5",
"@tanstack/react-query-devtools": "^5.75.5",
"assert": "^2.1.0",
"axios": "^1.7.9",
"bulma": "^1.0.2",
@@ -2712,38 +2713,56 @@
"integrity": "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g=="
},
"node_modules/@tanstack/query-core": {
"version": "4.36.1",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.36.1.tgz",
"integrity": "sha512-DJSilV5+ytBP1FbFcEJovv4rnnm/CokuVvrBEtW/Va9DvuJ3HksbXUJEpI0aV1KtuL4ZoO9AVE6PyNLzF7tLeA==",
"version": "5.75.5",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.75.5.tgz",
"integrity": "sha512-kPDOxtoMn2Ycycb76Givx2fi+2pzo98F9ifHL/NFiahEDpDwSVW6o12PRuQ0lQnBOunhRG5etatAhQij91M3MQ==",
"license": "MIT",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"node_modules/@tanstack/query-devtools": {
"version": "5.74.7",
"resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.74.7.tgz",
"integrity": "sha512-nSNlfuGdnHf4yB0S+BoNYOE1o3oAH093weAYZolIHfS2stulyA/gWfSk/9H4ZFk5mAAHb5vNqAeJOmbdcGPEQw==",
"license": "MIT",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"node_modules/@tanstack/react-query": {
"version": "4.36.1",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.36.1.tgz",
"integrity": "sha512-y7ySVHFyyQblPl3J3eQBWpXZkliroki3ARnBKsdJchlgt7yJLRDUcf4B8soufgiYt3pEQIkBWBx1N9/ZPIeUWw==",
"version": "5.75.5",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.75.5.tgz",
"integrity": "sha512-QrLCJe40BgBVlWdAdf2ZEVJ0cISOuEy/HKupId1aTKU6gPJZVhSvZpH+Si7csRflCJphzlQ77Yx6gUxGW9o0XQ==",
"license": "MIT",
"dependencies": {
"@tanstack/query-core": "4.36.1",
"use-sync-external-store": "^1.2.0"
"@tanstack/query-core": "5.75.5"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react-native": "*"
"react": "^18 || ^19"
}
},
"node_modules/@tanstack/react-query-devtools": {
"version": "5.75.5",
"resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.75.5.tgz",
"integrity": "sha512-S31U00nJOQIbxydRH1kOwdLRaLBrda8O5QjzmgkRg60UZzPGdbI6+873Qa0YGUfPeILDbR2ukgWyg7CJQPy4iA==",
"license": "MIT",
"dependencies": {
"@tanstack/query-devtools": "5.74.7"
},
"peerDependenciesMeta": {
"react-dom": {
"optional": true
},
"react-native": {
"optional": true
}
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"@tanstack/react-query": "^5.75.5",
"react": "^18 || ^19"
}
},
"node_modules/@testing-library/dom": {

View File

@@ -13,7 +13,8 @@
"license": "ISC",
"dependencies": {
"@reduxjs/toolkit": "^2.7.0",
"@tanstack/react-query": "^4.36.1",
"@tanstack/react-query": "^5.75.5",
"@tanstack/react-query-devtools": "^5.75.5",
"assert": "^2.1.0",
"axios": "^1.7.9",
"bulma": "^1.0.2",

View File

@@ -29,15 +29,15 @@ const App = () => {
element={<Navigate to = "/markdown/1"/>}
/>
<Route path="/testx" element={<h2>test2</h2>}/>
<Route path="/markdown/:id" element={<MarkdownContent />} />
<Route path="/markdown/:strId" element={<MarkdownContent />} />
<Route path="/callback" element={<Callback />} />
<Route path="/test" element={<h1>TEST</h1>}></Route>
<Route path="/markdown/create" element={<MarkdownEditor />} />
<Route path="/markdown/edit/:id" element={<MarkdownEditor />} />
<Route path="/markdown/edit/:strId" element={<MarkdownEditor />} />
<Route path="/popup_callback" element={<PopupCallback />} />
<Route path="/silent_callback" element={<SilentCallback />} />
<Route path="/template/create" element={<MarkdownTemplateEditor />} />
<Route path="/template/edit/:id" element={<MarkdownTemplateEditor />} />
<Route path="/template/edit/:strId" element={<MarkdownTemplateEditor />} />
</Routes>
</main>
</div>

View File

@@ -0,0 +1,14 @@
import React from "react";
import {useConfig} from "../../ConfigProvider";
import {ReactQueryDevtools} from "@tanstack/react-query-devtools";
export const ControlledReactQueryDevtools = () => {
const config = useConfig();
if(config.DEBUG)
return (<ReactQueryDevtools />);
return (<></>);
};
export default ControlledReactQueryDevtools;

View File

@@ -10,7 +10,8 @@ const MarkdownTemplateEditor = () => {
const navigate = useNavigate();
const { id } = useParams();
const { strId } = useParams();
const id = Number(strId);
const { data: template, isFetching: templateIsFetching } = useMarkdownTemplate(id);
const saveMarkdownTemplate = useSaveMarkdownTemplate();

View File

@@ -1,7 +1,7 @@
import React, { useEffect, useState } from "react";
import { useMarkdownTemplates } from "../../utils/queries/markdown-template-queries";
const TemplateSelector = ({ template, onChange }) => {
const TemplateSelector = ({ template, onChange, onCreate }) => {
const { data: templates, isFetching: templatesAreFetching } = useMarkdownTemplates();
const [_template, setTemplate] = useState(
templates?.find((t) => t.id === template?.id) || {
@@ -34,13 +34,15 @@ const TemplateSelector = ({ template, onChange }) => {
value={template?.id || ""}
onChange={(e) => {
const id = parseInt(e.target.value, 10);
onChange(
templates.find((t) => t.id === id) || {
title: "",
parameters: [],
layout: "",
}
);
const selectedTemplate = templates.find((t) => t.id === id) || {
title: "",
parameters: [],
layout: "",
};
onChange(selectedTemplate);
if (onCreate) {
onCreate(selectedTemplate);
}
}}
>
<option value="">(None)</option>

View File

@@ -11,7 +11,8 @@ import {useMarkdownTemplate} from "../../utils/queries/markdown-template-queries
import {useMarkdownTemplateSetting} from "../../utils/queries/markdown-template-setting-queries";
const MarkdownContent = () => {
const { id } = useParams();
const { strId } = useParams();
const id = Number(strId);
const [indexTitle, setIndexTitle] = useState(null);
const {data: markdown, isLoading, error} = useMarkdown(id);
const {data: path, isFetching: isPathFetching} = usePath(markdown?.path_id);
@@ -35,8 +36,8 @@ const MarkdownContent = () => {
if (error) {
return <div>Error: {error.message || "Failed to load content"}</div>;
}
if (markdown.isMessage) {
return (
<div className="markdown-content-container">
<div className="notification is-info">

View File

@@ -11,11 +11,13 @@ import {useMarkdownTemplate, useMarkdownTemplates} from "../../utils/queries/mar
import TemplatedEditor from "./TemplatedEditor";
import {useMarkdownTemplateSetting, useUpdateMarkdownTemplateSetting, useCreateMarkdownTemplateSetting} from "../../utils/queries/markdown-template-setting-queries";
import TemplateSelector from "../MarkdownTemplate/TemplateSelector";
import {useCreateMarkdownSetting} from "../../utils/queries/markdown-setting-queries";
const MarkdownEditor = () => {
const { roles } = useContext(AuthContext);
const navigate = useNavigate();
const { id } = useParams();
const { strId } = useParams();
const id = Number(strId);
const [title, setTitle] = useState("");
const [content, setContent] = useState({});
const [shortcut, setShortcut] = useState("");
@@ -23,6 +25,7 @@ const MarkdownEditor = () => {
const [isRawMode, setIsRawMode] = useState(false);
const [rawContent, setRawContent] = useState("");
const [jsonError, setJsonError] = useState("");
const [selectedTemplate, setSelectedTemplate] = useState(null);
const {data: markdown, isFetching: isMarkdownFetching, error} = useMarkdown(id);
const saveMarkdown = useSaveMarkdown();
const {data: setting, isFetching: isSettingFetching} = useMarkdownSetting(markdown?.setting_id);
@@ -32,10 +35,12 @@ const MarkdownEditor = () => {
const createTemplateSetting = useCreateMarkdownTemplateSetting();
const updateSetting = useUpdateMarkdownSetting();
const {data: templates, isFetching: templatesAreFetching} = useMarkdownTemplates();
const createMarkdownSetting = useCreateMarkdownSetting();
const notReady = isMarkdownFetching || isTemplateFetching || isSettingFetching || isTemplateSettingFetching || templatesAreFetching;
useEffect(() => {
if(markdown){
if (markdown) {
setTitle(markdown.title);
if (markdown.isMessage) {
navigate("/");
@@ -56,22 +61,84 @@ const MarkdownEditor = () => {
}
}, [markdown, navigate]);
useEffect(() => {
if (template) {
setSelectedTemplate(template);
}
}, [template]);
const handleSave = () => {
if (isRawMode && jsonError) {
alert("Please fix the JSON errors before saving");
return;
}
saveMarkdown.mutate(
{id, data: {title, content: JSON.stringify(content), path_id: pathId, shortcut}},
{
onSuccess: () => {
navigate("/");
},
onError: () => {
alert("Error saving markdown file");
const saveData = {
title,
content: JSON.stringify(content),
path_id: pathId,
shortcut
};
console.log("markdown", markdown);
console.log(markdown?.id ? "update" : "create",)
if (!markdown?.id) {
saveMarkdown.mutate(
{data: saveData},
{
onSuccess: (newMarkdown) => {
createMarkdownSetting.mutate({}, {
onSuccess: (settingRes) => {
saveMarkdown.mutate({
id: newMarkdown.id,
data: {
setting_id: settingRes.id
}
}, {
onSuccess: () => {
if (selectedTemplate?.id) {
createTemplateSetting.mutate({
template_id: selectedTemplate.id
}, {
onSuccess: (templateSettingRes) => {
updateSetting.mutate({
id: settingRes.id,
data: {
template_setting_id: templateSettingRes.id
}
}, {
onSuccess: () => {
navigate("/");
}
});
}
});
} else {
navigate("/");
}
}
});
}
});
},
onError: () => {
alert("Error saving markdown file");
}
}
});
);
} else {
console.log("try update");
saveMarkdown.mutate(
{id, data: saveData},
{
onSuccess: () => {
navigate("/markdown/" + id);
},
onError: () => {
alert("Error saving markdown file");
}
}
);
}
};
const toggleEditMode = () => {
@@ -104,54 +171,17 @@ const MarkdownEditor = () => {
};
const handleTemplateChange = (newTemplate) => {
if (!newTemplate) return;
setSelectedTemplate(newTemplate);
if (templateSetting) {
updateTemplateSetting.mutate(
{
id: templateSetting.id,
data: { template_id: newTemplate.id }
},
{
onSuccess: () => {
setContent({});
},
onError: () => {
alert("Error updating template");
}
updateTemplateSetting.mutate({
id: templateSetting.id,
data: {
template_id: newTemplate.id
}
);
} else if (setting) {
createTemplateSetting.mutate(
{ template_id: newTemplate.id },
{
onSuccess: (newTemplateSetting) => {
updateSetting.mutate(
{
id: setting.id,
data: { template_setting_id: newTemplateSetting.id }
},
{
onSuccess: () => {
setContent({});
},
onError: () => {
alert("Error updating markdown setting");
}
}
);
},
onError: () => {
alert("Error creating template setting");
}
}
);
} else {
alert("Cannot change template: No markdown setting found");
});
}
};
const hasPermission = roles.includes("admin") || roles.includes("creator");
if (!hasPermission)
return <div className="notification is-danger">Permission Denied</div>;
@@ -211,7 +241,7 @@ const MarkdownEditor = () => {
<div className="field">
<div className="control">
<TemplateSelector
template={template}
template={selectedTemplate || template}
onChange={handleTemplateChange}
/>
</div>
@@ -249,7 +279,7 @@ const MarkdownEditor = () => {
<TemplatedEditor
style={{height: "70vh"}}
content={content}
template={template}
template={!markdown?.id ? selectedTemplate : template}
onContentChanged={(k, v) => setContent(
prev => ({...prev, [k]: v})
)}
@@ -275,7 +305,11 @@ const MarkdownEditor = () => {
<div className="column is-half">
<h3 className="subtitle is-5">Preview</h3>
<MarkdownView content={content} template={template} height='70vh'/>
<MarkdownView
content={content}
template={!markdown?.id ? selectedTemplate : template}
height='70vh'
/>
</div>
</div>
</div>

View File

@@ -24,10 +24,10 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
let current_id = pathId;
while (current_id) {
try {
const pathData = await queryClient.fetchQuery(
["path", current_id],
() => fetch_(`${config.BACKEND_HOST}/api/path/${current_id}`)
);
const pathData = await queryClient.fetchQuery({
queryKey: ["path", current_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/path/${current_id}`)
});
if (!pathData) break;
path.unshift({ name: pathData.name, id: pathData.id });
current_id = pathData.parent_id;
@@ -71,8 +71,8 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
{ name: searchTerm.trim(), parent_id: currentPathId },
{
onSuccess: (newDir) => {
queryClient.setQueryData(["path", newDir.id], newDir);
queryClient.invalidateQueries(["paths", currentPathId]);
queryClient.setQueryData({queryKey: ["path", newDir.id]}, newDir);
queryClient.invalidateQueries({queryKey: ["paths", currentPathId]});
setSearchTerm("");
alert("Directory created successfully.");
},

View File

@@ -5,6 +5,7 @@ import AuthProvider, {AuthContext} from "./AuthProvider";
import "bulma/css/bulma.min.css";
import {QueryClient, QueryClientProvider} from "@tanstack/react-query"
import ConfigProvider from "./ConfigProvider";
import ControlledReactQueryDevtools from "./components/Debug/ControlledReactQueryDevtools";
const queryClient = new QueryClient({
defaultOptions: {
@@ -52,6 +53,7 @@ root.render(
<AuthProvider>
<EnhancedAuthProvider>
<App />
<ControlledReactQueryDevtools />
</EnhancedAuthProvider>
</AuthProvider>
</QueryClientProvider>

View File

@@ -5,13 +5,13 @@ import {fetch_} from "../request-utils";
export const useMarkdownPermissionSettings = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
["markdown_permission_settings"],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/`), {
onSuccess: (data) => {
if(data){
for(const setting of data){
queryClient.invalidateQueries(["markdown_permission_setting", setting.id]);
return useQuery({
queryKey: ["markdown_permission_settings"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/`),
onSuccess: async (data) => {
if (data) {
for (const setting of data) {
await queryClient.invalidateQueries(["markdown_permission_setting", setting.id]);
}
}
}
@@ -21,9 +21,9 @@ export const useMarkdownPermissionSettings = () => {
export const useMarkdownPermissionSetting = (setting_id) => {
const config = useConfig();
return useQuery(
["markdown_permission_setting", setting_id],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/${setting_id}/`), {
return useQuery({
queryKey: ["markdown_permission_setting", setting_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/${setting_id}`),
enabled: !!setting_id,
}
);
@@ -32,15 +32,17 @@ export const useMarkdownPermissionSetting = (setting_id) => {
export const useCreateMarkdownPermissionSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation((data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/`, {
method: "POST",
body: JSON.stringify(data),
}), {
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_permission_setting", data.id]);
queryClient.invalidateQueries(["markdown_permission_settings"]);
}
});
return useMutation(
{
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/permission/`, {
method: "POST",
body: JSON.stringify(data),
}),
onSuccess: async (data) => {
await queryClient.invalidateQueries(["markdown_permission_setting", data.id]);
await queryClient.invalidateQueries(["markdown_permission_settings"]);
}
});
};
export const useUpdateMarkdownPermissionSetting = () => {

View File

@@ -6,71 +6,72 @@ import {useConfig} from "../../ConfigProvider";
export const useMarkdown = (id) => {
const config = useConfig();
return useQuery(
["markdown", id],
() => fetch_(`${config.BACKEND_HOST}/api/markdown/${id}`),
{
enabled: !!id,
});
return useQuery({
queryKey: ["markdown", id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/markdown/${id}`),
enabled: !!id,
});
};
export const useIndexMarkdown = (path_id) => {
const queryClient = useQueryClient();
const config = useConfig();
return useQuery(
["index_markdown", path_id],
() => fetch_(`${config.BACKEND_HOST}/api/markdown/get_index/${path_id}`),{
enabled: !!path_id,
onSuccess: (data) => {
if(data && data.id){
queryClient.setQueryData(["markdown", data.id], data);
}
return useQuery({
queryKey: ["index_markdown", path_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/markdown/get_index/${path_id}`),
enabled: !!path_id,
onSuccess: (data) => {
if(data && data.id){
queryClient.setQueryData({queryKey: ["markdown", data.id]}, data);
}
});
}
});
};
export const useHomeMarkdown = () => {
const queryClient = useQueryClient();
const config = useConfig();
return useQuery(
["home_markdown"],
() => fetch_(`${config.BACKEND_HOST}/api/markdown/get_home`), {
onSuccess: (data) => {
if (data && data.id){
queryClient.setQueryData(["markdown", data.id], data);
}
return useQuery({
queryKey: ["home_markdown"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/markdown/get_home`),
onSuccess: (data) => {
if (data && data.id){
queryClient.setQueryData({queryKey: ["markdown", data.id]}, data);
}
});
}
});
};
export const useMarkdownsByPath = (pathId) => {
const config = useConfig();
return useQuery(
["markdownsByPath", pathId],
() => fetch_(`${config.BACKEND_HOST}/api/markdown/by_path/${pathId}`),
{
enabled: !!pathId
});
return useQuery({
queryKey: ["markdownsByPath", pathId],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/markdown/by_path/${pathId}`),
enabled: !!pathId
});
};
export const useSaveMarkdown = () => {
const queryClient = useQueryClient();
const config = useConfig();
return useMutation(({id, data}) => {
const url = id
? `${config.BACKEND_HOST}/api/markdown/${id}`
: `${config.BACKEND_HOST}/api/markdown/`;
const method = id ? "PATCH" : "POST";
return fetch_(url, {
method,
body: JSON.stringify(data),
})
},{
onSuccess: (res) => {
queryClient.invalidateQueries(["markdownsByPath", res.path_id]);
queryClient.invalidateQueries(["markdown", res.id]);
queryClient.invalidateQueries(["tree"]);
return useMutation({
mutationFn: ({id, data}) => {
const url = id
? `${config.BACKEND_HOST}/api/markdown/${id}`
: `${config.BACKEND_HOST}/api/markdown/`;
const method = id ? "PATCH" : "POST";
return fetch_(url, {
method,
body: JSON.stringify(data),
});
},
onSuccess: async (res) => {
await queryClient.invalidateQueries({queryKey: ["markdownsByPath", res.path_id]});
await queryClient.invalidateQueries({queryKey: ["markdown", res.id]});
await queryClient.invalidateQueries({queryKey: ["tree"]});
console.log("invalidateQueries: ", res.id, typeof res.id);
},
});
};
@@ -80,34 +81,34 @@ export const useMoveMarkdown = () => {
const queryClient = useQueryClient();
const config = useConfig();
return useMutation(
({markdown, direction}) => {
return useMutation({
mutationFn: ({markdown, direction}) => {
const apiEndpoint = `${config.BACKEND_HOST}/api/markdown/move_${direction}/${markdown.id}`;
return fetch_(apiEndpoint, {method: "PATCH"});
},
{
onSuccess: () => {
queryClient.invalidateQueries(["paths"]);
queryClient.invalidateQueries(["tree"]);
}
onSuccess: () => {
queryClient.invalidateQueries({queryKey: ["paths"]});
queryClient.invalidateQueries({queryKey: ["tree"]});
}
);
});
};
export const useSearchMarkdown = (keyword) => {
const config = useConfig();
return useQuery(["markdownsByKeyword", keyword],
() => fetch_(
return useQuery({
queryKey: ["markdownsByKeyword", keyword],
queryFn: () => fetch_(
`${config.BACKEND_HOST}/api/markdown/search/${encodeURIComponent(keyword)}`,
),
{
enabled: !!keyword,
}
);
enabled: !!keyword,
});
};
export const useLinks = () => {
const config = useConfig();
return useQuery(["links"], () => fetch_(`${config.BACKEND_HOST}/api/markdown/links`));
return useQuery({
queryKey: ["links"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/markdown/links`)
});
}

View File

@@ -5,71 +5,66 @@ import {fetch_} from "../request-utils";
export const useMarkdownSettings = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
["markdown_setting"],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/`),
{
onSuccess: (data) => {
if(data){
for(const setting of data)
queryClient.invalidateQueries(["markdown_setting", setting.id]);
}
return useQuery({
queryKey: ["markdown_setting"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/`),
onSuccess: (data) => {
if(data){
for(const setting of data)
queryClient.setQueryData({queryKey: ["markdown_setting", setting.id]}, setting);
}
}
);
});
};
export const useMarkdownSetting = (setting_id) => {
const config = useConfig();
return useQuery(
["markdown_setting", setting_id],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${setting_id}`, {}), {
enabled: !!setting_id,
}
);
return useQuery({
queryKey: ["markdown_setting", setting_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${setting_id}`, {}),
enabled: !!setting_id,
});
};
export const useCreateMarkdownSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/`, {
method: "POST",
body: JSON.stringify(data)
}), {
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_setting", data.id]);
}
}),
onSuccess: (data) => {
queryClient.invalidateQueries({queryKey: ["markdown_setting", data.id]});
}
);
});
};
export const useUpdateMarkdownSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${id}`, {
method: "PATCH",
body: JSON.stringify(data)
}),{
onSuccess: (data, variables) => {
queryClient.invalidateQueries(["markdown_setting", variables.id]);
}
});
}),
onSuccess: (data, variables) => {
queryClient.invalidateQueries({queryKey: ["markdown_setting", variables.id]});
}
});
};
export const useDeleteMarkdownSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/${id}`, {
method: "DELETE",
}),{
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_setting", data.id]);
}
}),
onSuccess: (data) => {
queryClient.invalidateQueries({queryKey: ["markdown_setting", data.id]});
}
);
});
};

View File

@@ -7,95 +7,90 @@ import {data} from "react-router-dom";
export const useMarkdownTemplate = (template_id) => {
const config = useConfig();
return useQuery(
["markdown_template", template_id],
() => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${template_id}`), {
enabled: !!template_id,
}
);
return useQuery({
queryKey: ["markdown_template", template_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${template_id}`),
enabled: !!template_id,
});
};
export const useMarkdownTemplates = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
["markdown_templates"],
() => fetch_(`${config.BACKEND_HOST}/api/template/markdown/`), {
onSuccess: (data) => {
if(data){
for(const template of data){
queryClient.setQueryData(["markdown_template", template.id], template);
}
return useQuery({
queryKey: ["markdown_templates"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/template/markdown/`),
onSuccess: (data) => {
if(data){
for(const template of data){
queryClient.setQueryData({queryKey: ["markdown_template", template.id]}, template);
}
}
}
);
});
};
export const useUpdateMarkdownTemplate = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${id}`, {
method: "PUT",
body: JSON.stringify(data),
}),
{
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_template", data.id]);
queryClient.invalidateQueries(["markdown_templates"]);
}
onSuccess: (data) => {
queryClient.invalidateQueries({queryKey: ["markdown_template", data.id]});
queryClient.invalidateQueries({queryKey: ["markdown_templates"]});
}
);
});
}
export const useCreateMarkdownTemplate = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/`, {
method: "POST",
body: JSON.stringify(data),
}),{
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_template", data.id]);
queryClient.invalidateQueries(["markdown_templates"]);
}
}),
onSuccess: (data) => {
queryClient.invalidateQueries({queryKey: ["markdown_template", data.id]});
queryClient.invalidateQueries({queryKey: ["markdown_templates"]});
}
);
});
}
export const useDeleteMarkdownTemplate = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/template/markdown/${id}`, {
method: "DELETE"
}), {
onSuccess: (res, variables) => {
queryClient.invalidateQueries(["markdown_template", variables]);
queryClient.invalidateQueries(["markdown_templates"]);
}
}),
onSuccess: (res, variables) => {
queryClient.invalidateQueries({queryKey: ["markdown_template", variables]});
queryClient.invalidateQueries({queryKey: ["markdown_templates"]});
}
)
});
}
export const useSaveMarkdownTemplate = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(({id, data}) => {
const url = id
? `${config.BACKEND_HOST}/api/template/markdown/${id}`
: `${config.BACKEND_HOST}/api/template/markdown/`;
const method = id? "PUT": "POST";
return fetch_(url, {
method,
body: JSON.stringify(data),
})
},{
return useMutation({
mutationFn: ({id, data}) => {
const url = id
? `${config.BACKEND_HOST}/api/template/markdown/${id}`
: `${config.BACKEND_HOST}/api/template/markdown/`;
const method = id? "PUT": "POST";
return fetch_(url, {
method,
body: JSON.stringify(data),
});
},
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_template", data.id]);
queryClient.invalidateQueries(["markdown_templates"]);
queryClient.invalidateQueries({queryKey: ["markdown_template", data.id]});
queryClient.invalidateQueries({queryKey: ["markdown_templates"]});
}
});
}

View File

@@ -5,40 +5,39 @@ import {fetch_} from "../request-utils";
export const useMarkdownTemplateSettings = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
["markdown_template_settings"],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/`), {
onSuccess: (data) => {
if(data){
for(const setting of data){
queryClient.invalidateQueries(["markdown_template_setting", settings.id]);
}
return useQuery({
queryKey: ["markdown_template_settings"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/`),
onSuccess: (data) => {
if(data){
for(const setting of data){
queryClient.setQueryData({queryKey: ["markdown_template_setting", setting.id]}, setting);
}
}
}
);
});
};
export const useMarkdownTemplateSetting = (setting_id) => {
const config = useConfig();
return useQuery(
["markdown_template_setting", setting_id],
() => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${setting_id}`), {
enabled: !!setting_id,
}
);
return useQuery({
queryKey: ["markdown_template_setting", setting_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${setting_id}`),
enabled: !!setting_id,
});
};
export const useCreateMarkdownTemplateSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation((data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/`, {
method: "POST",
body: JSON.stringify(data),
}), {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/`, {
method: "POST",
body: JSON.stringify(data),
}),
onSuccess: (data) => {
queryClient.invalidateQueries(["markdown_template_setting", data.id]);
queryClient.invalidateQueries({queryKey: ["markdown_template_setting", data.id]});
}
});
};
@@ -46,29 +45,27 @@ export const useCreateMarkdownTemplateSetting = () => {
export const useUpdateMarkdownTemplateSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${id}`, {
method: "PATCH",
body: JSON.stringify(data),
}),{
onSuccess: (res) => {
queryClient.invalidateQueries(["markdown_template_setting", res.id]);
queryClient.invalidateQueries(["markdown_template_settings"]);
}
}),
onSuccess: (res) => {
queryClient.invalidateQueries({queryKey: ["markdown_template_setting", res.id]});
queryClient.invalidateQueries({queryKey: ["markdown_template_settings"]});
}
);
});
};
export const useDeleteMarkdownTemplateSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${id}`, {
return useMutation({
mutationFn: ({id}) => fetch_(`${config.BACKEND_HOST}/api/setting/markdown/template/${id}`, {
method: "DELETE",
}), {
onSuccess: (res, variables) => {
queryClient.invalidateQueries(["markdown_template_setting", variables.id]);
}
}),
onSuccess: (res, variables) => {
queryClient.invalidateQueries({queryKey: ["markdown_template_setting", variables.id]});
}
);
});
};

View File

@@ -6,87 +6,77 @@ import {useConfig} from "../../ConfigProvider";
export const usePaths = (parent_id) => {
const queryClient = useQueryClient();
const config = useConfig();
return useQuery(
["paths", parent_id],
() => fetch_(`${config.BACKEND_HOST}/api/path/parent/${parent_id}`),
{
enabled: !!parent_id,
onSuccess: (data) => {
if(data) {
for (const pth of data)
{
queryClient.setQueryData(["path", pth.id], pth);
}
return useQuery({
queryKey: ["paths", parent_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/path/parent/${parent_id}`),
enabled: !!parent_id,
onSuccess: (data) => {
if(data) {
for (const pth of data)
{
queryClient.setQueryData({queryKey: ["path", pth.id]}, pth);
}
}
}
);
});
};
export const usePath = (id) => {
const config = useConfig();
return useQuery(
["path", id],
() => fetch_(`${config.BACKEND_HOST}/api/path/${id}`),
{
enabled: !!id
}
);
return useQuery({
queryKey: ["path", id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/path/${id}`),
enabled: !!id
});
};
export const useCreatePath = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/path/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/path/`, {
method: "POST",
body: JSON.stringify(data),
}),
{
onSuccess: (res) => {
queryClient.invalidateQueries(["paths", res.parent_id]);
queryClient.invalidateQueries(["tree"]);
},
}
);
onSuccess: (res) => {
queryClient.invalidateQueries({queryKey: ["paths", res.parent_id]});
queryClient.invalidateQueries({queryKey: ["tree"]});
},
});
};
export const useUpdatePath = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({ id, data }) => fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
return useMutation({
mutationFn: ({ id, data }) => fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
method: "PATCH",
body: JSON.stringify(data),
}),
{
onSuccess: (res) => {
queryClient.invalidateQueries(["paths", res.parent_id]);
queryClient.invalidateQueries(["path", res.id]);
queryClient.invalidateQueries(["tree"]);
},
}
);
onSuccess: (res) => {
queryClient.invalidateQueries({queryKey: ["paths", res.parent_id]});
queryClient.invalidateQueries({queryKey: ["path", res.id]});
queryClient.invalidateQueries({queryKey: ["tree"]});
},
});
};
export const useDeletePath = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
method: "DELETE",
}),
{
onSuccess: () => {
queryClient.invalidateQueries(["paths"]);
queryClient.invalidateQueries(["tree"]);
},
}
);
onSuccess: () => {
queryClient.invalidateQueries({queryKey: ["paths"]});
queryClient.invalidateQueries({queryKey: ["tree"]});
},
});
};
@@ -94,16 +84,14 @@ export const useMovePath = () => {
const queryClient = useQueryClient();
const config = useConfig();
return useMutation(
({path, direction}) => {
return useMutation({
mutationFn: ({path, direction}) => {
const apiEndpoint = `${config.BACKEND_HOST}/api/path/move_${direction}/${path.id}`;
return fetch_(apiEndpoint, {method: "PATCH"});
},
{
onSuccess: () => {
queryClient.invalidateQueries(["paths"]);
queryClient.invalidateQueries(["tree"]);
}
onSuccess: () => {
queryClient.invalidateQueries({queryKey: ["paths"]});
queryClient.invalidateQueries({queryKey: ["tree"]});
}
);
});
};

View File

@@ -5,76 +5,69 @@ import {fetch_} from "../request-utils";
export const usePathSettings = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
"path_settings",
() => fetch_(`${config.BACKEND_HOST}/api/setting/path/`),
{
onSuccess: (data) => {
if(data){
for(const setting of data)
queryClient.setQueryData(["path_setting", setting.id], setting);
}
return useQuery({
queryKey: ["path_settings"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/path/`),
onSuccess: (data) => {
if(data){
for(const setting of data)
queryClient.setQueryData({queryKey: ["path_setting", setting.id]}, setting);
}
}
);
});
};
export const usePathSetting = (setting_id) => {
const config = useConfig();
return useQuery(
["path_setting", setting_id],
() => fetch_(`${config.BACKEND_HOST}/api/setting/path/${setting_id}`),
{
enabled: !!setting_id,
}
);
return useQuery({
queryKey: ["path_setting", setting_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/path/${setting_id}`),
enabled: !!setting_id,
});
};
export const useCreatePathSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/setting/path/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/setting/path/`, {
method: "POST",
body: JSON.stringify(data)
}), {
onSuccess: (data) => {
queryClient.invalidateQueries(["path_setting", data.id]);
queryClient.invalidateQueries(["path_settings"]);
}
}),
onSuccess: (data) => {
queryClient.invalidateQueries({queryKey: ["path_setting", data.id]});
queryClient.invalidateQueries({queryKey: ["path_settings"]});
}
);
});
};
export const useUpdatePathSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/path/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/path/${id}`, {
method: "PATCH",
body: JSON.stringify(data)
}), {
onSuccess: (data, variables) => {
queryClient.invalidateQueries(["path_setting", variables.id]);
queryClient.invalidateQueries(["path_settings"]);
}
}),
onSuccess: (data, variables) => {
queryClient.invalidateQueries({queryKey: ["path_setting", variables.id]});
queryClient.invalidateQueries({queryKey: ["path_settings"]});
}
);
});
};
export const useDeletePathSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/setting/path/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/setting/path/${id}`, {
method: "DELETE",
}),{
onSuccess: (data, variables) => {
queryClient.invalidateQueries(["path_setting", variables.id]);
queryClient.invalidateQueries(["path_settings"]);
}
}),
onSuccess: (data, variables) => {
queryClient.invalidateQueries({queryKey: ["path_setting", variables.id]});
queryClient.invalidateQueries({queryKey: ["path_settings"]});
}
);
});
};

View File

@@ -6,14 +6,12 @@ import {useConfig} from "../../ConfigProvider";
export const useTree = () => {
const queryClient = useQueryClient();
const config = useConfig();
return useQuery(
["tree"],
() => fetch_(`${config.BACKEND_HOST}/api/tree/`),
{
onSuccess: data => {
if(data)
queryClient.setQueryData(["tree"], data);
}
return useQuery({
queryKey: ["tree"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/tree/`),
onSuccess: data => {
if(data)
queryClient.setQueryData({queryKey: ["tree"]}, data);
}
);
}
});
};

View File

@@ -5,147 +5,132 @@ import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query";
export const useWebhooks = () =>{
const queryClient = useQueryClient();
const config = useConfig();
return useQuery(
["webhooks"],
() => fetch_(`${config.BACKEND_HOST}/api/webhook/`),
{
onSuccess: (data) => {
if(data){
for(const webhook of data){
queryClient.setQueryData(["webhook", data.id], data);
}
return useQuery({
queryKey: ["webhooks"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/webhook/`),
onSuccess: (data) => {
if(data){
for(const webhook of data){
queryClient.setQueryData({queryKey: ["webhook", data.id]}, data);
}
}
}
);
});
};
export const useCreateWebhook = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/webhook/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/webhook/`, {
method: "POST",
body: JSON.stringify({
"hook_url": data
}),
}),
{
onSuccess: () => {
queryClient.invalidateQueries(["webhooks"]);
}
onSuccess: () => {
queryClient.invalidateQueries({queryKey: ["webhooks"]});
}
);
});
};
export const useUpdateWebhook = () =>{
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/webhook/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/webhook/${id}`, {
method: "PATCH",
body: JSON.stringify(data)
}),
{
onSuccess: (res) => {
queryClient.invalidateQueries(["webhook", res.id]);
queryClient.invalidateQueries(["webhooks"]);
}
onSuccess: (res) => {
queryClient.invalidateQueries({queryKey: ["webhook", res.id]});
queryClient.invalidateQueries({queryKey: ["webhooks"]});
}
);
});
};
export const useDeleteWebhook = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/webhook/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/webhook/${id}`, {
method: "DELETE",
}),
{
onSuccess: (res, variables) => {
queryClient.invalidateQueries(["webhook", variables.id]);
queryClient.invalidateQueries(["webhooks"]);
}
onSuccess: (res, variables) => {
queryClient.invalidateQueries({queryKey: ["webhook", variables.id]});
queryClient.invalidateQueries({queryKey: ["webhooks"]});
}
)
});
}
export const useWebhookSettings = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useQuery(
["webhook_setting"],
() => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/`),
{
onSuccess: (data) => {
if(data){
for(const setting of data){
queryClient.setQueryData(["webhook_setting", setting.id], setting);
}
return useQuery({
queryKey: ["webhook_setting"],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/`),
onSuccess: (data) => {
if(data){
for(const setting of data){
queryClient.setQueryData({queryKey: ["webhook_setting", setting.id]}, setting);
}
}
}
);
});
};
export const useWebhookSetting = (setting_id) => {
const config = useConfig();
return useQuery(
["webhook_setting", setting_id],
() => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${setting_id}`),
{
enabled: !!setting_id,
});
return useQuery({
queryKey: ["webhook_setting", setting_id],
queryFn: () => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${setting_id}`),
enabled: !!setting_id,
});
};
export const useCreateWebhookSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(data) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/`, {
return useMutation({
mutationFn: (data) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/`, {
method: "POST",
body: JSON.stringify(data)
}),{
onSuccess: (res) => {
queryClient.invalidateQueries(["webhook_setting", res.id]);
queryClient.invalidateQueries(["webhook_setting"]);
}
}),
onSuccess: (res) => {
queryClient.invalidateQueries({queryKey: ["webhook_setting", res.id]});
queryClient.invalidateQueries({queryKey: ["webhook_setting"]});
}
);
});
};
export const useUpdateWebhookSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${id}`, {
return useMutation({
mutationFn: ({id, data}) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${id}`, {
method: "PATCH",
body: JSON.stringify(data)
}),{
onSuccess: (res, variables) => {
queryClient.invalidateQueries(["webhook_setting", variables.id]);
queryClient.invalidateQueries(["webhook_setting"]);
}
}),
onSuccess: (res, variables) => {
queryClient.invalidateQueries({queryKey: ["webhook_setting", variables.id]});
queryClient.invalidateQueries({queryKey: ["webhook_setting"]});
}
);
});
};
export const useDeleteWebhookSetting = () => {
const config = useConfig();
const queryClient = useQueryClient();
return useMutation(
(id) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${id}`, {
return useMutation({
mutationFn: (id) => fetch_(`${config.BACKEND_HOST}/api/setting/path/webhook/${id}`, {
method: "DELETE",
}),
{
onSuccess: (res, variables) => {
queryClient.invalidateQueries(["webhook_setting", variables.id]);
queryClient.invalidateQueries(["webhook_setting"]);
}
onSuccess: (res, variables) => {
queryClient.invalidateQueries({queryKey: ["webhook_setting", variables.id]});
queryClient.invalidateQueries({queryKey: ["webhook_setting"]});
}
);
});
};