Avii/Radicale
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Merge pull request #2121 from maxberger/master

Browse Source 
UI: Move incoming shared to the end and allow property overrides
This commit is contained in:
Peter Bieringer
2026-05-03 17:40:43 +02:00
committed by GitHub
parent 04a8091903 effefac02f
commit 4ca13772c9
6 changed files with 398 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
integ_tests/test_collection_sorting.py Normal file
View File

@@ -0,0 +1,117 @@
# This file is part of Radicale - CalDAV and CardDAV server
# Copyright © 2026-2026 Max Berger <max@berger.name>
#
# This library 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 3 of the License, or
# (at your option) any later version.
#
# This library 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 Radicale. If not, see <http://www.gnu.org/licenses/>.
"""
Test for checking if the collections are sorted correctly.
"""
import pathlib
import re
from typing import Any, Generator
import pytest
from playwright.sync_api import Page, expect
from integ_tests.common import SHARING_HTPASSWD, login, start_radicale_server
@pytest.fixture
def radicale_server(tmp_path: pathlib.Path) -> Generator[str, Any, None]:
yield from start_radicale_server(tmp_path, SHARING_HTPASSWD)
def create_named_collection(page: Page, name: str) -> None:
page.click('.fabcontainer a[data-name="new"]')
page.fill('#createcollectionscene input[data-name="displayname"]', name)
page.click('#createcollectionscene button[data-name="submit"]')
expect(page.locator("#createcollectionscene")).to_be_hidden()
def test_collection_sorting(page: Page, radicale_server: str) -> None:
config = SHARING_HTPASSWD
# 1. Admin logs in and creates "Z" and "A"
login(page, radicale_server, config)
create_named_collection(page, "Z")
create_named_collection(page, "A")
# 2. Admin shares "M" to "max"
create_named_collection(page, "M")
article_m = page.locator("article:not(.hidden)").filter(
has=page.locator("[data-name='title']", has_text="M")
)
article_m.hover()
article_m.locator("a[data-name='share']").click(force=True)
page.click('button[data-name="sharebymap"]')
page.locator('input[data-name="shareuser"]').fill(config.user_username)
page.locator('input[data-name="sharehref"]').fill("m-shared")
page.click('#createeditsharescene button[data-name="submit"]')
page.click('#sharecollectionscene button[data-name="cancel"]')
# 3. Admin logs out
page.click('a[data-name="logout"]')
# 4. Max logs in
page.fill('#loginscene input[data-name="user"]', config.user_username)
page.fill('#loginscene input[data-name="password"]', "userpassword")
page.click('button:has-text("Next")')
# 5. Max creates his own "B" and "Y"
create_named_collection(page, "Y")
create_named_collection(page, "B")
# 6. Max enables the shared collection "M"
page.click('a[data-name="incomingshares"]')
row = page.locator("tr[data-name='incomingsharerowtemplate']:not(.hidden)")
expect(row.locator("input[data-name='pathortoken']")).to_have_value(
re.compile("m-shared")
)
row.locator("input[data-name='enabled']").check()
row.locator("input[data-name='shown']").check()
page.click('#incomingsharingscene button[data-name="close"]')
# 7. Verify the order
# Expected: "B", "Y" (Owned), then "M" (Shared)
# Wait for articles to be rendered
expect(page.locator("article:not(.hidden) [data-name='title']")).to_have_count(3)
titles = page.locator(
"article:not(.hidden) [data-name='title']"
).all_text_contents()
titles = [t.strip() for t in titles if t.strip()]
assert titles == ["B", "Y", "M"], f"Expected order ['B', 'Y', 'M'], got {titles}"
# 8. Max creates "A"
create_named_collection(page, "A")
# Wait for articles to be rendered (now 4)
expect(page.locator("article:not(.hidden) [data-name='title']")).to_have_count(4)
titles = page.locator(
"article:not(.hidden) [data-name='title']"
).all_text_contents()
titles = [t.strip() for t in titles if t.strip()]
# Expected: "A", "B", "Y", then "M"
assert titles == [
"A",
"B",
"Y",
"M",
], f"Expected order ['A', 'B', 'Y', 'M'], got {titles}"

100
integ_tests/test_shared_collection_edit.py Normal file
View File

