Rishi Ghan
c03f706e9d
* 🗂️ Added tab icons and styles * 🪑 Styled download panel table * 🪑 Cleaned up the DC++ search results table * 🪑 Many changes to DC++ downloads table * 🏗️ Wired up search with RQ * 🏗️ Changes to ComicDetail section * 🔧 Fixing table styes * 🏗 Fixed the archive ops panel * 🔧 Tweaked Archive ops further * 🃏 Styling the action menu * 🧩 CV Match panel refactor WIP * 🏗️ Refactored the action menu * 🤼 Cleaning up CV match panel * 🏗️ Refactored the scored matches * 🤼 Revamped CV match panel UX * 🖌️ Styling tweaks to the side panel * 🖌️ Cleaned up the form * 🏗️ Refactored the search form * 🤐 Added a uncompress indicator * 🏗️ Fix for encoding # in URIs * 🔧 Fixed # symbol handling in URLs * 🔧 Started work on Edit Metadata panel * 🔎 Added a check for existing uncompressed archives * 🏗️ Settings styling tweaks * 🏗️ Fixed invalidation of archiveOps * 🏗️ Fixed an invalidation query on DC++ download panel * 🏗️ Fixed CV-sourced Volume info panel * 🏗️ Fixed volume group card stacks on Dashboard * 🔍 Fixing CV search page * 🏗️ Refactoring Volume groups and wanted panel * 🏗️ Cleaning up useless files * 🛝 Added keen-slider for pull list * 🏗️ Abstracted heading/subheading into Header * 🏗️ Continued refactoring of PullList, Volumes etc. * 📆 Wired up the datepicker to LoCG pull list
93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
import React, { ReactElement } from "react";
|
|
import { ConnectionForm } from "../../shared/ConnectionForm/ConnectionForm";
|
|
import { useQuery, useMutation, QueryClient } from "@tanstack/react-query";
|
|
import axios from "axios";
|
|
|
|
export const QbittorrentConnectionForm = (): ReactElement => {
|
|
const queryClient = new QueryClient();
|
|
// fetch settings
|
|
const { data, isLoading, isError } = useQuery({
|
|
queryKey: ["settings"],
|
|
queryFn: async () =>
|
|
await axios({
|
|
url: "http://localhost:3000/api/settings/getAllSettings",
|
|
method: "GET",
|
|
}),
|
|
});
|
|
const hostDetails = data?.data?.bittorrent?.client?.host;
|
|
// connect to qbittorrent client
|
|
const { data: connectionDetails } = useQuery({
|
|
queryKey: [],
|
|
queryFn: async () =>
|
|
await axios({
|
|
url: "http://localhost:3060/api/qbittorrent/connect",
|
|
method: "POST",
|
|
data: hostDetails,
|
|
}),
|
|
enabled: !!hostDetails,
|
|
});
|
|
// get qbittorrent client info
|
|
const { data: qbittorrentClientInfo } = useQuery({
|
|
queryKey: ["qbittorrentClientInfo"],
|
|
queryFn: async () =>
|
|
await axios({
|
|
url: "http://localhost:3060/api/qbittorrent/getClientInfo",
|
|
method: "GET",
|
|
}),
|
|
enabled: !!connectionDetails,
|
|
});
|
|
// Update action using a mutation
|
|
const { mutate } = useMutation({
|
|
mutationFn: async (values) =>
|
|
await axios({
|
|
url: `http://localhost:3000/api/settings/saveSettings`,
|
|
method: "POST",
|
|
data: { settingsPayload: values, settingsKey: "bittorrent" },
|
|
}),
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries({
|
|
queryKey: ["settings", "qbittorrentClientInfo"],
|
|
});
|
|
},
|
|
});
|
|
|
|
if (isError)
|
|
return (
|
|
<>
|
|
<pre>Something went wrong connecting to qBittorrent.</pre>
|
|
</>
|
|
);
|
|
if (!isLoading) {
|
|
return (
|
|
<>
|
|
<ConnectionForm
|
|
initialData={hostDetails}
|
|
formHeading={"qBittorrent Configuration"}
|
|
submitHandler={mutate}
|
|
/>
|
|
|
|
<span className="flex items-center mt-10 mb-4">
|
|
<span className="text-xl text-slate-500 dark:text-slate-200 pr-5">
|
|
qBittorrent Client Information
|
|
</span>
|
|
<span className="h-px flex-1 bg-slate-200 dark:bg-slate-400"></span>
|
|
</span>
|
|
|
|
<div className="block max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow dark:bg-slate-400 dark:border-gray-700">
|
|
<span className="inline-flex justify-center rounded-full bg-emerald-100 mb-4 px-2 py-0.5 text-emerald-700">
|
|
<span className="h-5 w-6">
|
|
<i className="icon-[solar--plug-circle-bold] h-5 w-5"></i>
|
|
</span>
|
|
<p className="whitespace-nowrap text-sm">Connected</p>
|
|
</span>
|
|
<pre className="font-hasklig text-sm text-slate-700 dark:text-slate-700">
|
|
{JSON.stringify(qbittorrentClientInfo?.data, null, 4)}
|
|
</pre>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
};
|
|
|
|
export default QbittorrentConnectionForm;
|