svemagie/indiekit-endpoint-activitypub
1
0
Fork 0
mirror of https://github.com/svemagie/indiekit-endpoint-activitypub.git synced 2026-04-02 15:44:58 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: use $root for data attribute reads in Alpine interaction component

Browse Source 
The extracted apCardInteraction component read data-mount-path,
data-csrf-token, and data-item-uid from this.$el inside interact(),
but $el may not be the x-data root when called from a child button
click. The old inline code used this.$root. Fixed by reading all
data attributes in init() and storing as component properties.
This commit is contained in:
Ricardo
2026-03-25 08:31:17 +01:00
parent 624a907946
commit 3265341189
2 changed files with 22 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
assets/reader-interactions.js
View File

@@ -23,19 +23,30 @@ document.addEventListener("alpine:init", () => {
likeCount: null,
boostCount: null,
// Stored from data attributes in init() — must use $root to guarantee
// we read from the x-data element, not a child element in event context.
_mountPath: "",
_csrfToken: "",
_itemUid: "",
_itemUrl: "",
init() {
this.liked = this.$el.dataset.liked === "true";
this.boosted = this.$el.dataset.boosted === "true";
const lc = this.$el.dataset.likeCount;
const bc = this.$el.dataset.boostCount;
const root = this.$root;
this.liked = root.dataset.liked === "true";
this.boosted = root.dataset.boosted === "true";
this._mountPath = root.dataset.mountPath || "";
this._csrfToken = root.dataset.csrfToken || "";
this._itemUid = root.dataset.itemUid || "";
this._itemUrl = root.dataset.itemUrl || "";
const lc = root.dataset.likeCount;
const bc = root.dataset.boostCount;
this.likeCount = lc != null && lc !== "" ? Number(lc) : null;
this.boostCount = bc != null && bc !== "" ? Number(bc) : null;
},
async saveLater() {
if (this.saved) return;
const el = this.$el;
const itemUrl = el.dataset.itemUrl;
const itemUrl = this._itemUrl;
try {
const res = await fetch("/readlater/save", {
method: "POST",
@@ -43,7 +54,7 @@ document.addEventListener("alpine:init", () => {
body: JSON.stringify({
url: itemUrl,
title:
el.closest("article")?.querySelector("p")?.textContent?.substring(0, 80) ||
this.$root.closest("article")?.querySelector("p")?.textContent?.substring(0, 80) ||
itemUrl,
source: "activitypub",
}),
@@ -61,10 +72,9 @@ document.addEventListener("alpine:init", () => {
if (this.loading) return;
this.loading = true;
this.error = "";
const el = this.$el;
const itemUid = el.dataset.itemUid;
const csrfToken = el.dataset.csrfToken;
const basePath = el.dataset.mountPath;
const itemUid = this._itemUid;
const csrfToken = this._csrfToken;
const basePath = this._mountPath;
const prev = {
liked: this.liked,
boosted: this.boosted,