Skip to content

WebUI: Store persistent settings in client data API #23191

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Piccirello wants to merge 1 commit into
base: master
Choose a base branch
from
+258 −85
Open

WebUI: Store persistent settings in client data API #23191

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/webui/www/private/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
<script defer src="scripts/monkeypatch.js?v=${CACHEID}"></script>
<script defer src="scripts/cache.js?v=${CACHEID}"></script>
<script defer src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script defer src="scripts/client-data.js?v=${CACHEID}"></script>
<script defer src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script defer src="scripts/mocha-init.js?locale=${LANG}&v=${CACHEID}"></script>
<script defer src="scripts/lib/clipboard-copy.js"></script>
Expand Down
9 changes: 3 additions & 6 deletions src/webui/www/private/scripts/addtorrent.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,10 +45,10 @@ window.qBittorrent.AddTorrent ??= (() => {
let source = "";
let downloader = "";

const localPreferences = new window.qBittorrent.LocalPreferences.LocalPreferences();
const clientData = window.parent.qBittorrent.ClientData;

const getCategories = () => {
const defaultCategory = localPreferences.get("add_torrent_default_category", "");
const defaultCategory = clientData.get("add_torrent_default_category") ?? "";
const categorySelect = document.getElementById("categorySelect");
for (const name of window.parent.qBittorrent.Client.categoryMap.keys()) {
const option = document.createElement("option");
Expand Down Expand Up @@ -320,10 +320,7 @@ window.qBittorrent.AddTorrent ??= (() => {

if (document.getElementById("setDefaultCategory").checked) {
const category = document.getElementById("category").value.trim();
if (category.length === 0)
localPreferences.remove("add_torrent_default_category");
else
localPreferences.set("add_torrent_default_category", category);
clientData.set({ add_torrent_default_category: (category.length > 0) ? category : null }).catch(console.error);
}
};

Expand Down
126 changes: 126 additions & 0 deletions src/webui/www/private/scripts/client-data.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,126 @@
/*
* Bittorrent Client using Qt and libtorrent.
* Copyright (C) 2025 Thomas Piccirello <[email protected]>
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; either version 2
* of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*
* In addition, as a special exception, the copyright holders give permission to
* link this program with the OpenSSL project's "OpenSSL" library (or with
* modified versions of it that use the same license as the "OpenSSL" library),
* and distribute the linked executables. You must obey the GNU General Public
* License in all respects for all of the code used other than "OpenSSL". If you
* modify file(s), you may extend this exception to your version of the file(s),
* but you are not obligated to do so. If you do not wish to do so, delete this
* exception statement from your version.
*/

"use strict";

window.qBittorrent ??= {};
window.qBittorrent.ClientData ??= (() => {
const exports = () => {
return new ClientData();
};

// this is exposed as a singleton
class ClientData {
/**
* @type Map<string, any>
*/
#cache = new Map();

#keyPrefix = "qbt_";

#addKeyPrefix(data) {
return Object.fromEntries(Object.entries(data).map(([key, value]) => ([`${this.#keyPrefix}${key}`, value])));
}

#removeKeyPrefix(data) {
Comment on lines +46 to +50
Copy link
Member

@Chocobo1 Chocobo1 Nov 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't insist and I think it would still be helpful to include type comments for these two internal functions.

return Object.fromEntries(Object.entries(data).map(([key, value]) => ([key.substring(this.#keyPrefix.length), value])));
}

/**
* @param {string[]} keys
* @returns {Record<string, any>}
*/
async #fetch(keys) {
keys = keys.map(key => `${this.#keyPrefix}${key}`);
return await fetch("api/v2/clientdata/load", {
method: "POST",
body: new URLSearchParams({
keys: JSON.stringify(keys)
})
})
.then(async (response) => {
if (!response.ok)
return;

const data = await response.json();
return this.#removeKeyPrefix(data);
});
}

/**
* @param {Record<string, any>} data
*/
async #set(data) {
data = this.#addKeyPrefix(data);
await fetch("api/v2/clientdata/store", {
method: "POST",
body: new URLSearchParams({
data: JSON.stringify(data)
})
})
.then((response) => {
if (!response.ok)
throw new Error("Failed to store client data");
});
}

/**
* @param {string} key
* @returns {any}
*/
get(key) {
return this.#cache.get(key);
}

/**
* @param {string[]} keys
*/
async fetch(keys = []) {
const keysToFetch = keys.filter((key) => !this.#cache.has(key));
if (keysToFetch.length > 0) {
const fetchedData = await this.#fetch(keysToFetch);
for (const [key, value] of Object.entries(fetchedData))
this.#cache.set(key, value);
}
}

/**
* @param {Record<string, any>} data
*/
async set(data) {
await this.#set(data);

// update cache
for (const [key, value] of Object.entries(data))
this.#cache.set(key, value);
}
}

return exports();
})();
Object.freeze(window.qBittorrent.ClientData);
95 changes: 69 additions & 26 deletions src/webui/www/private/scripts/client.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ window.qBittorrent.Client ??= (() => {
return {
setup: setup,
initializeCaches: initializeCaches,
initializeClientData: initializeClientData,
closeWindow: closeWindow,
closeFrameWindow: closeFrameWindow,
getSyncMainDataInterval: getSyncMainDataInterval,
Expand All @@ -56,15 +57,48 @@ window.qBittorrent.Client ??= (() => {
const tagMap = new Map();

let cacheAllSettled;
let clientDataPromise;
const setup = () => {
// fetch various data and store it in memory
clientDataPromise = window.qBittorrent.ClientData.fetch([
"add_torrent_default_category",
"color_scheme",
"dblclick_complete",
"dblclick_download",
"dblclick_filter",
"full_url_tracker_column",
"hide_zero_status_filters",
"qbt_selected_log_levels",
"search_in_filter",
"show_filters_sidebar",
"show_log_viewer",
"show_rss_reader",
"show_search_engine",
"show_status_bar",
"show_top_toolbar",
"speed_in_browser_title_bar",
"torrent_creator",
"use_alt_row_colors",
"use_virtual_list",
]);

cacheAllSettled = Promise.allSettled([
window.qBittorrent.Cache.buildInfo.init(),
window.qBittorrent.Cache.preferences.init(),
window.qBittorrent.Cache.qbtVersion.init()
window.qBittorrent.Cache.qbtVersion.init(),
clientDataPromise,
]);
};

const initializeClientData = async () => {
try {
await clientDataPromise;
}
catch (error) {
console.error(`Failed to initialize client data. Reason: "${error}".`);
}
};

Comment on lines +93 to +101
Copy link
Member

@Chocobo1 Chocobo1 Nov 16, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function looks redundant. The setup() is guaranteed to run to completion before DOMContentLoaded event.

Copy link
Member Author

@Piccirello Piccirello Nov 26, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, how can we guarantee this? I'm happy to remove this function if it's not needed.

Copy link
Member

@Chocobo1 Chocobo1 Nov 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm happy to remove this function if it's not needed.

Yes, I would remove that and inline clientDataPromise as such:

cacheAllSettled = Promise.allSettled([
    window.qBittorrent.Cache.buildInfo.init(),
    window.qBittorrent.Cache.preferences.init(),
    window.qBittorrent.Cache.qbtVersion.init(),
    window.qBittorrent.ClientData.fetch([
        "add_torrent_default_category",
        "color_scheme",
        "dblclick_complete",
        ...])
]);

Copy link
Member

@Chocobo1 Chocobo1 Nov 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I would remove that and inline clientDataPromise as such:

And the statement await window.qBittorrent.Client.initializeCaches(); should be moved from load event to DOMContentLoaded event.

Copy link
Member Author

@Piccirello Piccirello Nov 29, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You didn't answer my question - how can we guarantee that setup() is complete before DOMContentLoaded executes?

And the statement await window.qBittorrent.Client.initializeCaches(); should be moved from load event to DOMContentLoaded event.

This is existing behavior that I'm not going to modify in this PR. You literally just told me not to do this here.

const initializeCaches = async () => {
const results = await cacheAllSettled;
for (const [idx, result] of results.entries()) {
Expand Down Expand Up @@ -223,8 +257,8 @@ let queueing_enabled = true;
let serverSyncMainDataInterval = 1500;
let customSyncMainDataInterval = null;
let useSubcategories = true;
const useAutoHideZeroStatusFilters = localPreferences.get("hide_zero_status_filters", "false") === "true";
const displayFullURLTrackerColumn = localPreferences.get("full_url_tracker_column", "false") === "true";
let useAutoHideZeroStatusFilters = false;
let displayFullURLTrackerColumn = false;

/* Categories filter */
const CATEGORIES_ALL = "b4af0e4c-e76d-4bac-a392-46cbc18d9655";
Expand All @@ -250,6 +284,8 @@ const TRACKERS_WARNING = "82a702c5-210c-412b-829f-97632d7557e9";
// Map<trackerHost: String, Map<trackerURL: String, torrents: Set>>
const trackerMap = new Map();

const clientData = window.qBittorrent.ClientData;

let selectedTracker = localPreferences.get("selected_tracker", TRACKERS_ALL);
let setTrackerFilter = () => {};

Expand All @@ -258,9 +294,16 @@ let selectedStatus = localPreferences.get("selected_filter", "all");
let setStatusFilter = () => {};
let toggleFilterDisplay = () => {};

window.addEventListener("DOMContentLoaded", (event) => {
window.addEventListener("DOMContentLoaded", async (event) => {
// execute this first
window.qBittorrent.LocalPreferences.upgrade();

await window.qBittorrent.Client.initializeClientData();
window.qBittorrent.ColorScheme.update();

useAutoHideZeroStatusFilters = clientData.get("hide_zero_status_filters") === true;
displayFullURLTrackerColumn = clientData.get("full_url_tracker_column") === true;

let isSearchPanelLoaded = false;
let isLogPanelLoaded = false;
let isRssPanelLoaded = false;
Expand Down Expand Up @@ -405,6 +448,13 @@ window.addEventListener("DOMContentLoaded", (event) => {
localPreferences.set(`filter_${filterListID.replace("FilterList", "")}_collapsed`, filterList.classList.toggle("invisible").toString());
};

const highlightSelectedStatus = () => {
const statusFilter = document.getElementById("statusFilterList");
const filterID = `${selectedStatus}_filter`;
for (const status of statusFilter.children)
status.classList.toggle("selectedFilter", (status.id === filterID));
};

new MochaUI.Panel({
id: "Filters",
title: "Panel",
Expand All @@ -426,35 +476,35 @@ window.addEventListener("DOMContentLoaded", (event) => {
initializeWindows();

// Show Top Toolbar is enabled by default
let showTopToolbar = localPreferences.get("show_top_toolbar", "true") === "true";
let showTopToolbar = (clientData.get("show_top_toolbar") ?? true) === true;
if (!showTopToolbar) {
document.getElementById("showTopToolbarLink").firstElementChild.style.opacity = "0";
document.getElementById("mochaToolbar").classList.add("invisible");
}

// Show Status Bar is enabled by default
let showStatusBar = localPreferences.get("show_status_bar", "true") === "true";
let showStatusBar = (clientData.get("show_status_bar") ?? true) === true;
if (!showStatusBar) {
document.getElementById("showStatusBarLink").firstElementChild.style.opacity = "0";
document.getElementById("desktopFooterWrapper").classList.add("invisible");
}

// Show Filters Sidebar is enabled by default
let showFiltersSidebar = localPreferences.get("show_filters_sidebar", "true") === "true";
let showFiltersSidebar = (clientData.get("show_filters_sidebar") ?? true) === true;
if (!showFiltersSidebar) {
document.getElementById("showFiltersSidebarLink").firstElementChild.style.opacity = "0";
document.getElementById("filtersColumn").classList.add("invisible");
document.getElementById("filtersColumn_handle").classList.add("invisible");
}

let speedInTitle = localPreferences.get("speed_in_browser_title_bar") === "true";
let speedInTitle = clientData.get("speed_in_browser_title_bar") === true;
if (!speedInTitle)
document.getElementById("speedInBrowserTitleBarLink").firstElementChild.style.opacity = "0";

// After showing/hiding the toolbar + status bar
window.qBittorrent.Client.showSearchEngine(localPreferences.get("show_search_engine") !== "false");
window.qBittorrent.Client.showRssReader(localPreferences.get("show_rss_reader") !== "false");
window.qBittorrent.Client.showLogViewer(localPreferences.get("show_log_viewer") === "true");
window.qBittorrent.Client.showSearchEngine((clientData.get("show_search_engine") ?? true) === true);
window.qBittorrent.Client.showRssReader((clientData.get("show_rss_reader") ?? true) === true);
window.qBittorrent.Client.showLogViewer(clientData.get("show_log_viewer") === true);

// After Show Top Toolbar
MochaUI.Desktop.setDesktopSize();
Expand Down Expand Up @@ -571,13 +621,6 @@ window.addEventListener("DOMContentLoaded", (event) => {
window.qBittorrent.Filters.clearStatusFilter();
};

const highlightSelectedStatus = () => {
const statusFilter = document.getElementById("statusFilterList");
const filterID = `${selectedStatus}_filter`;
for (const status of statusFilter.children)
status.classList.toggle("selectedFilter", (status.id === filterID));
};

const updateCategoryList = () => {
const categoryList = document.getElementById("categoryFilterList");
if (!categoryList)
Expand Down Expand Up @@ -1223,7 +1266,7 @@ window.addEventListener("DOMContentLoaded", (event) => {

document.getElementById("showTopToolbarLink").addEventListener("click", (e) => {
showTopToolbar = !showTopToolbar;
localPreferences.set("show_top_toolbar", showTopToolbar.toString());
clientData.set({ show_top_toolbar: showTopToolbar }).catch(console.error);
if (showTopToolbar) {
document.getElementById("showTopToolbarLink").firstElementChild.style.opacity = "1";
document.getElementById("mochaToolbar").classList.remove("invisible");
Expand All @@ -1237,7 +1280,7 @@ window.addEventListener("DOMContentLoaded", (event) => {

document.getElementById("showStatusBarLink").addEventListener("click", (e) => {
showStatusBar = !showStatusBar;
localPreferences.set("show_status_bar", showStatusBar.toString());
clientData.set({ show_status_bar: showStatusBar }).catch(console.error);
if (showStatusBar) {
document.getElementById("showStatusBarLink").firstElementChild.style.opacity = "1";
document.getElementById("desktopFooterWrapper").classList.remove("invisible");
Expand Down Expand Up @@ -1274,7 +1317,7 @@ window.addEventListener("DOMContentLoaded", (event) => {

document.getElementById("showFiltersSidebarLink").addEventListener("click", (e) => {
showFiltersSidebar = !showFiltersSidebar;
localPreferences.set("show_filters_sidebar", showFiltersSidebar.toString());
clientData.set({ show_filters_sidebar: showFiltersSidebar }).catch(console.error);
if (showFiltersSidebar) {
document.getElementById("showFiltersSidebarLink").firstElementChild.style.opacity = "1";
document.getElementById("filtersColumn").classList.remove("invisible");
Expand All @@ -1290,7 +1333,7 @@ window.addEventListener("DOMContentLoaded", (event) => {

document.getElementById("speedInBrowserTitleBarLink").addEventListener("click", (e) => {
speedInTitle = !speedInTitle;
localPreferences.set("speed_in_browser_title_bar", speedInTitle.toString());
clientData.set({ speed_in_browser_title_bar: speedInTitle }).catch(console.error);
if (speedInTitle)
document.getElementById("speedInBrowserTitleBarLink").firstElementChild.style.opacity = "1";
else
Expand All @@ -1300,19 +1343,19 @@ window.addEventListener("DOMContentLoaded", (event) => {

document.getElementById("showSearchEngineLink").addEventListener("click", (e) => {
window.qBittorrent.Client.showSearchEngine(!window.qBittorrent.Client.isShowSearchEngine());
localPreferences.set("show_search_engine", window.qBittorrent.Client.isShowSearchEngine().toString());
clientData.set({ show_search_engine: window.qBittorrent.Client.isShowSearchEngine() }).catch(console.error);
updateTabDisplay();
});

document.getElementById("showRssReaderLink").addEventListener("click", (e) => {
window.qBittorrent.Client.showRssReader(!window.qBittorrent.Client.isShowRssReader());
localPreferences.set("show_rss_reader", window.qBittorrent.Client.isShowRssReader().toString());
clientData.set({ show_rss_reader: window.qBittorrent.Client.isShowRssReader() }).catch(console.error);
updateTabDisplay();
});

document.getElementById("showLogViewerLink").addEventListener("click", (e) => {
window.qBittorrent.Client.showLogViewer(!window.qBittorrent.Client.isShowLogViewer());
localPreferences.set("show_log_viewer", window.qBittorrent.Client.isShowLogViewer().toString());
clientData.set({ show_log_viewer: window.qBittorrent.Client.isShowLogViewer() }).catch(console.error);
updateTabDisplay();
});

Expand Down Expand Up @@ -1369,7 +1412,7 @@ window.addEventListener("DOMContentLoaded", (event) => {
// main window tabs

const showTransfersTab = () => {
const showFiltersSidebar = localPreferences.get("show_filters_sidebar", "true") === "true";
const showFiltersSidebar = (clientData.get("show_filters_sidebar") ?? true) === true;
if (showFiltersSidebar) {
document.getElementById("filtersColumn").classList.remove("invisible");
document.getElementById("filtersColumn_handle").classList.remove("invisible");
Expand Down
Loading
Loading