@@ -0,0 +1,100 @@
# This file is part of Radicale - CalDAV and CardDAV server
# Copyright © 2026-2026 Max Berger <max@berger.name>
#
# This library 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 3 of the License, or
# (at your option) any later version.
#
# This library 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 Radicale. If not, see <http://www.gnu.org/licenses/>.
"""
Integration tests for editing properties of a shared collection.
"""
import pathlib
import re
from typing import Any, Generator
import pytest
from playwright.sync_api import Page, expect
from integ_tests.common import SHARING_HTPASSWD, login, start_radicale_server
@pytest.fixture
def radicale_server(tmp_path: pathlib.Path) -> Generator[str, Any, None]:
yield from start_radicale_server(tmp_path, SHARING_HTPASSWD)
def create_named_collection(page: Page, name: str) -> None:
page.click('.fabcontainer a[data-name="new"]')
page.fill('#createcollectionscene input[data-name="displayname"]', name)
page.click('#createcollectionscene button[data-name="submit"]')
expect(page.locator("#createcollectionscene")).to_be_hidden()
def test_shared_collection_property_edit(page: Page, radicale_server: str) -> None:
config = SHARING_HTPASSWD
# 1. Admin logs in and creates "Shared"
login(page, radicale_server, config)
create_named_collection(page, "Shared")
# 2. Admin shares it with "max" with "Allow Properties write" enabled
article = page.locator("article:not(.hidden)").filter(
has=page.locator("[data-name='title']", has_text="Shared")
)
article.hover()
article.locator("a[data-name='share']").click(force=True)
page.click('button[data-name="sharebymap"]')
page.locator('input[data-name="shareuser"]').fill(config.user_username)
page.locator('input[data-name="sharehref"]').fill("shared-mapped")
# Allow properties write
page.check("#newshare_attr_properties_write_allow")
page.click('#createeditsharescene button[data-name="submit"]')
page.click('#sharecollectionscene button[data-name="cancel"]')
# 3. Admin logs out
page.click('a[data-name="logout"]')
# 4. Max logs in
page.fill('#loginscene input[data-name="user"]', config.user_username)
page.fill('#loginscene input[data-name="password"]', "userpassword")
page.click('button:has-text("Next")')
# 5. Max enables the shared collection
page.click('a[data-name="incomingshares"]')
row = page.locator("tr[data-name='incomingsharerowtemplate']:not(.hidden)")
expect(row.locator("input[data-name='pathortoken']")).to_have_value(
re.compile("shared-mapped")
)
row.locator("input[data-name='enabled']").check()
row.locator("input[data-name='shown']").check()
page.click('#incomingsharingscene button[data-name="close"]')
# 6. Verify "Edit" button is visible
shared_article = page.locator("article:not(.hidden)").filter(
has=page.locator("[data-name='title']", has_text="Shared")
)
shared_article.hover()
expect(shared_article.locator("a[data-name='edit']")).to_be_visible()
# 7. Max edits the collection
shared_article.locator("a[data-name='edit']").click()
page.fill('#editcollectionscene input[data-name="displayname"]', "Renamed by Max")
page.click('#editcollectionscene button[data-name="submit"]')
# 8. Verify the change
expect(
page.locator(
"article:not(.hidden) [data-name='title']", has_text="Renamed by Max"
)
).to_be_visible()

8
integ_tests/test_sharing_login.py
View File

@@ -151,11 +151,9 @@ def test_incoming_shares(
expect(article.locator('[data-name="shareoption"]')).to_be_hidden()
expect(article.locator('a[data-name="delete"]')).to_be_hidden()
# Edit button depends on permissions
if permissions == "rw":
expect(article.locator('a[data-name="edit"]')).to_be_visible()
else:
expect(article.locator('a[data-name="edit"]')).to_be_hidden()
# Edit button is visible if either data write or property write is allowed.
# In the test environment, permit_properties_overlay is true, so it's always visible.
expect(article.locator('a[data-name="edit"]')).to_be_visible()
# 7. Assert no error was shown
expect(page.locator('#incomingsharingscene span[data-name="error"]')).to_be_hidden()

5
radicale/web/internal_data/js/api/api.js
View File

@@ -103,11 +103,6 @@ export function get_collections(user, password, collection, callback) {
collections.push(parsedCollection);
}
}
collections.sort(function (a, b) {
/** @type {string} */ let ca = a.displayname || a.href;
/** @type {string} */ let cb = b.displayname || b.href;
return ca.localeCompare(cb);
});
callback(collections, null);
} else {
callback(null, "No valid XML received");

311
radicale/web/internal_data/js/scenes/CollectionsScene.js
View File

@@ -22,6 +22,7 @@
import { delete_collection } from "../api/api.js";
import { get_auth_header } from "../api/common.js";
import { Collection, CollectionType, Permission } from "../models/collection.js";
import { extract_title } from "../utils/collection_utils.js";
import { collectionsCache } from "../utils/collections_cache.js";
import { ErrorHandler } from "../utils/error.js";
import { bytesToHumanReadable, completeHref, get_element, get_element_by_id } from "../utils/misc.js";
@@ -134,149 +135,197 @@ export class CollectionsScene {
}
/**
* @param {any[]} collections
* @param {Collection[]} collections
* @param {import("../api/sharing.js").Share[]} shares
* @param {boolean} clear_error
*/
_show_collections(collections, shares, clear_error) {
/** @type {HTMLElement} */ let navBar = get_element(document, "#logoutview");
let heightOfNavBar = navBar.offsetHeight + "px";
this._html_scene.style.marginTop = heightOfNavBar;
this._html_scene.style.height = "calc(100vh - " + heightOfNavBar + ")";
_sort_collections(collections, shares) {
collections.sort((a, b) => {
const getShare = (/** @type {Collection} */ col) => (shares || []).find(
s => (s.ShareType === "map") &&
decodeURIComponent(s.PathOrToken || "").replace(/\/+$/, "") === decodeURIComponent(col.href || "").replace(/\/+$/, ""));
if (clear_error) {
this._errorHandler.clearError();
}
const shareA = getShare(a);
const shareB = getShare(b);
// Clear old nodes
const ownedA = !shareA || shareA.Owner === this._user;
const ownedB = !shareB || shareB.Owner === this._user;
if (ownedA && !ownedB) return -1;
if (!ownedA && ownedB) return 1;
return extract_title(a).localeCompare(extract_title(b));
});
}
/**
* Clears all collection nodes from the DOM and resets the nodes array.
*/
_clear_collections_display() {
this._nodes.forEach(function (node) {
if (node.parentNode) {
node.parentNode.removeChild(node);
}
});
this._nodes = [];
}
collections.forEach((/** @type {Collection} */ collection) => {
/** @type {HTMLElement} */ let node = /** @type {HTMLElement} */(this._template.cloneNode(true));
node.classList.remove("hidden");
/** @type {HTMLElement} */ let title_form = get_element(node, "[data-name=title]");
/** @type {HTMLElement} */ let description_form = get_element(node, "[data-name=description]");
/** @type {HTMLElement} */ let contentcount_form = get_element(node, "[data-name=contentcount]");
/** @type {HTMLInputElement} */ let url_form = /** @type {HTMLInputElement} */ (get_element(node, "[data-name=url]"));
/** @type {HTMLElement} */ let color_form = get_element(node, "[data-name=color]");
/** @type {HTMLElement} */ let delete_btn = get_element(node, "[data-name=delete]");
/** @type {HTMLElement} */ let edit_btn = get_element(node, "[data-name=edit]");
/** @type {HTMLElement} */ let share_btn = get_element(node, "[data-name=share]");
/** @type {HTMLAnchorElement} */ let download_btn = /** @type {HTMLAnchorElement} */ (get_element(node, "[data-name=download]"));
/** @type {HTMLButtonElement} */ let copy_btn = /** @type {HTMLButtonElement} */ (get_element(node, "[data-name=copy-url]"));
if (collection.color) {
color_form.style.background = collection.color;
}
let possible_types = [CollectionType.ADDRESSBOOK, CollectionType.WEBCAL];
[CollectionType.CALENDAR, ""].forEach(function (e) {
[CollectionType.union(e, CollectionType.JOURNAL), e].forEach(function (e) {
[CollectionType.union(e, CollectionType.TASKS), e].forEach(function (e) {
if (e) {
possible_types.push(e);
}
});
});
});
possible_types.forEach(function (e) {
if (e !== collection.type) {
get_element(node, "[data-name=" + e + "]").classList.add("hidden");
}
});
/**
* Sets up the scene layout by adjusting margins based on the navbar height.
*/
_setup_layout() {
/** @type {HTMLElement} */ let navBar = get_element(document, "#logoutview");
let heightOfNavBar = navBar.offsetHeight + "px";
this._html_scene.style.marginTop = heightOfNavBar;
this._html_scene.style.height = "calc(100vh - " + heightOfNavBar + ")";
}
let share_option = get_element(node, "[data-name=shareoption]");
let can_share = collection.has_permission(Permission.SHARE_MAP) || collection.has_permission(Permission.SHARE_TOKEN);
if (share_option) {
if (can_share) {
share_option.classList.remove("hidden");
} else {
share_option.classList.add("hidden");
}
}
let share_info = get_element(node, "[data-name=shared-by]");
let transformed_from = get_element(node, "[data-name=transformed-from]");
let share = (shares || []).find(
s => (s.ShareType === "map") &&
decodeURIComponent(s.PathOrToken || "").replace(/\/+$/, "") === decodeURIComponent(collection.href || "").replace(/\/+$/, ""));
if (share) {
if (share.Owner !== this._user) {
share_info.classList.remove("hidden");
get_element(node, "[data-name=shared-by-owner]").textContent = share.Owner;
} else {
transformed_from.classList.remove("hidden");
}
let share_option = get_element(node, "[data-name=shareoption]");
if (share_option) {
share_option.classList.add("hidden");
share_option.removeAttribute("data-name");
}
delete_btn.classList.add("hidden");
if (!/w/i.test(share.Permissions || "")) {
edit_btn.classList.add("hidden");
} else {
edit_btn.classList.remove("hidden");
}
}
title_form.textContent = collection.displayname || collection.href;
if (title_form.textContent.length > 30) {
title_form.classList.add("smalltext");
}
description_form.textContent = collection.description;
if (description_form.textContent.length > 150) {
description_form.classList.add("smalltext");
}
if (collection.type != CollectionType.WEBCAL) {
let contentcount_form_txt = (collection.contentcount > 0 ? Number(collection.contentcount).toLocaleString() : "No") + " item" + (collection.contentcount == 1 ? "" : "s") + " in collection";
if (collection.contentcount > 0) {
contentcount_form_txt += " (" + bytesToHumanReadable(collection.size) + ")";
}
contentcount_form.textContent = contentcount_form_txt;
}
let href = completeHref(collection.href);
new UrlTextHandler(url_form, copy_btn).setHref(href);
download_btn.href = href;
download_btn.onclick = (event) => {
event.preventDefault();
let auth = get_auth_header(this._user, this._password);
let headers = auth ? {
'Authorization': auth
} : undefined;
fetch(href, { headers: headers }).then(function (response) {
if (response.ok) {
return response.blob();
/**
* @param {Collection} collection
* @param {import("../api/sharing.js").Share[]} shares
*/
_render_collection(collection, shares) {
/** @type {HTMLElement} */ let node = /** @type {HTMLElement} */(this._template.cloneNode(true));
node.classList.remove("hidden");
/** @type {HTMLElement} */ let title_form = get_element(node, "[data-name=title]");
/** @type {HTMLElement} */ let description_form = get_element(node, "[data-name=description]");
/** @type {HTMLElement} */ let contentcount_form = get_element(node, "[data-name=contentcount]");
/** @type {HTMLInputElement} */ let url_form = /** @type {HTMLInputElement} */ (get_element(node, "[data-name=url]"));
/** @type {HTMLElement} */ let color_form = get_element(node, "[data-name=color]");
/** @type {HTMLElement} */ let delete_btn = get_element(node, "[data-name=delete]");
/** @type {HTMLElement} */ let edit_btn = get_element(node, "[data-name=edit]");
/** @type {HTMLElement} */ let share_btn = get_element(node, "[data-name=share]");
/** @type {HTMLAnchorElement} */ let download_btn = /** @type {HTMLAnchorElement} */ (get_element(node, "[data-name=download]"));
/** @type {HTMLButtonElement} */ let copy_btn = /** @type {HTMLButtonElement} */ (get_element(node, "[data-name=copy-url]"));
if (collection.color) {
color_form.style.background = collection.color;
}
let possible_types = [CollectionType.ADDRESSBOOK, CollectionType.WEBCAL];
[CollectionType.CALENDAR, ""].forEach(function (e) {
[CollectionType.union(e, CollectionType.JOURNAL), e].forEach(function (e) {
[CollectionType.union(e, CollectionType.TASKS), e].forEach(function (e) {
if (e) {
possible_types.push(e);
}
throw new Error("Download failed: " + response.statusText);
}).then(function (blob) {
let url = window.URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = url;
a.download = (collection.displayname || collection.href).replace(/\/+$/, "") + (collection.type === CollectionType.ADDRESSBOOK ? ".vcf" : ".ics");
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
})["catch"]((error) => {
this._errorHandler.setError(error.message);
});
};
if (collection.type == CollectionType.WEBCAL) {
if (download_btn.parentElement) {
download_btn.parentElement.classList.add("hidden");
});
});
possible_types.forEach(function (e) {
if (e !== collection.type) {
get_element(node, "[data-name=" + e + "]").classList.add("hidden");
}
});
let share_option = get_element(node, "[data-name=shareoption]");
let can_share = collection.has_permission(Permission.SHARE_MAP) || collection.has_permission(Permission.SHARE_TOKEN);
if (share_option) {
if (can_share) {
share_option.classList.remove("hidden");
} else {
share_option.classList.add("hidden");
}
}
let share_info = get_element(node, "[data-name=shared-by]");
let transformed_from = get_element(node, "[data-name=transformed-from]");
let share = (shares || []).find(
s => (s.ShareType === "map") &&
decodeURIComponent(s.PathOrToken || "").replace(/\/+$/, "") === decodeURIComponent(collection.href || "").replace(/\/+$/, ""));
if (share) {
if (share.Owner !== this._user) {
share_info.classList.remove("hidden");
get_element(node, "[data-name=shared-by-owner]").textContent = share.Owner;
} else {
transformed_from.classList.remove("hidden");
}
let share_option = get_element(node, "[data-name=shareoption]");
if (share_option) {
share_option.classList.add("hidden");
share_option.removeAttribute("data-name");
}
delete_btn.classList.add("hidden");
let has_write_permission = /w/i.test(share.Permissions || "");
let has_write_properties = /P/i.test(share.Permissions || "") || collection.has_permission(Permission.WRITE_PROPERTIES);
if (has_write_permission || has_write_properties) {
edit_btn.classList.remove("hidden");
} else {
edit_btn.classList.add("hidden");
}
}
title_form.textContent = collection.displayname || collection.href;
if (title_form.textContent.length > 30) {
title_form.classList.add("smalltext");
}
description_form.textContent = collection.description;
if (description_form.textContent.length > 150) {
description_form.classList.add("smalltext");
}
if (collection.type != CollectionType.WEBCAL) {
let contentcount_form_txt = (collection.contentcount > 0 ? Number(collection.contentcount).toLocaleString() : "No") + " item" + (collection.contentcount == 1 ? "" : "s") + " in collection";
if (collection.contentcount > 0) {
contentcount_form_txt += " (" + bytesToHumanReadable(collection.size) + ")";
}
contentcount_form.textContent = contentcount_form_txt;
}
let href = completeHref(collection.href);
new UrlTextHandler(url_form, copy_btn).setHref(href);
download_btn.href = href;
download_btn.onclick = (event) => {
event.preventDefault();
let auth = get_auth_header(this._user, this._password);
let headers = auth ? {
'Authorization': auth
} : undefined;
fetch(href, { headers: headers }).then(function (response) {
if (response.ok) {
return response.blob();
}
throw new Error("Download failed: " + response.statusText);
}).then(function (blob) {
let url = window.URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = url;
a.download = (collection.displayname || collection.href).replace(/\/+$/, "") + (collection.type === CollectionType.ADDRESSBOOK ? ".vcf" : ".ics");
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
})["catch"]((error) => {
this._errorHandler.setError(error.message);
});
};
if (collection.type == CollectionType.WEBCAL) {
if (download_btn.parentElement) {
download_btn.parentElement.classList.add("hidden");
}
delete_btn.onclick = () => { return this._ondelete(collection); };
edit_btn.onclick = () => { return this._onedit(collection); };
share_btn.onclick = () => { return this._onshare(collection); };
node.classList.remove("hidden");
this._nodes.push(node);
if (this._template.parentNode) {
this._template.parentNode.insertBefore(node, this._template);
}
}
delete_btn.onclick = () => { return this._ondelete(collection); };
edit_btn.onclick = () => { return this._onedit(collection); };
share_btn.onclick = () => { return this._onshare(collection); };
node.classList.remove("hidden");
this._nodes.push(node);
if (this._template.parentNode) {
this._template.parentNode.insertBefore(node, this._template);
}
}
/**
* @param {Collection[]} collections
* @param {import("../api/sharing.js").Share[]} shares
* @param {boolean} clear_error
*/
_show_collections(collections, shares, clear_error) {
this._setup_layout();
if (clear_error) {
this._errorHandler.clearError();
}
this._sort_collections(collections, shares);
this._clear_collections_display();
collections.forEach((collection) => {
this._render_collection(collection, shares);
});
}
@@ -299,13 +348,7 @@ export class CollectionsScene {
this._new_btn.onclick = null;
this._upload_btn.onclick = null;
this._incomingshares_btn.onclick = null;
// remove collection
this._nodes.forEach(function (node) {
if (node.parentNode) {
node.parentNode.removeChild(node);
}
});
this._nodes = [];
this._clear_collections_display();
}
release() {

2
radicale/web/internal_data/js/utils/collection_utils.js
View File

@@ -44,7 +44,7 @@ export function extractUsernameFromPrincipalCollection(principal_collection) {
export function extract_title(collection) {
if (collection.displayname && collection.displayname.length > 0) {
return collection.displayname;
} else if (collection.type = CollectionType.PRINCIPAL) {
} else if (collection.type === CollectionType.PRINCIPAL) {
return extractUsernameFromPrincipalCollection(collection)
} else
return decodeURIComponent(collection.href);