Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
fa0859dcdd | ||
|
|
0c340316ae | ||
|
|
313a55992f | ||
|
|
ece3a136c1 | ||
|
|
543ae6a1b3 | ||
|
|
508952a1ea | ||
|
|
15ef106eb5 | ||
|
|
a42edcf6d6 | ||
|
|
0267233f87 | ||
|
|
6b45092bc8 |
@@ -48,18 +48,18 @@ Remove inline replies from the feed. Show only the original post with interactio
|
||||
|
||||
### Tasks
|
||||
|
||||
- [ ] **1.1** In `feed2.html`, remove the inline comment rendering and the "Comments" toggle button. The feed should only show top-level posts.
|
||||
- [x] **1.1** In `feed2.html`, remove the inline comment rendering and the "Comments" toggle button. The feed should only show top-level posts.
|
||||
|
||||
- [ ] **1.2** Change the comment button behavior — instead of calling `onCommentIntentFn` to show inline comments, open `post-feed.html?event=<eventId>` in a **new tab** using `window.open('./post-feed.html?event=' + encodeURIComponent(postId), '_blank')`.
|
||||
- [x] **1.2** Change the comment button behavior — instead of calling `onCommentIntentFn` to show inline comments, open `post-feed.html?event=<eventId>` in a **new tab** using `window.open('./post-feed.html?event=' + encodeURIComponent(postId), '_blank')`.
|
||||
|
||||
- [ ] **1.3** Keep the interaction bar functional in the feed:
|
||||
- [x] **1.3** Keep the interaction bar functional in the feed:
|
||||
- ✅ Like button — works inline (no navigation)
|
||||
- ✅ Zap button — works inline (opens zap dialog, sends nutzap or Lightning melt)
|
||||
- ✅ Nutzap count display — shows total nutzaps received
|
||||
- 🔄 Comment button — opens `post-feed.html?event=<eventId>` in a new tab
|
||||
- 🔄 Quote button — opens quote composer (no navigation)
|
||||
- ✅ Comment button — opens `post-feed.html?event=<eventId>` in a new tab
|
||||
- ✅ Quote button — opens quote composer (no navigation)
|
||||
|
||||
- [ ] **1.4** Keep real-time updates for counts (likes, zaps, comments, nutzaps) — the feed should still update these counts as events arrive, just not render the reply content inline.
|
||||
- [x] **1.4** Keep real-time updates for counts (likes, zaps, comments, nutzaps) — the feed should still update these counts as events arrive, just not render the reply content inline.
|
||||
|
||||
### Files to modify
|
||||
|
||||
@@ -86,27 +86,28 @@ Accepts the same event identifier formats as the rest of the project:
|
||||
|
||||
### Tasks
|
||||
|
||||
- [ ] **2.1** Create `www/post-feed.html` based on the [`www/template.html`](www/template.html) pattern — standard header, hamburger, sidenav, footer.
|
||||
- [x] **2.1** Create `www/post-feed.html` based on the [`www/template.html`](www/template.html) pattern — standard header, hamburger, sidenav, footer.
|
||||
|
||||
- [ ] **2.2** Parse the `event` URL parameter using `URLSearchParams` (same pattern as `post.html` line 248). Decode nevent/note to hex if needed.
|
||||
- [x] **2.2** Parse the `event` URL parameter using `URLSearchParams` (same pattern as `post.html` line 248). Decode nevent/note to hex if needed.
|
||||
|
||||
- [ ] **2.3** Fetch the original post event via the worker's `ndkFetchEvents` or `queryCache` function. Display it using `renderPostItem` from `post-interactions.mjs`.
|
||||
- [x] **2.3** Fetch the original post event via the worker's `ndkFetchEvents` or `queryCache` function. Display it using `renderPostItem` from `post-interactions.mjs`.
|
||||
|
||||
- [ ] **2.4** Fetch all replies — kind 1 events with an `e` tag pointing to the post ID. Use `ndkFetchEvents` with a filter like `{ kinds: [1], '#e': [postId] }`.
|
||||
- [x] **2.4** Fetch all replies — kind 1 events with an `e` tag pointing to the post ID. Use `ndkFetchEvents` with a filter like `{ kinds: [1], '#e': [postId] }`. **Updated:** Now uses recursive fetching (`fetchRepliesRecursive`) to find nested replies up to 5 levels deep.
|
||||
|
||||
- [ ] **2.5** Render the comment thread below the original post:
|
||||
- Flat thread (all replies in chronological order) — simplest, most reliable
|
||||
- Each reply rendered using `renderPostItem` from `post-interactions.mjs`
|
||||
- Start with flat; can add nesting/threading later
|
||||
- [x] **2.5** Render the comment thread below the original post:
|
||||
- Threaded with vertical indent lines (Phase 2.5)
|
||||
- Each reply rendered using `renderPostItem` from `post-interactions2.mjs`
|
||||
- Depth-first ordering with level computation from NIP-10 e tags
|
||||
|
||||
- [ ] **2.6** Add an inline composer at the bottom for posting replies. The composer should:
|
||||
- Tag the original post: `['e', postId, '', 'reply']`
|
||||
- Tag the original author: `['p', postPubkey]`
|
||||
- Use the existing post composer component (`post-composer.mjs`)
|
||||
- [x] **2.6** Add an inline composer at the **top** (under the main post, before replies) for posting replies. The composer:
|
||||
- Tags the original post: `['e', postId, '', 'reply']`
|
||||
- Tags the original author: `['p', postPubkey]`
|
||||
- Uses the existing post composer component (`post-composer.mjs`)
|
||||
- Styled to match `post.html`'s composer (`.topPostComposerInput` CSS)
|
||||
|
||||
- [ ] **2.7** Real-time updates — subscribe to new replies via the worker's subscription system. Append new replies to the thread as they arrive.
|
||||
- [x] **2.7** Real-time updates — subscribe to new replies via the worker's subscription system. Append new replies to the thread as they arrive. New replies trigger a 1-level recursive fetch for their sub-replies.
|
||||
|
||||
- [ ] **2.8** Each reply should have its own interaction bar (like, zap, quote) via `post-interactions.mjs`. The comment button on a reply opens `post-feed.html?event=<replyId>` in a new tab for that reply's sub-thread.
|
||||
- [x] **2.8** Each reply should have its own interaction bar (like, zap, quote) via `post-interactions2.mjs`. The comment button on a reply opens `post-feed.html?event=<replyId>` in a new tab for that reply's sub-thread.
|
||||
|
||||
### Files to create
|
||||
|
||||
@@ -154,33 +155,28 @@ Each `│` is a vertical line drawn with CSS `border-left` on a container div. T
|
||||
|
||||
### Tasks
|
||||
|
||||
- [ ] **2.5.1** Add a `computeReplyLevels(events, rootEventId)` function to `post-feed.html` (or a shared module):
|
||||
- [x] **2.5.1** Add a `computeReplyLevels(events, rootEventId)` function to `post-feed.html`:
|
||||
- Build a map of `eventId → parentEventId` from the `e` tags (NIP-10 marked reply tags)
|
||||
- For each event, compute its level by walking up the parent chain to the root
|
||||
- Root post = level 0, direct reply = level 1, reply to reply = level 2, etc.
|
||||
- Handle missing parents gracefully (if a parent isn't in the fetched set, treat as level 1)
|
||||
- Return a `Map<eventId, level>`
|
||||
|
||||
- [ ] **2.5.2** Sort replies in depth-first order (like Amethyst's `replyLevelSignature`):
|
||||
- [x] **2.5.2** Sort replies in depth-first order (like Amethyst's `replyLevelSignature`):
|
||||
- Root post first
|
||||
- Then replies grouped by parent, in chronological order within each group
|
||||
- This makes the vertical lines visually contiguous — a reply's children appear right below it
|
||||
|
||||
- [ ] **2.5.3** Render each reply with vertical indent lines:
|
||||
- Wrap each reply in a container div with `padding-left: calc(level * 12px)` (or similar)
|
||||
- For each level 0..N-1, add a vertical line using `border-left: 2px solid var(--muted-color)` on a positioned div
|
||||
- [x] **2.5.3** Render each reply with vertical indent lines:
|
||||
- Wrap each reply in a container div with `padding-left: calc(level * 12px)`
|
||||
- For each level 0..N-1, add a vertical line using positioned divs with `background: var(--muted-color)`
|
||||
- The last line (level N-1) uses `var(--accent-color)` if this is the focused post, otherwise `var(--muted-color)`
|
||||
- Use CSS pseudo-elements or nested divs for the lines
|
||||
|
||||
- [ ] **2.5.4** Add collapse/expand functionality:
|
||||
- Each reply has a collapse toggle (small button or click on the vertical line)
|
||||
- Collapsing a reply hides all of its descendants
|
||||
- Show a count of hidden replies when collapsed (e.g., "3 replies hidden")
|
||||
- Collapsed state stored in a Set in memory
|
||||
- [x] ~~**2.5.4** Add collapse/expand functionality~~ — **Removed per user request.** All replies are shown, no collapse.
|
||||
|
||||
- [ ] **2.5.5** Highlight the focused post:
|
||||
- If the URL has a `#<eventId>` hash or a `focus=<eventId>` param, scroll to and highlight that post
|
||||
- The highlighted post's vertical line uses `var(--accent-color)`
|
||||
- [x] **2.5.5** Highlight the focused post:
|
||||
- If the URL has a `focus=<eventId>` param, scroll to and highlight that post
|
||||
- The highlighted post's vertical line uses `var(--accent-color)` and card gets `var(--accent-color)` outline
|
||||
|
||||
### CSS approach (CSS variables only)
|
||||
|
||||
|
||||
@@ -1388,6 +1388,136 @@ a.nostr-embed-preview-text:hover {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
/* Zap rail selector (Phase 4 — nutzap vs Lightning) */
|
||||
.zap-rail-toggle {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.zap-rail-option {
|
||||
flex: 1;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
background: var(--background-color);
|
||||
color: var(--muted-color);
|
||||
font-family: var(--font-family);
|
||||
font-size: 13px;
|
||||
padding: 8px 10px;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zap-rail-option.active {
|
||||
border-color: var(--accent-color);
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
.zap-rail-single {
|
||||
display: block;
|
||||
border: 1px solid var(--accent-color);
|
||||
border-radius: 8px;
|
||||
background: var(--background-color);
|
||||
color: var(--accent-color);
|
||||
font-family: var(--font-family);
|
||||
font-size: 13px;
|
||||
padding: 8px 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zap-selector-balance {
|
||||
font-size: 12px;
|
||||
color: var(--muted-color);
|
||||
}
|
||||
|
||||
.zap-selector-warning {
|
||||
font-size: 12px;
|
||||
color: var(--accent-color);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.zap-selector-mint-info {
|
||||
font-size: 12px;
|
||||
color: var(--muted-color);
|
||||
}
|
||||
|
||||
.zap-selector-error {
|
||||
font-size: 13px;
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
.zap-send:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Nutzap recipient mint list (promptNutzapDetails) */
|
||||
.zap-selector-mint-list {
|
||||
list-style: none;
|
||||
margin: 4px 0 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.zap-selector-mint-list-item {
|
||||
font-size: 11px;
|
||||
color: var(--muted-color);
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.zap-selector-mint-list-item.shared {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
/* Nutzap interaction item (post footer) */
|
||||
.interaction-item.nutzap {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.interaction-item.nutzap .interaction-icon {
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.interaction-item.nutzap.zap-pending {
|
||||
color: var(--muted-color);
|
||||
}
|
||||
|
||||
.interaction-item.nutzap.zap-pending .interaction-icon,
|
||||
.interaction-item.nutzap.zap-pending .interaction-icon.active,
|
||||
.interaction-item.nutzap.zap-pending .interaction-count {
|
||||
color: var(--muted-color) !important;
|
||||
transition: color 240ms linear !important;
|
||||
}
|
||||
|
||||
.interaction-item.nutzap.zap-pending.zap-pending-accent .interaction-icon,
|
||||
.interaction-item.nutzap.zap-pending.zap-pending-accent .interaction-icon.active,
|
||||
.interaction-item.nutzap.zap-pending.zap-pending-accent .interaction-count {
|
||||
color: var(--accent-color) !important;
|
||||
}
|
||||
|
||||
.interaction-item.nutzap.zap-success,
|
||||
.interaction-item.nutzap.zap-success .interaction-icon,
|
||||
.interaction-item.nutzap.zap-success .interaction-icon.active,
|
||||
.interaction-item.nutzap.zap-success .interaction-count {
|
||||
color: var(--accent-color) !important;
|
||||
}
|
||||
|
||||
/* Dimmed (capability unavailable) interaction items */
|
||||
.interaction-item.dimmed {
|
||||
opacity: 0.45;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.interaction-item.dimmed:hover {
|
||||
color: var(--muted-color);
|
||||
}
|
||||
|
||||
.interaction-item.dimmed:hover .interaction-icon {
|
||||
color: var(--muted-color);
|
||||
}
|
||||
|
||||
/* ************************************************************************* */
|
||||
/* AUTHOR HEADER */
|
||||
/* ************************************************************************* */
|
||||
|
||||
@@ -87,7 +87,9 @@
|
||||
|
||||
<div id="divFooter">
|
||||
<div id="divFooterLeft" class="divFooterBox"></div>
|
||||
<div id="divFooterCenter" class="divFooterBox"></div>
|
||||
<div id="divFooterCenter" class="divFooterBox">
|
||||
<button id="commentsToggleButton">Comments</button>
|
||||
</div>
|
||||
<div id="divFooterRight" class="divFooterBox"></div>
|
||||
<div id="divFooterBalance" class="divFooterBox">0 sats</div>
|
||||
</div>
|
||||
@@ -279,10 +281,18 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
return entry;
|
||||
}
|
||||
|
||||
function handleComposerCommentIntent({ postId }) {
|
||||
if (!postId) return false;
|
||||
window.open('./post-feed.html?event=' + encodeURIComponent(postId), '_blank');
|
||||
return true;
|
||||
function handleComposerCommentIntent({ postId, postPubkey }) {
|
||||
const postEl = document.querySelector(`.divPostItem[data-post-id="${postId}"]`);
|
||||
if (!postEl) return false;
|
||||
|
||||
const entry = getOrCreateInlineComposer(postId, postEl);
|
||||
if (!entry) return false;
|
||||
entry.tags = [
|
||||
['e', postId, '', 'reply'],
|
||||
['p', postPubkey]
|
||||
];
|
||||
if (entry.instance?.show) entry.instance.show();
|
||||
return focusInlineComposer(entry.hostEl, '');
|
||||
}
|
||||
|
||||
function handleComposerQuoteIntent({ postId, postPubkey }) {
|
||||
@@ -325,7 +335,6 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
publishEvent,
|
||||
getPubkey,
|
||||
ndkFetchEvents,
|
||||
queryCache,
|
||||
fetchCachedProfile,
|
||||
storeProfile,
|
||||
walletPayInvoice,
|
||||
@@ -630,6 +639,12 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
|
||||
document.getElementById('logoutButton')?.addEventListener('click', logout);
|
||||
|
||||
document.getElementById('commentsToggleButton')?.addEventListener('click', () => {
|
||||
const nextVisible = !cards.getCommentsVisible();
|
||||
cards.setCommentsVisible(nextVisible);
|
||||
document.getElementById('commentsToggleButton')?.classList.toggle('dimmed', !nextVisible);
|
||||
});
|
||||
|
||||
btnSeeMore.addEventListener('click', () => {
|
||||
displayCount += SEE_MORE_INCREMENT;
|
||||
renderFeed();
|
||||
@@ -705,7 +720,7 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
|
||||
} catch (error) {
|
||||
console.error('[feed.html] Initialization failed:', error);
|
||||
divBody.innerHTML = `<div style="text-align:center;padding:50px;"><div style="font-size:24px;margin-bottom:20px;color:var(--primary-color);">❌ Error</div><div style="font-size:16px;color:var(--muted-color);">${error.message}</div></div>`;
|
||||
divBody.innerHTML = `<div style="text-align:center;padding:50px;"><div style="font-size:24px;margin-bottom:20px;color:red;">❌ Error</div><div style="font-size:16px;">${error.message}</div></div>`;
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
@@ -87,9 +87,7 @@
|
||||
|
||||
<div id="divFooter">
|
||||
<div id="divFooterLeft" class="divFooterBox"></div>
|
||||
<div id="divFooterCenter" class="divFooterBox">
|
||||
<button id="commentsToggleButton">Comments</button>
|
||||
</div>
|
||||
<div id="divFooterCenter" class="divFooterBox"></div>
|
||||
<div id="divFooterRight" class="divFooterBox"></div>
|
||||
<div id="divFooterBalance" class="divFooterBox">0 sats</div>
|
||||
</div>
|
||||
@@ -157,6 +155,8 @@
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetBalance,
|
||||
walletGetMints,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -281,18 +281,10 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
return entry;
|
||||
}
|
||||
|
||||
function handleComposerCommentIntent({ postId, postPubkey }) {
|
||||
const postEl = document.querySelector(`.divPostItem[data-post-id="${postId}"]`);
|
||||
if (!postEl) return false;
|
||||
|
||||
const entry = getOrCreateInlineComposer(postId, postEl);
|
||||
if (!entry) return false;
|
||||
entry.tags = [
|
||||
['e', postId, '', 'reply'],
|
||||
['p', postPubkey]
|
||||
];
|
||||
if (entry.instance?.show) entry.instance.show();
|
||||
return focusInlineComposer(entry.hostEl, '');
|
||||
function handleComposerCommentIntent({ postId }) {
|
||||
if (!postId) return false;
|
||||
window.open('./post-feed.html?event=' + encodeURIComponent(postId), '_blank');
|
||||
return true;
|
||||
}
|
||||
|
||||
function handleComposerQuoteIntent({ postId, postPubkey }) {
|
||||
@@ -335,11 +327,14 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
publishEvent,
|
||||
getPubkey,
|
||||
ndkFetchEvents,
|
||||
queryCache,
|
||||
fetchCachedProfile,
|
||||
storeProfile,
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetBalance,
|
||||
walletGetMints,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -348,6 +343,12 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
onMuteIntent: handleMuteIntent
|
||||
});
|
||||
|
||||
// Disable inline comment rendering — the new feed shows posts only.
|
||||
// Comments are viewed on the post-feed.html thread page (new tab).
|
||||
if (typeof cards.setCommentsVisible === 'function') {
|
||||
cards.setCommentsVisible(false);
|
||||
}
|
||||
|
||||
function initHamburgerMenu() {
|
||||
hamburgerInstance = new HamburgerMorphing('#divSvgHam', {
|
||||
foreground: 'var(--primary-color)',
|
||||
@@ -639,12 +640,6 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
|
||||
document.getElementById('logoutButton')?.addEventListener('click', logout);
|
||||
|
||||
document.getElementById('commentsToggleButton')?.addEventListener('click', () => {
|
||||
const nextVisible = !cards.getCommentsVisible();
|
||||
cards.setCommentsVisible(nextVisible);
|
||||
document.getElementById('commentsToggleButton')?.classList.toggle('dimmed', !nextVisible);
|
||||
});
|
||||
|
||||
btnSeeMore.addEventListener('click', () => {
|
||||
displayCount += SEE_MORE_INCREMENT;
|
||||
renderFeed();
|
||||
@@ -720,7 +715,7 @@ import { initPostCards } from './js/post-interactions2.mjs';
|
||||
|
||||
} catch (error) {
|
||||
console.error('[feed.html] Initialization failed:', error);
|
||||
divBody.innerHTML = `<div style="text-align:center;padding:50px;"><div style="font-size:24px;margin-bottom:20px;color:red;">❌ Error</div><div style="font-size:16px;">${error.message}</div></div>`;
|
||||
divBody.innerHTML = `<div style="text-align:center;padding:50px;"><div style="font-size:24px;margin-bottom:20px;color:var(--primary-color);">❌ Error</div><div style="font-size:16px;color:var(--muted-color);">${error.message}</div></div>`;
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
@@ -9,8 +9,10 @@ import { createProfileCache } from './profile-cache.mjs';
|
||||
import { mountDotMenu } from './dot-menu.mjs';
|
||||
import {
|
||||
promptZapDetails,
|
||||
promptNutzapDetails,
|
||||
prepareZapInvoiceForEvent,
|
||||
resolveNutzapSpecForPubkey,
|
||||
resolveZapCapabilities,
|
||||
extractZapAmount as extractZapAmountFromReceipt,
|
||||
extractZapComment as extractZapCommentFromReceipt
|
||||
} from './zaps.mjs';
|
||||
@@ -879,12 +881,13 @@ const ICON_LABELS = {
|
||||
like: { label: 'Like', activeLabel: 'Like' },
|
||||
comment: { label: 'Comment', activeLabel: 'Comment' },
|
||||
quote: { label: 'Quote', activeLabel: 'Quote' },
|
||||
zap: { label: 'Zap', activeLabel: 'Zap' }
|
||||
zap: { label: 'Zap', activeLabel: 'Zap' },
|
||||
nutzap: { label: 'Nutzap', activeLabel: 'Nutzap' }
|
||||
};
|
||||
|
||||
/**
|
||||
* Generate HTML for interaction label text
|
||||
* @param {string} type - Icon type: 'like', 'comment', 'quote', 'zap'
|
||||
* @param {string} type - Icon type: 'like', 'comment', 'quote', 'zap', 'nutzap'
|
||||
* @param {boolean} active - Whether the label is in active/selected state
|
||||
* @returns {string} HTML string with label text
|
||||
*/
|
||||
@@ -957,6 +960,8 @@ let publishEventFn = null;
|
||||
let walletPayInvoiceFn = null;
|
||||
let walletSendNutzapFn = null;
|
||||
let walletFetchMintListFn = null;
|
||||
let walletGetMintsFn = null;
|
||||
let walletGetBalanceFn = null;
|
||||
let getRelayDataFn = null;
|
||||
let getUserSettingsFn = null;
|
||||
let patchUserSettingsFn = null;
|
||||
@@ -1049,7 +1054,7 @@ export function renderFooterRow(eventId, eventData, options = {}) {
|
||||
onClick: () => handleQuoteClick(eventId, eventData.pubkey, currentPubkey, quoteItem)
|
||||
});
|
||||
|
||||
// Zap button
|
||||
// Zap button (Lightning only)
|
||||
const zapItem = createInteractionItem({
|
||||
type: 'zap',
|
||||
count: state.zapTotal,
|
||||
@@ -1059,8 +1064,16 @@ export function renderFooterRow(eventId, eventData, options = {}) {
|
||||
});
|
||||
updateZapCountDisplay(zapItem, state);
|
||||
|
||||
const nutzapCountEl = createNutzapCountDisplay(state);
|
||||
|
||||
// Nutzap button (Cashu ecash)
|
||||
const nutzapItem = createInteractionItem({
|
||||
type: 'nutzap',
|
||||
count: state.nutzapTotal,
|
||||
active: false,
|
||||
title: 'Nutzap',
|
||||
onClick: () => handleNutzapClick(eventId, eventData.pubkey, currentPubkey, nutzapItem)
|
||||
});
|
||||
updateNutzapButtonCount(nutzapItem, state);
|
||||
|
||||
const midControls = document.createElement('div');
|
||||
midControls.className = 'divPostMidControls';
|
||||
|
||||
@@ -1069,7 +1082,7 @@ export function renderFooterRow(eventId, eventData, options = {}) {
|
||||
midControls.appendChild(quoteItem);
|
||||
|
||||
container.appendChild(zapItem);
|
||||
container.appendChild(nutzapCountEl);
|
||||
container.appendChild(nutzapItem);
|
||||
container.appendChild(midControls);
|
||||
|
||||
// Time as the final item in the same row
|
||||
@@ -1079,7 +1092,11 @@ export function renderFooterRow(eventId, eventData, options = {}) {
|
||||
container.appendChild(timeEl);
|
||||
|
||||
footerRow.appendChild(container);
|
||||
|
||||
|
||||
// Async, non-blocking capability dimming.
|
||||
// Resolved after the bar is in the DOM so feed rendering is never blocked.
|
||||
setTimeout(() => applyZapCapabilityDimming(eventId, eventData.pubkey, zapItem, nutzapItem), 0);
|
||||
|
||||
return footerRow;
|
||||
}
|
||||
|
||||
@@ -1126,7 +1143,7 @@ export function renderInteractionBar(postId, postData, options = {}) {
|
||||
onClick: () => handleQuoteClick(postId, postData.pubkey, currentPubkey, quoteItem)
|
||||
});
|
||||
|
||||
// Zap button
|
||||
// Zap button (Lightning only)
|
||||
const zapItem = createInteractionItem({
|
||||
type: 'zap',
|
||||
count: state.zapTotal,
|
||||
@@ -1137,14 +1154,27 @@ export function renderInteractionBar(postId, postData, options = {}) {
|
||||
});
|
||||
updateZapCountDisplay(zapItem, state);
|
||||
|
||||
const nutzapCountEl = createNutzapCountDisplay(state);
|
||||
// Nutzap button (Cashu ecash)
|
||||
const nutzapItem = createInteractionItem({
|
||||
type: 'nutzap',
|
||||
count: state.nutzapTotal,
|
||||
active: false,
|
||||
showCount: state.nutzapTotal > 0,
|
||||
title: 'Nutzap',
|
||||
onClick: () => handleNutzapClick(postId, postData.pubkey, currentPubkey, nutzapItem)
|
||||
});
|
||||
updateNutzapButtonCount(nutzapItem, state);
|
||||
|
||||
container.appendChild(zapItem);
|
||||
container.appendChild(nutzapCountEl);
|
||||
container.appendChild(nutzapItem);
|
||||
container.appendChild(likeItem);
|
||||
container.appendChild(commentItem);
|
||||
container.appendChild(quoteItem);
|
||||
|
||||
// Async, non-blocking capability dimming.
|
||||
// Resolved after the bar is in the DOM so feed rendering is never blocked.
|
||||
setTimeout(() => applyZapCapabilityDimming(postId, postData.pubkey, zapItem, nutzapItem), 0);
|
||||
|
||||
return container;
|
||||
}
|
||||
|
||||
@@ -1194,10 +1224,10 @@ export function updateInteractionBar(postId, state) {
|
||||
updateZapCountDisplay(zapItem, state);
|
||||
}
|
||||
|
||||
// Update nutzap count display
|
||||
const nutzapCountEl = bar.querySelector('.nutzap-count-display');
|
||||
if (nutzapCountEl) {
|
||||
updateNutzapCountDisplay(nutzapCountEl, state);
|
||||
// Update nutzap button count
|
||||
const nutzapItem = bar.querySelector('.interaction-item.nutzap');
|
||||
if (nutzapItem) {
|
||||
updateNutzapButtonCount(nutzapItem, state);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1272,34 +1302,80 @@ function updateZapCountDisplay(itemEl, state = {}) {
|
||||
countEl.textContent = formatCount(zapTotal);
|
||||
}
|
||||
|
||||
function createNutzapCountDisplay(state = {}) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'nutzap-count-display';
|
||||
el.title = 'Nutzaps';
|
||||
|
||||
const emojiEl = document.createElement('span');
|
||||
emojiEl.className = 'nutzap-emoji';
|
||||
emojiEl.textContent = '🥜';
|
||||
|
||||
const countEl = document.createElement('span');
|
||||
countEl.className = 'nutzap-count-value';
|
||||
|
||||
el.appendChild(emojiEl);
|
||||
el.appendChild(countEl);
|
||||
|
||||
updateNutzapCountDisplay(el, state);
|
||||
return el;
|
||||
}
|
||||
|
||||
function updateNutzapCountDisplay(el, state = {}) {
|
||||
const countEl = el?.querySelector?.('.nutzap-count-value');
|
||||
/**
|
||||
* Update the count display on the Nutzap interaction button.
|
||||
* Mirrors updateZapCountDisplay but for the nutzap button.
|
||||
* @param {HTMLElement} itemEl - The nutzap interaction item element
|
||||
* @param {Object} state - The interaction state
|
||||
*/
|
||||
function updateNutzapButtonCount(itemEl, state = {}) {
|
||||
const countEl = itemEl?.querySelector?.('.interaction-count');
|
||||
if (!countEl) return;
|
||||
|
||||
const nutzapTotal = Math.max(0, Number(state?.nutzapTotal || 0));
|
||||
const hasCount = nutzapTotal > 0;
|
||||
|
||||
countEl.textContent = formatCount(nutzapTotal);
|
||||
el.classList.toggle('has-count', hasCount);
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// ZAP CAPABILITY DIMMING
|
||||
// =============================================================================
|
||||
//
|
||||
// Instead of separate capability badges, the Zap and Nutzap buttons themselves
|
||||
// indicate capability via dimming:
|
||||
// - Zap button dimmed when recipient has no lud16 Lightning address
|
||||
// - Nutzap button dimmed when recipient has no shared mints for nutzaps
|
||||
//
|
||||
// Dimming is applied asynchronously after the bar is in the DOM so feed
|
||||
// rendering is never blocked. Colors come exclusively from CSS variables.
|
||||
|
||||
/**
|
||||
* Dim the Zap and/or Nutzap buttons based on the recipient's zap capabilities.
|
||||
* Resolves capabilities async and applies a `.dimmed` class + tooltip to
|
||||
* buttons whose rail is unavailable. Non-throwing.
|
||||
*
|
||||
* @param {string} postId - the event id (used for logging only)
|
||||
* @param {string} pubkey - the post author's pubkey
|
||||
* @param {HTMLElement} zapItem - the Zap (Lightning) interaction item
|
||||
* @param {HTMLElement} nutzapItem - the Nutzap interaction item
|
||||
*/
|
||||
function applyZapCapabilityDimming(postId, pubkey, zapItem, nutzapItem) {
|
||||
if (!pubkey) return;
|
||||
if (typeof walletFetchMintListFn !== 'function' && typeof fetchProfile !== 'function') {
|
||||
return; // nothing to resolve with
|
||||
}
|
||||
if (!zapItem && !nutzapItem) return;
|
||||
|
||||
resolveZapCapabilities(pubkey, {
|
||||
fetchProfile,
|
||||
fetchMintList: walletFetchMintListFn || undefined,
|
||||
getSenderMints: walletGetMintsFn || undefined,
|
||||
logPrefix: '[post-interactions][zap-caps]'
|
||||
}).then((caps) => {
|
||||
// Elements may have been detached from the DOM by the time this resolves.
|
||||
if (zapItem && zapItem.isConnected) {
|
||||
if (!caps.canLightning) {
|
||||
zapItem.classList.add('dimmed');
|
||||
zapItem.title = 'No Lightning address';
|
||||
} else {
|
||||
zapItem.classList.remove('dimmed');
|
||||
zapItem.title = caps.lud16 ? `Lightning: ${caps.lud16}` : 'Zap';
|
||||
}
|
||||
}
|
||||
|
||||
if (nutzapItem && nutzapItem.isConnected) {
|
||||
if (!caps.canNutzap) {
|
||||
nutzapItem.classList.add('dimmed');
|
||||
nutzapItem.title = caps.hasMintList
|
||||
? 'No shared mints for nutzap'
|
||||
: 'No shared mints for nutzap';
|
||||
} else {
|
||||
nutzapItem.classList.remove('dimmed');
|
||||
nutzapItem.title = 'Nutzap';
|
||||
}
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.warn('[post-interactions][zap-caps] dimming failed', error?.message || error);
|
||||
});
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
@@ -1323,6 +1399,66 @@ function isZapTimeoutError(error) {
|
||||
return msg.includes('timeout');
|
||||
}
|
||||
|
||||
/**
|
||||
* Classify a zap/melt payment error into a user-friendly message.
|
||||
* Hides raw mint API errors while still being informative.
|
||||
* @param {Error|*} error
|
||||
* @returns {string}
|
||||
*/
|
||||
function friendlyZapErrorMessage(error) {
|
||||
const raw = String(error?.message || error || '').trim();
|
||||
const msg = raw.toLowerCase();
|
||||
|
||||
if (msg.includes('melt') || msg.includes('swap') || msg.includes('proof')) {
|
||||
return 'Mint couldn\'t route Lightning payment. The mint may not have enough Lightning liquidity.';
|
||||
}
|
||||
if (msg.includes('timeout')) {
|
||||
return 'Payment timed out. The mint may be slow or unresponsive.';
|
||||
}
|
||||
if (msg.includes('insufficient') || msg.includes('balance')) {
|
||||
return 'Insufficient Cashu balance for this payment.';
|
||||
}
|
||||
return raw || 'Zap failed.';
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch the current user's Cashu balance in sats.
|
||||
* Returns null when the wallet function is unavailable or the fetch fails.
|
||||
* @returns {Promise<number|null>}
|
||||
*/
|
||||
async function fetchWalletBalanceSats() {
|
||||
if (typeof walletGetBalanceFn !== 'function') return null;
|
||||
try {
|
||||
const result = await walletGetBalanceFn();
|
||||
const balance = Number(result?.balance ?? result?.sats ?? result);
|
||||
if (Number.isFinite(balance) && balance >= 0) {
|
||||
return Math.floor(balance);
|
||||
}
|
||||
} catch (error) {
|
||||
console.warn('[post-interactions][zap] fetchWalletBalanceSats:failed', error?.message || error);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the wallet balance display after a zap.
|
||||
* Re-fetches the balance and dispatches an `ndkWalletBalance` event so any
|
||||
* footer/dialog balance displays can update. Non-throwing.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async function refreshWalletBalanceDisplay() {
|
||||
const balanceSats = await fetchWalletBalanceSats();
|
||||
if (balanceSats === null) return;
|
||||
|
||||
try {
|
||||
window.dispatchEvent(new CustomEvent('ndkWalletBalance', {
|
||||
detail: { balanceSats, source: 'post-interactions-zap' }
|
||||
}));
|
||||
} catch (error) {
|
||||
console.warn('[post-interactions][zap] refreshWalletBalanceDisplay:dispatch-failed', error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// INTERACTION HANDLERS
|
||||
// =============================================================================
|
||||
@@ -1558,6 +1694,18 @@ async function saveZapDefaultsToSettings({ amountSats, comment }) {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle Zap (Lightning) button click.
|
||||
*
|
||||
* Sends a Lightning zap via Cashu melt: create a LN invoice from the
|
||||
* recipient's lud16, then pay it via walletPayInvoiceFn. No rail selector —
|
||||
* nutzaps have their own button and handler.
|
||||
*
|
||||
* @param {string} postId - Post ID
|
||||
* @param {string} postPubkey - Post author's pubkey
|
||||
* @param {string} currentPubkey - Current user's pubkey
|
||||
* @param {HTMLElement} itemEl - The interaction item element
|
||||
*/
|
||||
async function handleZapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
if (!postId || !postPubkey || !itemEl) return;
|
||||
if (itemEl.dataset.busy === '1') return;
|
||||
@@ -1583,34 +1731,31 @@ async function handleZapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
let paymentSucceeded = false;
|
||||
|
||||
try {
|
||||
if (typeof walletPayInvoiceFn !== 'function' && typeof walletSendNutzapFn !== 'function') {
|
||||
throw new Error('Cashu wallet payer is not configured on this page');
|
||||
if (typeof walletPayInvoiceFn !== 'function') {
|
||||
throw new Error('Lightning zap unavailable (walletPayInvoice not configured)');
|
||||
}
|
||||
|
||||
let nutzapSpec = null;
|
||||
if (typeof walletFetchMintListFn === 'function') {
|
||||
// --- Fetch the user's Cashu balance for the dialog ----------------------
|
||||
let balanceSats = null;
|
||||
if (typeof walletGetBalanceFn === 'function') {
|
||||
try {
|
||||
nutzapSpec = await resolveNutzapSpecForPubkey(postPubkey, {
|
||||
fetchMintList: walletFetchMintListFn,
|
||||
logPrefix: '[post-interactions][nutzap]'
|
||||
});
|
||||
} catch (_nutzapDiscoveryError) {
|
||||
nutzapSpec = null;
|
||||
const balanceResult = await walletGetBalanceFn();
|
||||
const balance = Number(balanceResult?.balance ?? balanceResult?.sats ?? balanceResult);
|
||||
if (Number.isFinite(balance) && balance >= 0) {
|
||||
balanceSats = Math.floor(balance);
|
||||
}
|
||||
} catch (balanceError) {
|
||||
console.warn('[post-interactions][zap] handleZapClick:balance-failed', balanceError?.message || balanceError);
|
||||
}
|
||||
}
|
||||
|
||||
console.log('[post-interactions][zap] handleZapClick:nutzap-support', {
|
||||
recipient: String(postPubkey || '').slice(0, 8) + '…',
|
||||
hasNutzapSupport: Boolean(nutzapSpec?.mints?.length),
|
||||
mintCount: Array.isArray(nutzapSpec?.mints) ? nutzapSpec.mints.length : 0
|
||||
});
|
||||
|
||||
const zapDefaults = await getZapDefaultsFromSettings();
|
||||
const details = await promptZapDetails({
|
||||
defaultAmountSats: zapDefaults.amountSats,
|
||||
defaultComment: zapDefaults.comment,
|
||||
defaultShouldZap: true,
|
||||
onSaveDefault: saveZapDefaultsToSettings
|
||||
onSaveDefault: saveZapDefaultsToSettings,
|
||||
balanceSats
|
||||
});
|
||||
if (!details) {
|
||||
console.log('[post-interactions][zap] handleZapClick:cancelled-by-user');
|
||||
@@ -1652,40 +1797,59 @@ async function handleZapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (nutzapSpec?.mints?.length > 0 && typeof walletSendNutzapFn === 'function') {
|
||||
if (countEl) countEl.textContent = 'send…';
|
||||
console.log('[post-interactions][zap] handleZapClick:sending-nutzap');
|
||||
const nutzapResult = await walletSendNutzapFn({
|
||||
amount: details.amountSats,
|
||||
memo: details.comment,
|
||||
targetPubkey: postPubkey,
|
||||
eventId: postId,
|
||||
recipientMints: nutzapSpec.mints,
|
||||
recipientP2pk: nutzapSpec.p2pk,
|
||||
recipientRelays: nutzapSpec.relays
|
||||
});
|
||||
console.log('[post-interactions][zap] handleZapClick:nutzap-ok', nutzapResult || {});
|
||||
} else {
|
||||
if (typeof walletPayInvoiceFn !== 'function') {
|
||||
throw new Error('LN zap fallback unavailable (walletPayInvoice missing)');
|
||||
// --- Pre-flight balance check (Phase 5) --------------------------------
|
||||
// A final safety net right before sending, in case the user ignored the
|
||||
// dialog warning or the balance changed between dialog and send.
|
||||
const zapAmount = Math.max(0, Math.floor(Number(details.amountSats || 0)));
|
||||
const preflightBalance = await fetchWalletBalanceSats();
|
||||
|
||||
if (preflightBalance !== null) {
|
||||
if (preflightBalance < zapAmount) {
|
||||
const msg = `Insufficient balance. Current: ${preflightBalance} sats, needed: ${zapAmount} sats`;
|
||||
console.warn('[post-interactions][zap] handleZapClick:insufficient-balance', {
|
||||
balance: preflightBalance, needed: zapAmount
|
||||
});
|
||||
if (countEl) {
|
||||
countEl.textContent = 'low';
|
||||
countEl.title = msg;
|
||||
setTimeout(() => {
|
||||
updateZapCountDisplay(itemEl, getPostState(postId));
|
||||
}, 2200);
|
||||
}
|
||||
window.alert(msg);
|
||||
return;
|
||||
}
|
||||
|
||||
const { invoice } = await prepareZapInvoiceForEvent({
|
||||
eventId: postId,
|
||||
recipientPubkey: postPubkey,
|
||||
amountSats: details.amountSats,
|
||||
comment: details.comment,
|
||||
fetchProfile,
|
||||
getRelayData: getRelayDataFn,
|
||||
logPrefix: '[post-interactions][zap]'
|
||||
});
|
||||
|
||||
if (countEl) countEl.textContent = 'pay…';
|
||||
console.log('[post-interactions][zap] handleZapClick:paying-invoice');
|
||||
const paymentResult = await walletPayInvoiceFn(invoice);
|
||||
console.log('[post-interactions][zap] handleZapClick:payment-ok', paymentResult || {});
|
||||
// "Barely sufficient" warning: remaining balance would be less than
|
||||
// 10% of the current balance.
|
||||
const remaining = preflightBalance - zapAmount;
|
||||
const tenPercent = Math.floor(preflightBalance * 0.10);
|
||||
if (remaining > 0 && remaining < tenPercent) {
|
||||
const confirmMsg = `This will use most of your balance (${remaining} sats remaining). Continue?`;
|
||||
const proceed = window.confirm(confirmMsg);
|
||||
if (!proceed) {
|
||||
console.log('[post-interactions][zap] handleZapClick:declined-low-balance');
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// --- Create the LN invoice and pay it via Cashu melt -------------------
|
||||
const { invoice } = await prepareZapInvoiceForEvent({
|
||||
eventId: postId,
|
||||
recipientPubkey: postPubkey,
|
||||
amountSats: details.amountSats,
|
||||
comment: details.comment,
|
||||
fetchProfile,
|
||||
getRelayData: getRelayDataFn,
|
||||
logPrefix: '[post-interactions][zap]'
|
||||
});
|
||||
|
||||
if (countEl) countEl.textContent = 'pay…';
|
||||
console.log('[post-interactions][zap] handleZapClick:paying-invoice');
|
||||
const paymentResult = await walletPayInvoiceFn(invoice);
|
||||
console.log('[post-interactions][zap] handleZapClick:payment-ok', paymentResult || {});
|
||||
|
||||
paymentSucceeded = true;
|
||||
itemEl.classList.remove('zap-pending', 'zap-pending-accent');
|
||||
itemEl.classList.add('zap-success');
|
||||
@@ -1702,15 +1866,28 @@ async function handleZapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
itemEl.classList.remove('zap-success');
|
||||
updateZapCountDisplay(itemEl, state);
|
||||
}, 1800);
|
||||
|
||||
// --- Post-zap balance refresh (Phase 5) --------------------------------
|
||||
// Refresh the wallet balance display so the user sees their updated
|
||||
// balance after a successful zap. Non-blocking — failures are logged
|
||||
// but never surface to the user since the zap itself succeeded.
|
||||
refreshWalletBalanceDisplay().catch((refreshError) => {
|
||||
console.warn('[post-interactions][zap] handleZapClick:balance-refresh-failed', refreshError?.message || refreshError);
|
||||
});
|
||||
} catch (error) {
|
||||
const timeoutFailure = isZapTimeoutError(error);
|
||||
const friendlyMessage = friendlyZapErrorMessage(error);
|
||||
console.error('[post-interactions][zap] handleZapClick:failed', error);
|
||||
if (countEl) {
|
||||
countEl.textContent = timeoutFailure ? 'check' : 'fail';
|
||||
countEl.title = friendlyMessage;
|
||||
setTimeout(() => {
|
||||
updateZapCountDisplay(itemEl, getPostState(postId));
|
||||
}, timeoutFailure ? 2800 : 2200);
|
||||
}
|
||||
// Surface a user-friendly error message. Avoids exposing raw mint API
|
||||
// errors while still being informative.
|
||||
window.alert(friendlyMessage);
|
||||
itemEl.classList.remove('zap-success');
|
||||
} finally {
|
||||
clearInterval(zapPulseInterval);
|
||||
@@ -1728,6 +1905,255 @@ async function handleZapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle Nutzap (Cashu ecash) button click.
|
||||
*
|
||||
* Checks the recipient's kind 10019 for shared mints, shows a nutzap-specific
|
||||
* dialog (with the recipient's accepted mints), and sends ecash via
|
||||
* walletSendNutzapFn. Mirrors handleZapClick's UI feedback (pulse animation,
|
||||
* count update, balance check).
|
||||
*
|
||||
* @param {string} postId - Post ID
|
||||
* @param {string} postPubkey - Post author's pubkey
|
||||
* @param {string} currentPubkey - Current user's pubkey
|
||||
* @param {HTMLElement} itemEl - The nutzap interaction item element
|
||||
*/
|
||||
async function handleNutzapClick(postId, postPubkey, currentPubkey, itemEl) {
|
||||
if (!postId || !postPubkey || !itemEl) return;
|
||||
if (itemEl.dataset.busy === '1') return;
|
||||
|
||||
const iconContainer = itemEl.querySelector('.interaction-icon-container');
|
||||
const countEl = itemEl.querySelector('.interaction-count');
|
||||
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:start', {
|
||||
postId: String(postId || '').slice(0, 8) + '…',
|
||||
recipient: String(postPubkey || '').slice(0, 8) + '…'
|
||||
});
|
||||
|
||||
itemEl.dataset.busy = '1';
|
||||
itemEl.classList.add('zap-pending');
|
||||
updateIconState(iconContainer, 'nutzap', true);
|
||||
|
||||
let pendingAccent = false;
|
||||
const zapPulseInterval = setInterval(() => {
|
||||
pendingAccent = !pendingAccent;
|
||||
itemEl.classList.toggle('zap-pending-accent', pendingAccent);
|
||||
}, 500);
|
||||
|
||||
let paymentSucceeded = false;
|
||||
|
||||
try {
|
||||
if (typeof walletSendNutzapFn !== 'function') {
|
||||
throw new Error('Nutzap unavailable (walletSendNutzap not configured)');
|
||||
}
|
||||
|
||||
// --- Resolve zap capabilities to confirm nutzap is possible -------------
|
||||
let zapCaps = null;
|
||||
try {
|
||||
zapCaps = await resolveZapCapabilities(postPubkey, {
|
||||
fetchProfile,
|
||||
fetchMintList: walletFetchMintListFn || undefined,
|
||||
getSenderMints: walletGetMintsFn || undefined,
|
||||
logPrefix: '[post-interactions][nutzap-caps]'
|
||||
});
|
||||
} catch (capsError) {
|
||||
console.warn('[post-interactions][nutzap] handleNutzapClick:caps-failed', capsError?.message || capsError);
|
||||
}
|
||||
|
||||
const canNutzap = Boolean(zapCaps?.canNutzap);
|
||||
const sharedMints = Array.isArray(zapCaps?.sharedMints) ? zapCaps.sharedMints : [];
|
||||
const recipientMints = Array.isArray(zapCaps?.nutzapMints) ? zapCaps.nutzapMints : [];
|
||||
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:caps', {
|
||||
recipient: String(postPubkey || '').slice(0, 8) + '…',
|
||||
canNutzap,
|
||||
sharedMints: sharedMints.length,
|
||||
recipientMints: recipientMints.length
|
||||
});
|
||||
|
||||
if (!canNutzap || sharedMints.length === 0) {
|
||||
window.alert('Recipient cannot receive nutzaps (no shared mints)');
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:no-shared-mints');
|
||||
return;
|
||||
}
|
||||
|
||||
// --- Resolve the nutzap spec (mints, p2pk, relays) for the send --------
|
||||
let nutzapSpec = null;
|
||||
try {
|
||||
nutzapSpec = await resolveNutzapSpecForPubkey(postPubkey, {
|
||||
fetchMintList: walletFetchMintListFn,
|
||||
logPrefix: '[post-interactions][nutzap]'
|
||||
});
|
||||
} catch (nutzapDiscoveryError) {
|
||||
console.warn('[post-interactions][nutzap] handleNutzapClick:spec-failed', nutzapDiscoveryError?.message || nutzapDiscoveryError);
|
||||
window.alert('Recipient cannot receive nutzaps (no shared mints)');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!nutzapSpec?.mints?.length) {
|
||||
window.alert('Recipient cannot receive nutzaps (no shared mints)');
|
||||
return;
|
||||
}
|
||||
|
||||
// --- Fetch the user's Cashu balance for the dialog ----------------------
|
||||
let balanceSats = null;
|
||||
if (typeof walletGetBalanceFn === 'function') {
|
||||
try {
|
||||
const balanceResult = await walletGetBalanceFn();
|
||||
const balance = Number(balanceResult?.balance ?? balanceResult?.sats ?? balanceResult);
|
||||
if (Number.isFinite(balance) && balance >= 0) {
|
||||
balanceSats = Math.floor(balance);
|
||||
}
|
||||
} catch (balanceError) {
|
||||
console.warn('[post-interactions][nutzap] handleNutzapClick:balance-failed', balanceError?.message || balanceError);
|
||||
}
|
||||
}
|
||||
|
||||
const zapDefaults = await getZapDefaultsFromSettings();
|
||||
const details = await promptNutzapDetails({
|
||||
defaultAmountSats: zapDefaults.amountSats,
|
||||
defaultComment: zapDefaults.comment,
|
||||
defaultShouldZap: true,
|
||||
onSaveDefault: saveZapDefaultsToSettings,
|
||||
balanceSats,
|
||||
recipientMints: nutzapSpec.mints,
|
||||
sharedMints
|
||||
});
|
||||
if (!details) {
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:cancelled-by-user');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:details', {
|
||||
amountSats: details.amountSats,
|
||||
hasComment: Boolean(String(details.comment || '').trim()),
|
||||
shouldZap: Boolean(details.shouldZap)
|
||||
});
|
||||
|
||||
const state = getPostState(postId);
|
||||
if (!state.userLiked && currentPubkey) {
|
||||
const interactionBar = itemEl.closest('.divPostInteractions');
|
||||
const likeItem = interactionBar?.querySelector('.interaction-item.like');
|
||||
if (likeItem) {
|
||||
try {
|
||||
await handleLikeClick(postId, postPubkey, currentPubkey, likeItem);
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:auto-like:ok');
|
||||
} catch (likeError) {
|
||||
console.error('[post-interactions][nutzap] handleNutzapClick:auto-like:failed', likeError);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const shouldZap = details.shouldZap !== false;
|
||||
if (!shouldZap) {
|
||||
paymentSucceeded = true;
|
||||
itemEl.classList.remove('zap-pending', 'zap-pending-accent');
|
||||
if (countEl) {
|
||||
countEl.textContent = '';
|
||||
setTimeout(() => {
|
||||
updateNutzapButtonCount(itemEl, getPostState(postId));
|
||||
}, 150);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// --- Pre-flight balance check (Phase 5) --------------------------------
|
||||
const zapAmount = Math.max(0, Math.floor(Number(details.amountSats || 0)));
|
||||
const preflightBalance = await fetchWalletBalanceSats();
|
||||
|
||||
if (preflightBalance !== null) {
|
||||
if (preflightBalance < zapAmount) {
|
||||
const msg = `Insufficient balance. Current: ${preflightBalance} sats, needed: ${zapAmount} sats`;
|
||||
console.warn('[post-interactions][nutzap] handleNutzapClick:insufficient-balance', {
|
||||
balance: preflightBalance, needed: zapAmount
|
||||
});
|
||||
if (countEl) {
|
||||
countEl.textContent = 'low';
|
||||
countEl.title = msg;
|
||||
setTimeout(() => {
|
||||
updateNutzapButtonCount(itemEl, getPostState(postId));
|
||||
}, 2200);
|
||||
}
|
||||
window.alert(msg);
|
||||
return;
|
||||
}
|
||||
|
||||
const remaining = preflightBalance - zapAmount;
|
||||
const tenPercent = Math.floor(preflightBalance * 0.10);
|
||||
if (remaining > 0 && remaining < tenPercent) {
|
||||
const confirmMsg = `This will use most of your balance (${remaining} sats remaining). Continue?`;
|
||||
const proceed = window.confirm(confirmMsg);
|
||||
if (!proceed) {
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:declined-low-balance');
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// --- Send the nutzap (Cashu ecash) -------------------------------------
|
||||
if (countEl) countEl.textContent = 'send…';
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:sending-nutzap');
|
||||
const nutzapResult = await walletSendNutzapFn({
|
||||
amount: details.amountSats,
|
||||
memo: details.comment,
|
||||
targetPubkey: postPubkey,
|
||||
eventId: postId,
|
||||
recipientMints: nutzapSpec.mints,
|
||||
recipientP2pk: nutzapSpec.p2pk,
|
||||
recipientRelays: nutzapSpec.relays
|
||||
});
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:nutzap-ok', nutzapResult || {});
|
||||
|
||||
paymentSucceeded = true;
|
||||
itemEl.classList.remove('zap-pending', 'zap-pending-accent');
|
||||
itemEl.classList.add('zap-success');
|
||||
|
||||
if (countEl) countEl.textContent = 'sent';
|
||||
|
||||
const sentAmount = Math.max(0, Math.floor(Number(details.amountSats || 0)));
|
||||
if (sentAmount > 0) {
|
||||
state.nutzapTotal = Math.max(0, Number(state.nutzapTotal || 0)) + sentAmount;
|
||||
updateNutzapButtonCount(itemEl, state);
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
itemEl.classList.remove('zap-success');
|
||||
updateNutzapButtonCount(itemEl, state);
|
||||
}, 1800);
|
||||
|
||||
// --- Post-nutzap balance refresh ---------------------------------------
|
||||
refreshWalletBalanceDisplay().catch((refreshError) => {
|
||||
console.warn('[post-interactions][nutzap] handleNutzapClick:balance-refresh-failed', refreshError?.message || refreshError);
|
||||
});
|
||||
} catch (error) {
|
||||
const timeoutFailure = isZapTimeoutError(error);
|
||||
const friendlyMessage = friendlyZapErrorMessage(error);
|
||||
console.error('[post-interactions][nutzap] handleNutzapClick:failed', error);
|
||||
if (countEl) {
|
||||
countEl.textContent = timeoutFailure ? 'check' : 'fail';
|
||||
countEl.title = friendlyMessage;
|
||||
setTimeout(() => {
|
||||
updateNutzapButtonCount(itemEl, getPostState(postId));
|
||||
}, timeoutFailure ? 2800 : 2200);
|
||||
}
|
||||
window.alert(friendlyMessage);
|
||||
itemEl.classList.remove('zap-success');
|
||||
} finally {
|
||||
clearInterval(zapPulseInterval);
|
||||
itemEl.dataset.busy = '0';
|
||||
|
||||
if (!paymentSucceeded) {
|
||||
itemEl.classList.remove('active', 'zap-pending', 'zap-pending-accent', 'zap-success');
|
||||
updateIconState(iconContainer, 'nutzap', false);
|
||||
} else {
|
||||
itemEl.classList.remove('active', 'zap-pending-accent');
|
||||
updateIconState(iconContainer, 'nutzap', true);
|
||||
}
|
||||
|
||||
console.log('[post-interactions][nutzap] handleNutzapClick:finish');
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the count display for an interaction item
|
||||
* @param {HTMLElement} itemEl - The interaction item element
|
||||
@@ -2308,6 +2734,8 @@ export function initInteractions(ndkFunctions = {}) {
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetMints,
|
||||
walletGetBalance,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -2325,6 +2753,8 @@ export function initInteractions(ndkFunctions = {}) {
|
||||
walletPayInvoiceFn = typeof walletPayInvoice === 'function' ? walletPayInvoice : null;
|
||||
walletSendNutzapFn = typeof walletSendNutzap === 'function' ? walletSendNutzap : null;
|
||||
walletFetchMintListFn = typeof walletFetchMintList === 'function' ? walletFetchMintList : null;
|
||||
walletGetMintsFn = typeof walletGetMints === 'function' ? walletGetMints : null;
|
||||
walletGetBalanceFn = typeof walletGetBalance === 'function' ? walletGetBalance : null;
|
||||
getRelayDataFn = typeof getRelayData === 'function' ? getRelayData : null;
|
||||
getUserSettingsFn = typeof getUserSettings === 'function' ? getUserSettings : null;
|
||||
patchUserSettingsFn = typeof patchUserSettings === 'function' ? patchUserSettings : null;
|
||||
|
||||
@@ -14,6 +14,8 @@ export function initPostCards(deps = {}) {
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetMints,
|
||||
walletGetBalance,
|
||||
getRelayData,
|
||||
maxSubscriptions = DEFAULT_MAX_SUBSCRIPTIONS,
|
||||
getUserSettings,
|
||||
@@ -34,6 +36,8 @@ export function initPostCards(deps = {}) {
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetMints,
|
||||
walletGetBalance,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -65,7 +69,9 @@ export function initPostCards(deps = {}) {
|
||||
|
||||
function handleUpdate(postId, state, event, currentPubkey) {
|
||||
interactions.updateInteractionBar(postId, state);
|
||||
if (event && event.kind === 1 && interactions.isCommentEvent?.(event, postId)) {
|
||||
// Only render inline comments if comments are visible (the new feed
|
||||
// sets commentsVisible=false to avoid inline reply rendering).
|
||||
if (event && event.kind === 1 && interactions.isCommentEvent?.(event, postId) && interactions.getCommentsVisible?.()) {
|
||||
interactions.addCommentToPost(postId, {
|
||||
id: event.id,
|
||||
pubkey: event.pubkey,
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"VERSION": "v0.7.27",
|
||||
"VERSION_NUMBER": "0.7.27",
|
||||
"BUILD_DATE": "2026-06-26T00:00:43.641Z"
|
||||
"VERSION": "v0.7.37",
|
||||
"VERSION_NUMBER": "0.7.37",
|
||||
"BUILD_DATE": "2026-06-26T01:29:31.321Z"
|
||||
}
|
||||
|
||||
444
www/js/zaps.mjs
444
www/js/zaps.mjs
@@ -249,6 +249,37 @@ function closeActiveZapModal(result, resolver) {
|
||||
resolver(result);
|
||||
}
|
||||
|
||||
/**
|
||||
* Escape a string for safe insertion into HTML text/attribute content.
|
||||
* @param {string} value
|
||||
* @returns {string}
|
||||
*/
|
||||
const HTML_ESCAPE_RE = /[&<>"']/g;
|
||||
function escapeHtml(value) {
|
||||
const amp = '&' + 'amp;';
|
||||
const lt = '&' + 'lt;';
|
||||
const gt = '&' + 'gt;';
|
||||
const quot = '&' + 'quot;';
|
||||
const apos = '&' + '#39;';
|
||||
const map = { '&': amp, '<': lt, '>': gt, '"': quot, "'": apos };
|
||||
return String(value || '').replace(HTML_ESCAPE_RE, (ch) => map[ch]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Lightning-only zap details dialog.
|
||||
*
|
||||
* Shows amount input, preset amounts, Cashu balance, and an insufficient-balance
|
||||
* warning. No rail selector — Lightning is the only rail here. Nutzaps have
|
||||
* their own dialog (`promptNutzapDetails`) and their own button.
|
||||
*
|
||||
* @param {Object} options
|
||||
* @param {number} [options.defaultAmountSats=21]
|
||||
* @param {string} [options.defaultComment='']
|
||||
* @param {boolean} [options.defaultShouldZap=true]
|
||||
* @param {Function} [options.onSaveDefault]
|
||||
* @param {number|null} [options.balanceSats=null]
|
||||
* @returns {Promise<{amountSats:number, comment:string, shouldZap:boolean}|null>}
|
||||
*/
|
||||
export function promptZapDetails(options = {}) {
|
||||
if (activeZapModalEl) {
|
||||
return Promise.resolve(null);
|
||||
@@ -258,7 +289,8 @@ export function promptZapDetails(options = {}) {
|
||||
defaultAmountSats = 21,
|
||||
defaultComment = '',
|
||||
defaultShouldZap = true,
|
||||
onSaveDefault = null
|
||||
onSaveDefault = null,
|
||||
balanceSats = null
|
||||
} = options;
|
||||
|
||||
return new Promise((resolve) => {
|
||||
@@ -268,11 +300,16 @@ export function promptZapDetails(options = {}) {
|
||||
: 21;
|
||||
const normalizedDefaultComment = String(defaultComment || '').trim();
|
||||
|
||||
const balanceDisplay = (Number.isFinite(Number(balanceSats)) && Number(balanceSats) >= 0)
|
||||
? `<div class="zap-selector-balance">Cashu balance: ${Math.floor(Number(balanceSats))} sats</div>`
|
||||
: '';
|
||||
|
||||
const overlay = document.createElement('div');
|
||||
overlay.className = 'zap-selector-overlay';
|
||||
overlay.innerHTML = `
|
||||
<div class="zap-selector" role="dialog" aria-modal="true" aria-label="Send zap">
|
||||
<div class="zap-selector-title">Send Zap</div>
|
||||
<div class="zap-selector" role="dialog" aria-modal="true" aria-label="Send Lightning zap">
|
||||
<div class="zap-selector-title">⚡ Lightning Zap</div>
|
||||
${balanceDisplay}
|
||||
<div class="zap-selector-presets">
|
||||
<button type="button" class="zap-preset" data-amount="21">⚡21</button>
|
||||
<button type="button" class="zap-preset" data-amount="100">⚡100</button>
|
||||
@@ -284,9 +321,10 @@ export function promptZapDetails(options = {}) {
|
||||
Amount (sats)
|
||||
<input class="zap-selector-amount" type="number" min="1" step="1" value="${normalizedDefaultAmount}" />
|
||||
</label>
|
||||
<div class="zap-selector-warning" data-warning="insufficient-balance"></div>
|
||||
<label class="zap-selector-label">
|
||||
Comment (optional)
|
||||
<textarea class="zap-selector-comment" rows="3" placeholder="Nice post ⚡">${normalizedDefaultComment.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')}</textarea>
|
||||
<textarea class="zap-selector-comment" rows="3" placeholder="Nice post ⚡">${escapeHtml(normalizedDefaultComment)}</textarea>
|
||||
</label>
|
||||
<label class="zap-selector-label" style="display:flex;align-items:center;gap:8px;">
|
||||
<input class="zap-selector-enable" type="checkbox" ${defaultShouldZap ? 'checked' : ''} />
|
||||
@@ -307,6 +345,7 @@ export function promptZapDetails(options = {}) {
|
||||
const cancelBtn = overlay.querySelector('.zap-cancel');
|
||||
const enableZapEl = overlay.querySelector('.zap-selector-enable');
|
||||
const presetButtons = Array.from(overlay.querySelectorAll('.zap-preset'));
|
||||
const warningEl = overlay.querySelector('[data-warning="insufficient-balance"]');
|
||||
|
||||
const parseCurrentValues = () => {
|
||||
const amountSats = Number(amountEl?.value || 0);
|
||||
@@ -315,11 +354,24 @@ export function promptZapDetails(options = {}) {
|
||||
return { amountSats, comment, shouldZap };
|
||||
};
|
||||
|
||||
const updateBalanceWarning = () => {
|
||||
if (!warningEl) return;
|
||||
const { amountSats } = parseCurrentValues();
|
||||
const balance = Number(balanceSats);
|
||||
const insufficient = Number.isFinite(balance)
|
||||
&& balance >= 0
|
||||
&& Number.isFinite(amountSats)
|
||||
&& amountSats > balance;
|
||||
warningEl.textContent = insufficient ? 'Insufficient balance' : '';
|
||||
warningEl.style.display = insufficient ? '' : 'none';
|
||||
};
|
||||
|
||||
const selectPreset = (button) => {
|
||||
presetButtons.forEach((btn) => btn.classList.toggle('active', btn === button));
|
||||
if (amountEl && button?.dataset?.amount) {
|
||||
amountEl.value = button.dataset.amount;
|
||||
}
|
||||
updateBalanceWarning();
|
||||
};
|
||||
|
||||
presetButtons.forEach((button) => {
|
||||
@@ -328,6 +380,7 @@ export function promptZapDetails(options = {}) {
|
||||
|
||||
amountEl?.addEventListener('input', () => {
|
||||
presetButtons.forEach((btn) => btn.classList.remove('active'));
|
||||
updateBalanceWarning();
|
||||
});
|
||||
|
||||
saveDefaultBtn?.addEventListener('click', async () => {
|
||||
@@ -390,6 +443,222 @@ export function promptZapDetails(options = {}) {
|
||||
} else {
|
||||
presetButtons.forEach((btn) => btn.classList.remove('active'));
|
||||
}
|
||||
updateBalanceWarning();
|
||||
amountEl?.focus();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Nutzap (Cashu ecash) details dialog.
|
||||
*
|
||||
* Shows amount input, preset amounts, Cashu balance, the recipient's accepted
|
||||
* mints (from kind 10019), and which shared mint will be used to send the
|
||||
* ecash. Returns the user's choices or null if cancelled.
|
||||
*
|
||||
* @param {Object} options
|
||||
* @param {number} [options.defaultAmountSats=21]
|
||||
* @param {string} [options.defaultComment='']
|
||||
* @param {boolean} [options.defaultShouldZap=true]
|
||||
* @param {Function} [options.onSaveDefault]
|
||||
* @param {number|null} [options.balanceSats=null]
|
||||
* @param {string[]} [options.recipientMints=[]] - all mints on recipient's kind 10019
|
||||
* @param {string[]} [options.sharedMints=[]] - mints shared with sender's wallet
|
||||
* @returns {Promise<{amountSats:number, comment:string, shouldZap:boolean}|null>}
|
||||
*/
|
||||
export function promptNutzapDetails(options = {}) {
|
||||
if (activeZapModalEl) {
|
||||
return Promise.resolve(null);
|
||||
}
|
||||
|
||||
const {
|
||||
defaultAmountSats = 21,
|
||||
defaultComment = '',
|
||||
defaultShouldZap = true,
|
||||
onSaveDefault = null,
|
||||
balanceSats = null,
|
||||
recipientMints = [],
|
||||
sharedMints = []
|
||||
} = options;
|
||||
|
||||
const normalizedRecipientMints = Array.isArray(recipientMints)
|
||||
? recipientMints.map((m) => String(m || '').trim()).filter(Boolean)
|
||||
: [];
|
||||
const normalizedSharedMints = Array.isArray(sharedMints)
|
||||
? sharedMints.map((m) => String(m || '').trim()).filter(Boolean)
|
||||
: [];
|
||||
const primarySharedMint = normalizedSharedMints[0] || '';
|
||||
|
||||
return new Promise((resolve) => {
|
||||
const initialAmount = Number(defaultAmountSats);
|
||||
const normalizedDefaultAmount = Number.isFinite(initialAmount) && initialAmount > 0
|
||||
? Math.floor(initialAmount)
|
||||
: 21;
|
||||
const normalizedDefaultComment = String(defaultComment || '').trim();
|
||||
|
||||
const balanceDisplay = (Number.isFinite(Number(balanceSats)) && Number(balanceSats) >= 0)
|
||||
? `<div class="zap-selector-balance">Cashu balance: ${Math.floor(Number(balanceSats))} sats</div>`
|
||||
: '';
|
||||
|
||||
const sharedMintInfoHtml = primarySharedMint
|
||||
? `<div class="zap-selector-mint-info">Will send via ${escapeHtml(primarySharedMint)}</div>`
|
||||
: '';
|
||||
|
||||
const recipientMintsListHtml = normalizedRecipientMints.length > 0
|
||||
? `<div class="zap-selector-mint-info">
|
||||
<div>Recipient accepts mints:</div>
|
||||
<ul class="zap-selector-mint-list">
|
||||
${normalizedRecipientMints.map((m) => {
|
||||
const isShared = normalizedSharedMints.some(
|
||||
(s) => s.replace(/\/+$/, '').toLowerCase() === m.replace(/\/+$/, '').toLowerCase()
|
||||
);
|
||||
return `<li class="zap-selector-mint-list-item${isShared ? ' shared' : ''}">${escapeHtml(m)}${isShared ? ' ✓' : ''}</li>`;
|
||||
}).join('')}
|
||||
</ul>
|
||||
</div>`
|
||||
: '';
|
||||
|
||||
const overlay = document.createElement('div');
|
||||
overlay.className = 'zap-selector-overlay';
|
||||
overlay.innerHTML = `
|
||||
<div class="zap-selector" role="dialog" aria-modal="true" aria-label="Send nutzap">
|
||||
<div class="zap-selector-title">🥜 Nutzap</div>
|
||||
${balanceDisplay}
|
||||
<div class="zap-selector-presets">
|
||||
<button type="button" class="zap-preset" data-amount="21">🥜21</button>
|
||||
<button type="button" class="zap-preset" data-amount="100">🥜100</button>
|
||||
<button type="button" class="zap-preset" data-amount="500">🥜500</button>
|
||||
<button type="button" class="zap-preset" data-amount="1000">🥜1K</button>
|
||||
<button type="button" class="zap-preset" data-amount="5000">🥜5K</button>
|
||||
</div>
|
||||
<label class="zap-selector-label">
|
||||
Amount (sats)
|
||||
<input class="zap-selector-amount" type="number" min="1" step="1" value="${normalizedDefaultAmount}" />
|
||||
</label>
|
||||
<div class="zap-selector-warning" data-warning="insufficient-balance"></div>
|
||||
${sharedMintInfoHtml}
|
||||
${recipientMintsListHtml}
|
||||
<label class="zap-selector-label">
|
||||
Comment (optional)
|
||||
<textarea class="zap-selector-comment" rows="3" placeholder="Nice post 🥜">${escapeHtml(normalizedDefaultComment)}</textarea>
|
||||
</label>
|
||||
<label class="zap-selector-label" style="display:flex;align-items:center;gap:8px;">
|
||||
<input class="zap-selector-enable" type="checkbox" ${defaultShouldZap ? 'checked' : ''} />
|
||||
Send nutzap
|
||||
</label>
|
||||
<div class="zap-selector-actions">
|
||||
<button type="button" class="zap-cancel">Cancel</button>
|
||||
<button type="button" class="zap-save-default">Save as default</button>
|
||||
<button type="button" class="zap-send">Send</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
const amountEl = overlay.querySelector('.zap-selector-amount');
|
||||
const commentEl = overlay.querySelector('.zap-selector-comment');
|
||||
const sendBtn = overlay.querySelector('.zap-send');
|
||||
const saveDefaultBtn = overlay.querySelector('.zap-save-default');
|
||||
const cancelBtn = overlay.querySelector('.zap-cancel');
|
||||
const enableZapEl = overlay.querySelector('.zap-selector-enable');
|
||||
const presetButtons = Array.from(overlay.querySelectorAll('.zap-preset'));
|
||||
const warningEl = overlay.querySelector('[data-warning="insufficient-balance"]');
|
||||
|
||||
const parseCurrentValues = () => {
|
||||
const amountSats = Number(amountEl?.value || 0);
|
||||
const comment = String(commentEl?.value || '').trim();
|
||||
const shouldZap = Boolean(enableZapEl?.checked);
|
||||
return { amountSats, comment, shouldZap };
|
||||
};
|
||||
|
||||
const updateBalanceWarning = () => {
|
||||
if (!warningEl) return;
|
||||
const { amountSats } = parseCurrentValues();
|
||||
const balance = Number(balanceSats);
|
||||
const insufficient = Number.isFinite(balance)
|
||||
&& balance >= 0
|
||||
&& Number.isFinite(amountSats)
|
||||
&& amountSats > balance;
|
||||
warningEl.textContent = insufficient ? 'Insufficient balance' : '';
|
||||
warningEl.style.display = insufficient ? '' : 'none';
|
||||
};
|
||||
|
||||
const selectPreset = (button) => {
|
||||
presetButtons.forEach((btn) => btn.classList.toggle('active', btn === button));
|
||||
if (amountEl && button?.dataset?.amount) {
|
||||
amountEl.value = button.dataset.amount;
|
||||
}
|
||||
updateBalanceWarning();
|
||||
};
|
||||
|
||||
presetButtons.forEach((button) => {
|
||||
button.addEventListener('click', () => selectPreset(button));
|
||||
});
|
||||
|
||||
amountEl?.addEventListener('input', () => {
|
||||
presetButtons.forEach((btn) => btn.classList.remove('active'));
|
||||
updateBalanceWarning();
|
||||
});
|
||||
|
||||
saveDefaultBtn?.addEventListener('click', async () => {
|
||||
const { amountSats, comment } = parseCurrentValues();
|
||||
if (!Number.isFinite(amountSats) || amountSats <= 0) {
|
||||
amountEl?.focus();
|
||||
return;
|
||||
}
|
||||
|
||||
if (typeof onSaveDefault === 'function') {
|
||||
try {
|
||||
await onSaveDefault({ amountSats, comment });
|
||||
saveDefaultBtn.textContent = 'Saved';
|
||||
setTimeout(() => {
|
||||
if (saveDefaultBtn) saveDefaultBtn.textContent = 'Save as default';
|
||||
}, 1200);
|
||||
} catch (error) {
|
||||
console.error('[zaps] Save as default failed:', error?.message || error, error);
|
||||
saveDefaultBtn.textContent = 'Save failed';
|
||||
setTimeout(() => {
|
||||
if (saveDefaultBtn) saveDefaultBtn.textContent = 'Save as default';
|
||||
}, 1200);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
console.warn('[zaps] Save as default unavailable: onSaveDefault callback not provided');
|
||||
saveDefaultBtn.textContent = 'Unavailable';
|
||||
setTimeout(() => {
|
||||
if (saveDefaultBtn) saveDefaultBtn.textContent = 'Save as default';
|
||||
}, 1200);
|
||||
});
|
||||
|
||||
sendBtn?.addEventListener('click', () => {
|
||||
const { amountSats, comment, shouldZap } = parseCurrentValues();
|
||||
if (shouldZap && (!Number.isFinite(amountSats) || amountSats <= 0)) {
|
||||
amountEl?.focus();
|
||||
return;
|
||||
}
|
||||
closeActiveZapModal({ amountSats, comment, shouldZap }, resolve);
|
||||
});
|
||||
|
||||
cancelBtn?.addEventListener('click', () => closeActiveZapModal(null, resolve));
|
||||
overlay.addEventListener('click', (event) => {
|
||||
if (event.target === overlay) closeActiveZapModal(null, resolve);
|
||||
});
|
||||
|
||||
const onEscape = (event) => {
|
||||
if (event.key !== 'Escape') return;
|
||||
document.removeEventListener('keydown', onEscape);
|
||||
closeActiveZapModal(null, resolve);
|
||||
};
|
||||
document.addEventListener('keydown', onEscape);
|
||||
|
||||
activeZapModalEl = overlay;
|
||||
document.body.appendChild(overlay);
|
||||
const defaultPreset = presetButtons.find((btn) => Number(btn.dataset?.amount || 0) === normalizedDefaultAmount);
|
||||
if (defaultPreset) {
|
||||
selectPreset(defaultPreset);
|
||||
} else {
|
||||
presetButtons.forEach((btn) => btn.classList.remove('active'));
|
||||
}
|
||||
updateBalanceWarning();
|
||||
amountEl?.focus();
|
||||
});
|
||||
}
|
||||
@@ -506,3 +775,170 @@ export function extractZapComment(event) {
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// ZAP CAPABILITY RESOLUTION (Phase 3 — feed-upgrade)
|
||||
// =============================================================================
|
||||
//
|
||||
// resolveZapCapabilities(pubkey) determines, at a glance, which zap rails are
|
||||
// available for a given recipient pubkey:
|
||||
// - canLightning: recipient has a lud16 Lightning address (NIP-57 via Cashu melt)
|
||||
// - canNutzap: recipient has a kind 10019 mint list (NIP-61) AND at least
|
||||
// one of those mints overlaps with the sender's wallet mints
|
||||
// - sharedMints: the overlapping mint URLs (empty when no overlap)
|
||||
// - nutzapMints: all mints declared on the recipient's kind 10019
|
||||
// - lud16: the recipient's Lightning address (or null)
|
||||
//
|
||||
// Results are cached per-pubkey in an in-memory Map with a 5-minute TTL so
|
||||
// repeated feed renders do not refetch. The cache is best-effort and safe to
|
||||
// clear on page navigation (see clearZapCapabilitiesCache).
|
||||
|
||||
const ZAP_CAP_CACHE_TTL_MS = 5 * 60 * 1000;
|
||||
const zapCapCache = new Map(); // pubkey -> { result, expiresAt }
|
||||
|
||||
/**
|
||||
* Clear the in-memory zap-capability cache.
|
||||
* Safe to call on page navigation; subsequent calls will refetch.
|
||||
*/
|
||||
export function clearZapCapabilitiesCache() {
|
||||
zapCapCache.clear();
|
||||
}
|
||||
|
||||
/**
|
||||
* Normalize a mint URL for comparison (trim + strip trailing slashes).
|
||||
* @param {string} url
|
||||
* @returns {string}
|
||||
*/
|
||||
function normalizeMintForCompare(url) {
|
||||
return String(url || '').trim().replace(/\/+$/, '').toLowerCase();
|
||||
}
|
||||
|
||||
/**
|
||||
* Resolve which zap rails are available for a given pubkey.
|
||||
*
|
||||
* @param {string} pubkey - The recipient's pubkey (hex)
|
||||
* @param {Object} options
|
||||
* @param {Function} [options.fetchProfile] - profile-cache fetcher (kind 0)
|
||||
* @param {Function} [options.fetchMintList] - walletFetchMintList(pubkey) -> { hasMintList, mints, ... }
|
||||
* @param {Function} [options.getSenderMints] - walletGetMints() -> { mints: [...] }
|
||||
* @param {boolean} [options.useCache=true] - whether to consult the in-memory cache
|
||||
* @param {string} [options.logPrefix='[zaps]']
|
||||
* @returns {Promise<{canLightning:boolean, canNutzap:boolean, sharedMints:string[], nutzapMints:string[], lud16:string|null, hasMintList:boolean}>}
|
||||
*/
|
||||
export async function resolveZapCapabilities(pubkey, options = {}) {
|
||||
const {
|
||||
fetchProfile: fetchProfileFn,
|
||||
fetchMintList,
|
||||
getSenderMints,
|
||||
useCache = true,
|
||||
logPrefix = '[zaps]'
|
||||
} = options;
|
||||
|
||||
const recipient = String(pubkey || '').trim();
|
||||
if (!recipient) {
|
||||
return {
|
||||
canLightning: false,
|
||||
canNutzap: false,
|
||||
sharedMints: [],
|
||||
nutzapMints: [],
|
||||
lud16: null,
|
||||
hasMintList: false
|
||||
};
|
||||
}
|
||||
|
||||
// --- Cache lookup ---------------------------------------------------------
|
||||
const now = Date.now();
|
||||
if (useCache) {
|
||||
const cached = zapCapCache.get(recipient);
|
||||
if (cached && cached.expiresAt > now) {
|
||||
return cached.result;
|
||||
}
|
||||
}
|
||||
|
||||
// --- Lightning capability (lud16 from kind 0) -----------------------------
|
||||
let lud16 = null;
|
||||
let canLightning = false;
|
||||
if (typeof fetchProfileFn === 'function') {
|
||||
try {
|
||||
const profile = await fetchProfileFn(recipient);
|
||||
const normalized = normalizeLud16(profile?.lud16);
|
||||
if (normalized) {
|
||||
lud16 = normalized;
|
||||
canLightning = true;
|
||||
}
|
||||
} catch (error) {
|
||||
console.warn(`${logPrefix} resolveZapCapabilities: profile fetch failed`, error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Nutzap capability (kind 10019 + shared mint overlap) -----------------
|
||||
let nutzapMints = [];
|
||||
let sharedMints = [];
|
||||
let canNutzap = false;
|
||||
let hasMintList = false;
|
||||
|
||||
if (typeof fetchMintList === 'function') {
|
||||
try {
|
||||
const mintList = await fetchMintList(recipient);
|
||||
const rawMints = Array.isArray(mintList?.mints)
|
||||
? mintList.mints.map((m) => String(m || '').trim()).filter(Boolean)
|
||||
: [];
|
||||
nutzapMints = Array.from(new Set(rawMints));
|
||||
hasMintList = Boolean(mintList?.hasMintList) && nutzapMints.length > 0;
|
||||
|
||||
if (hasMintList) {
|
||||
// Determine the sender's wallet mints to compute overlap.
|
||||
let senderMints = [];
|
||||
if (typeof getSenderMints === 'function') {
|
||||
try {
|
||||
const senderResult = await getSenderMints();
|
||||
senderMints = Array.isArray(senderResult?.mints)
|
||||
? senderResult.mints.map((m) => String(m || '').trim()).filter(Boolean)
|
||||
: [];
|
||||
} catch (error) {
|
||||
console.warn(`${logPrefix} resolveZapCapabilities: sender mints fetch failed`, error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
if (senderMints.length > 0) {
|
||||
const senderSet = new Set(senderMints.map(normalizeMintForCompare));
|
||||
sharedMints = nutzapMints.filter((m) => senderSet.has(normalizeMintForCompare(m)));
|
||||
canNutzap = sharedMints.length > 0;
|
||||
} else {
|
||||
// No sender wallet mints available yet — cannot confirm a shared mint,
|
||||
// so we do not claim canNutzap. The recipient still has a mint list,
|
||||
// which the UI may render in a muted state.
|
||||
canNutzap = false;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.warn(`${logPrefix} resolveZapCapabilities: mint list fetch failed`, error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
const result = {
|
||||
canLightning,
|
||||
canNutzap,
|
||||
sharedMints,
|
||||
nutzapMints,
|
||||
lud16,
|
||||
hasMintList
|
||||
};
|
||||
|
||||
// --- Cache store ----------------------------------------------------------
|
||||
zapCapCache.set(recipient, {
|
||||
result,
|
||||
expiresAt: Date.now() + ZAP_CAP_CACHE_TTL_MS
|
||||
});
|
||||
|
||||
console.log(`${logPrefix} resolveZapCapabilities:ok`, {
|
||||
recipient: recipient.slice(0, 8) + '…',
|
||||
canLightning,
|
||||
canNutzap,
|
||||
hasMintList,
|
||||
sharedMints: sharedMints.length,
|
||||
nutzapMints: nutzapMints.length
|
||||
});
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
@@ -294,6 +294,15 @@ let lightwalletHasWallet = false;
|
||||
let spendingHistoryLastFetchAtMs = 0;
|
||||
let spendingHistoryFetchPromise = null;
|
||||
|
||||
// Nutzap mint list (kind 10019) cache for followed users — proactively
|
||||
// fetched on startup so resolveZapCapabilities() can hit IDB instead of
|
||||
// going to relays for every followed author.
|
||||
const NUTZAP_MINTLIST_DB_NAME = 'ndk-nutzap-mintlists';
|
||||
const NUTZAP_MINTLIST_DB_VERSION = 1;
|
||||
const NUTZAP_MINTLIST_STORE = 'mintlists'; // keyPath: pubkey
|
||||
const NUTZAP_MINTLIST_PREFETCH_BATCH = 50; // max authors per fetchEvents call
|
||||
const NUTZAP_MINTLIST_PREFETCH_TTL_MS = 6 * 60 * 60 * 1000; // 6h freshness guard
|
||||
|
||||
// Relay activity tracking
|
||||
const RELAY_EVENT_LOG_LIMIT = 200;
|
||||
const RELAY_EVENTS_DB_NAME = 'relay-events';
|
||||
@@ -600,6 +609,89 @@ async function openRelayEventsDb() {
|
||||
});
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
// Nutzap mint list (kind 10019) IDB cache for followed users
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
async function openNutzapMintListDb() {
|
||||
if (!HAS_INDEXEDDB || !INDEXEDDB_USABLE) {
|
||||
throw new Error('IndexedDB unavailable or unhealthy');
|
||||
}
|
||||
|
||||
return await new Promise((resolve, reject) => {
|
||||
const req = indexedDB.open(NUTZAP_MINTLIST_DB_NAME, NUTZAP_MINTLIST_DB_VERSION);
|
||||
req.onupgradeneeded = () => {
|
||||
const db = req.result;
|
||||
if (!db.objectStoreNames.contains(NUTZAP_MINTLIST_STORE)) {
|
||||
db.createObjectStore(NUTZAP_MINTLIST_STORE, { keyPath: 'pubkey' });
|
||||
}
|
||||
};
|
||||
req.onsuccess = () => resolve(req.result);
|
||||
req.onerror = () => reject(req.error);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Store a parsed kind 10019 mint list for a pubkey in IDB.
|
||||
* @param {string} pubkey
|
||||
* @param {{ hasMintList:boolean, mints:string[], relays:string[], p2pk:string|null, eventId:string|null, created_at:number }} entry
|
||||
*/
|
||||
async function putNutzapMintListToDb(pubkey, entry) {
|
||||
if (!pubkey) return;
|
||||
try {
|
||||
const db = await openNutzapMintListDb();
|
||||
if (!db.objectStoreNames.contains(NUTZAP_MINTLIST_STORE)) {
|
||||
db.close();
|
||||
return;
|
||||
}
|
||||
await new Promise((resolve, reject) => {
|
||||
const tx = db.transaction(NUTZAP_MINTLIST_STORE, 'readwrite');
|
||||
tx.objectStore(NUTZAP_MINTLIST_STORE).put({
|
||||
pubkey,
|
||||
...entry,
|
||||
cachedAt: Date.now()
|
||||
});
|
||||
tx.oncomplete = () => resolve();
|
||||
tx.onerror = () => reject(tx.error);
|
||||
});
|
||||
db.close();
|
||||
} catch (error) {
|
||||
console.warn('[Worker] putNutzapMintListToDb failed', error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Read a cached kind 10019 mint list for a pubkey from IDB.
|
||||
* Returns null when missing or stale (older than NUTZAP_MINTLIST_PREFETCH_TTL_MS).
|
||||
* @param {string} pubkey
|
||||
* @returns {Promise<Object|null>}
|
||||
*/
|
||||
async function getNutzapMintListFromDb(pubkey) {
|
||||
if (!pubkey) return null;
|
||||
try {
|
||||
const db = await openNutzapMintListDb();
|
||||
if (!db.objectStoreNames.contains(NUTZAP_MINTLIST_STORE)) {
|
||||
db.close();
|
||||
return null;
|
||||
}
|
||||
const row = await new Promise((resolve) => {
|
||||
const tx = db.transaction(NUTZAP_MINTLIST_STORE, 'readonly');
|
||||
const req = tx.objectStore(NUTZAP_MINTLIST_STORE).get(pubkey);
|
||||
req.onsuccess = () => resolve(req.result || null);
|
||||
req.onerror = () => resolve(null);
|
||||
});
|
||||
db.close();
|
||||
if (!row) return null;
|
||||
if (Date.now() - Number(row.cachedAt || 0) > NUTZAP_MINTLIST_PREFETCH_TTL_MS) {
|
||||
return null; // stale
|
||||
}
|
||||
return row;
|
||||
} catch (error) {
|
||||
console.warn('[Worker] getNutzapMintListFromDb failed', error?.message || error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function serializeRelayEventData(data) {
|
||||
if (data === null || data === undefined) return null;
|
||||
if (typeof data === 'string' || typeof data === 'number' || typeof data === 'boolean') return data;
|
||||
@@ -1867,6 +1959,22 @@ async function fetchStartupEventDownloads(pubkey) {
|
||||
await processIncomingNutzaps(eventsByKey.kind9321 || [], { context: 'startup-fetch' });
|
||||
|
||||
broadcastStartupStatus('Startup downloads complete', { stage: 'startup-downloads', state: 'done', counts });
|
||||
|
||||
// Tier 1: proactively prefetch kind 10019 nutzap mint lists for all
|
||||
// followed users so resolveZapCapabilities() can hit IDB. This runs in the
|
||||
// background and must not block startup completion, so we do not await it.
|
||||
try {
|
||||
const kind3Events = Array.from(eventsByKey.kind3 || []);
|
||||
const latestKind3 = kind3Events
|
||||
.sort((a, b) => Number(b?.created_at || 0) - Number(a?.created_at || 0))[0] || null;
|
||||
if (latestKind3) {
|
||||
prefetchFollowedNutzapMintLists(latestKind3).catch((error) => {
|
||||
console.warn('[Worker] background kind 10019 prefetch failed', error?.message || error);
|
||||
});
|
||||
}
|
||||
} catch (prefetchError) {
|
||||
console.warn('[Worker] kind 10019 prefetch scheduling failed', prefetchError?.message || prefetchError);
|
||||
}
|
||||
}
|
||||
|
||||
function ensureStartupWalletSubscriptions(pubkey) {
|
||||
@@ -3205,6 +3313,142 @@ async function handleWalletPublishMintList(requestId, relays, receiveMints, port
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Parse a kind 3 (contact list) event into a de-duplicated array of followed
|
||||
* pubkeys (the 'p' tags).
|
||||
* @param {Object|null|undefined} kind3Event
|
||||
* @returns {string[]}
|
||||
*/
|
||||
function extractFollowedPubkeysFromKind3(kind3Event) {
|
||||
if (!kind3Event || !Array.isArray(kind3Event.tags)) return [];
|
||||
const pubkeys = new Set();
|
||||
for (const tag of kind3Event.tags) {
|
||||
if (Array.isArray(tag) && tag[0] === 'p' && tag[1] && String(tag[1]).length >= 32) {
|
||||
pubkeys.add(String(tag[1]));
|
||||
}
|
||||
}
|
||||
return Array.from(pubkeys);
|
||||
}
|
||||
|
||||
/**
|
||||
* Parse a raw kind 10019 event into the mint-list shape used by the cache.
|
||||
* @param {Object} event
|
||||
* @returns {{ hasMintList:boolean, mints:string[], relays:string[], p2pk:string|null, eventId:string|null, created_at:number }}
|
||||
*/
|
||||
function parseKind10019Event(event) {
|
||||
const mints = Array.from(new Set((event.tags || [])
|
||||
.filter((tag) => tag?.[0] === 'mint' && tag?.[1])
|
||||
.map((tag) => normalizeMintUrl(tag[1]))
|
||||
.filter(Boolean)));
|
||||
const relays = Array.from(new Set((event.tags || [])
|
||||
.filter((tag) => tag?.[0] === 'relay' && tag?.[1])
|
||||
.map((tag) => String(tag[1]).trim())
|
||||
.filter((url) => /^wss?:\/\//i.test(url))));
|
||||
const p2pkTag = (event.tags || []).find((tag) => tag?.[0] === 'pubkey' && tag?.[1]);
|
||||
const p2pk = normalizeCashuP2pk(p2pkTag?.[1] || '') || null;
|
||||
return {
|
||||
hasMintList: mints.length > 0,
|
||||
mints,
|
||||
relays,
|
||||
p2pk,
|
||||
eventId: event.id || null,
|
||||
created_at: Number(event.created_at || 0)
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Proactively fetch kind 10019 (nutzap mint lists) for all followed pubkeys
|
||||
* discovered in the user's kind 3 contact list, and cache the results in
|
||||
* IndexedDB. This is the Tier 1 fetch strategy: followed users are pre-warmed
|
||||
* on startup so resolveZapCapabilities() can hit IDB instead of relays.
|
||||
*
|
||||
* Runs in the background and never rejects — failures are logged only.
|
||||
*
|
||||
* @param {Object|null|undefined} kind3Event - the user's kind 3 contact list
|
||||
*/
|
||||
async function prefetchFollowedNutzapMintLists(kind3Event) {
|
||||
if (!ndk) return;
|
||||
const pubkeys = extractFollowedPubkeysFromKind3(kind3Event);
|
||||
if (pubkeys.length === 0) {
|
||||
broadcastStartupStatus('No followed pubkeys to prefetch nutzap mint lists for', {
|
||||
stage: 'kind10019-prefetch',
|
||||
state: 'skipped'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
broadcastStartupStatus(`Prefetching nutzap mint lists (kind 10019) for ${pubkeys.length} followed users...`, {
|
||||
stage: 'kind10019-prefetch',
|
||||
state: 'start',
|
||||
count: pubkeys.length
|
||||
});
|
||||
|
||||
const startedAt = Date.now();
|
||||
let stored = 0;
|
||||
|
||||
try {
|
||||
// Fetch in batches to keep relay filters reasonable.
|
||||
for (let i = 0; i < pubkeys.length; i += NUTZAP_MINTLIST_PREFETCH_BATCH) {
|
||||
const batch = pubkeys.slice(i, i + NUTZAP_MINTLIST_PREFETCH_BATCH);
|
||||
try {
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [10019],
|
||||
authors: batch
|
||||
});
|
||||
const eventList = Array.from(events || []);
|
||||
|
||||
// Group events by author and keep only the latest per pubkey.
|
||||
const latestByAuthor = new Map();
|
||||
for (const event of eventList) {
|
||||
const prev = latestByAuthor.get(event.pubkey);
|
||||
if (!prev || Number(event.created_at || 0) > Number(prev.created_at || 0)) {
|
||||
latestByAuthor.set(event.pubkey, event);
|
||||
}
|
||||
}
|
||||
|
||||
for (const [author, event] of latestByAuthor) {
|
||||
const parsed = parseKind10019Event(event);
|
||||
await putNutzapMintListToDb(author, parsed);
|
||||
stored++;
|
||||
}
|
||||
|
||||
// Record an explicit "no mint list" entry for followed pubkeys
|
||||
// that returned nothing, so we can short-circuit future lookups
|
||||
// within the TTL window.
|
||||
for (const author of batch) {
|
||||
if (!latestByAuthor.has(author)) {
|
||||
await putNutzapMintListToDb(author, {
|
||||
hasMintList: false,
|
||||
mints: [],
|
||||
relays: [],
|
||||
p2pk: null,
|
||||
eventId: null,
|
||||
created_at: 0
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (batchError) {
|
||||
console.warn('[Worker] kind 10019 prefetch batch failed', batchError?.message || batchError);
|
||||
}
|
||||
}
|
||||
|
||||
broadcastStartupStatus(`Nutzap mint list prefetch done (${stored} stored)`, {
|
||||
stage: 'kind10019-prefetch',
|
||||
state: 'done',
|
||||
count: stored,
|
||||
durationMs: Date.now() - startedAt
|
||||
});
|
||||
} catch (error) {
|
||||
broadcastStartupStatus('Nutzap mint list prefetch failed', {
|
||||
stage: 'kind10019-prefetch',
|
||||
state: 'failed',
|
||||
error: error?.message || String(error),
|
||||
durationMs: Date.now() - startedAt
|
||||
});
|
||||
console.warn('[Worker] prefetchFollowedNutzapMintLists failed', error?.message || error);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleWalletFetchMintList(requestId, targetPubkey, port) {
|
||||
try {
|
||||
if (!ndk) throw new Error('NDK not initialized');
|
||||
@@ -3214,6 +3458,30 @@ async function handleWalletFetchMintList(requestId, targetPubkey, port) {
|
||||
throw new Error('Target pubkey is required');
|
||||
}
|
||||
|
||||
// Tier 2 lazy fetch: consult the IDB cache (populated by the Tier 1
|
||||
// startup prefetch) before hitting relays. A fresh cache hit avoids a
|
||||
// round-trip for non-followed-but-recently-seen pubkeys too.
|
||||
try {
|
||||
const cached = await getNutzapMintListFromDb(author);
|
||||
if (cached) {
|
||||
port.postMessage({
|
||||
type: 'response',
|
||||
requestId,
|
||||
data: {
|
||||
hasMintList: Boolean(cached.hasMintList),
|
||||
mints: Array.isArray(cached.mints) ? cached.mints : [],
|
||||
relays: Array.isArray(cached.relays) ? cached.relays : [],
|
||||
p2pk: cached.p2pk || null,
|
||||
eventId: cached.eventId || null,
|
||||
created_at: Number(cached.created_at || 0)
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
} catch (_cacheError) {
|
||||
// Fall through to relay fetch on any cache error.
|
||||
}
|
||||
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [10019],
|
||||
authors: [author],
|
||||
@@ -3224,43 +3492,35 @@ async function handleWalletFetchMintList(requestId, targetPubkey, port) {
|
||||
.sort((a, b) => Number(b?.created_at || 0) - Number(a?.created_at || 0))[0];
|
||||
|
||||
if (!latest) {
|
||||
port.postMessage({
|
||||
type: 'response',
|
||||
requestId,
|
||||
data: {
|
||||
hasMintList: false,
|
||||
mints: [],
|
||||
relays: [],
|
||||
p2pk: null,
|
||||
eventId: null
|
||||
}
|
||||
});
|
||||
const emptyEntry = {
|
||||
hasMintList: false,
|
||||
mints: [],
|
||||
relays: [],
|
||||
p2pk: null,
|
||||
eventId: null,
|
||||
created_at: 0
|
||||
};
|
||||
// Cache the negative result so repeated lookups are cheap.
|
||||
putNutzapMintListToDb(author, emptyEntry).catch(() => {});
|
||||
port.postMessage({ type: 'response', requestId, data: emptyEntry });
|
||||
return;
|
||||
}
|
||||
|
||||
const mints = Array.from(new Set((latest.tags || [])
|
||||
.filter((tag) => tag?.[0] === 'mint' && tag?.[1])
|
||||
.map((tag) => normalizeMintUrl(tag[1]))
|
||||
.filter(Boolean)));
|
||||
const parsed = parseKind10019Event(latest);
|
||||
|
||||
const relays = Array.from(new Set((latest.tags || [])
|
||||
.filter((tag) => tag?.[0] === 'relay' && tag?.[1])
|
||||
.map((tag) => String(tag[1]).trim())
|
||||
.filter((url) => /^wss?:\/\//i.test(url))));
|
||||
|
||||
const p2pkTag = (latest.tags || []).find((tag) => tag?.[0] === 'pubkey' && tag?.[1]);
|
||||
const p2pk = normalizeCashuP2pk(p2pkTag?.[1] || '') || null;
|
||||
// Cache the relay result for future lookups.
|
||||
putNutzapMintListToDb(author, parsed).catch(() => {});
|
||||
|
||||
port.postMessage({
|
||||
type: 'response',
|
||||
requestId,
|
||||
data: {
|
||||
hasMintList: mints.length > 0,
|
||||
mints,
|
||||
relays,
|
||||
p2pk,
|
||||
eventId: latest.id || null,
|
||||
created_at: Number(latest.created_at || 0)
|
||||
hasMintList: parsed.hasMintList,
|
||||
mints: parsed.mints,
|
||||
relays: parsed.relays,
|
||||
p2pk: parsed.p2pk,
|
||||
eventId: parsed.eventId,
|
||||
created_at: parsed.created_at
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
|
||||
@@ -109,6 +109,16 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.topPostComposerInput {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
min-height: 6em;
|
||||
padding: 8px;
|
||||
line-height: 1.4;
|
||||
border: 2px solid var(--primary-color);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.divPostItem .post-composer-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -169,7 +179,7 @@
|
||||
|
||||
<div id="divBody">
|
||||
<div id="divBackBar">
|
||||
<a id="btnBack" href="./feed2.html" title="Back to feed">← Feed</a>
|
||||
<a id="btnBack" href="./feed.html" title="Back to feed">← Feed</a>
|
||||
</div>
|
||||
<div id="divHint">Loading thread…</div>
|
||||
<div id="divThread">
|
||||
@@ -244,6 +254,8 @@
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetMints,
|
||||
walletGetBalance,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -486,6 +498,8 @@
|
||||
walletPayInvoice,
|
||||
walletSendNutzap,
|
||||
walletFetchMintList,
|
||||
walletGetMints,
|
||||
walletGetBalance,
|
||||
getRelayData,
|
||||
getUserSettings,
|
||||
patchUserSettings,
|
||||
@@ -575,8 +589,11 @@
|
||||
if (!evt?.tags) return false;
|
||||
const eTags = evt.tags.filter((t) => t[0] === 'e' && t[1]);
|
||||
if (eTags.length === 0) return false;
|
||||
// A reply is any kind 1 that references the target event id in an e tag.
|
||||
return eTags.some((t) => t[1] === targetEventId);
|
||||
// A reply is any kind 1 that references the root post OR any already-known
|
||||
// reply in the thread (nested replies only carry their immediate parent,
|
||||
// not the root post id). This keeps the thread inclusive of replies-to-replies.
|
||||
if (eTags.some((t) => t[1] === targetEventId)) return true;
|
||||
return eTags.some((t) => replyIds.has(t[1]));
|
||||
}
|
||||
|
||||
function upsertReply(evt) {
|
||||
@@ -850,11 +867,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
function appendReplyIfNew(evt) {
|
||||
if (!upsertReply(evt)) return;
|
||||
renderReplies();
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
BOTTOM REPLY COMPOSER
|
||||
================================================================
|
||||
@@ -886,6 +898,7 @@
|
||||
replyComposerInstance = mountComposer(hostEl, {
|
||||
currentPubkey,
|
||||
followedProfiles: [],
|
||||
layout: 'inline',
|
||||
showUploadIcon: true,
|
||||
showPreview: true,
|
||||
autoHideOnSubmit: false,
|
||||
@@ -964,27 +977,104 @@
|
||||
});
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------
|
||||
fetchRepliesRecursive(rootEventId, maxDepth)
|
||||
----------------------------------------------------------------
|
||||
Recursively fetches replies to the root post AND replies to those
|
||||
replies (nested replies), up to maxDepth levels. Nested replies
|
||||
only carry their immediate parent in their `e` tags — not the root
|
||||
post id — so a single { '#e': [rootId] } query misses them.
|
||||
|
||||
Strategy (breadth-first by depth level):
|
||||
depth 0: fetch replies to rootEventId
|
||||
depth 1: fetch replies to every reply found at depth 0
|
||||
depth 2: fetch replies to every reply found at depth 1
|
||||
... up to maxDepth
|
||||
|
||||
The `#e` filter accepts an array of ids, so we batch all ids at
|
||||
the current depth into a single fetch. Dedup via replyIds so a
|
||||
reply discovered via multiple parent paths is only added once.
|
||||
|
||||
Both the cache (queryCache) and relays (ndkFetchEvents) are
|
||||
consulted at each level — cache first for fast display, then
|
||||
relays for hydration. A per-level timeout guards against
|
||||
excessive relay requests on very long threads.
|
||||
---------------------------------------------------------------- */
|
||||
const REPLY_FETCH_MAX_DEPTH = 5;
|
||||
const REPLY_FETCH_LEVEL_TIMEOUT_MS = 8000;
|
||||
|
||||
function fetchRepliesForLevelFromCache(parentIds) {
|
||||
return queryCache({ kinds: [1], '#e': parentIds }).catch(() => []).then((r) => Array.isArray(r) ? r : []);
|
||||
}
|
||||
|
||||
function fetchRepliesForLevelFromRelays(parentIds) {
|
||||
return new Promise((resolve) => {
|
||||
let settled = false;
|
||||
const timer = setTimeout(() => {
|
||||
if (settled) return;
|
||||
settled = true;
|
||||
resolve([]);
|
||||
}, REPLY_FETCH_LEVEL_TIMEOUT_MS);
|
||||
|
||||
ndkFetchEvents({ kinds: [1], '#e': parentIds })
|
||||
.then((events) => {
|
||||
if (settled) return;
|
||||
settled = true;
|
||||
clearTimeout(timer);
|
||||
resolve(Array.isArray(events) ? events : []);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.warn('[post-feed.html] Recursive reply level fetch failed:', error?.message || error);
|
||||
if (settled) return;
|
||||
settled = true;
|
||||
clearTimeout(timer);
|
||||
resolve([]);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function fetchRepliesRecursive(rootEventId, maxDepth = REPLY_FETCH_MAX_DEPTH) {
|
||||
if (!rootEventId) return;
|
||||
|
||||
let currentLevelIds = [rootEventId];
|
||||
|
||||
for (let depth = 0; depth < maxDepth; depth += 1) {
|
||||
if (currentLevelIds.length === 0) break;
|
||||
|
||||
// Cache first — fast display of whatever we already have.
|
||||
const cachedEvents = await fetchRepliesForLevelFromCache(currentLevelIds);
|
||||
const nextLevelIds = [];
|
||||
for (const evt of cachedEvents) {
|
||||
if (upsertReply(evt)) {
|
||||
nextLevelIds.push(evt.id);
|
||||
}
|
||||
}
|
||||
if (cachedEvents.length > 0) renderReplies();
|
||||
|
||||
// Then relay hydration for this level.
|
||||
const relayEvents = await fetchRepliesForLevelFromRelays(currentLevelIds);
|
||||
for (const evt of relayEvents) {
|
||||
if (upsertReply(evt)) {
|
||||
nextLevelIds.push(evt.id);
|
||||
}
|
||||
}
|
||||
if (relayEvents.length > 0) renderReplies();
|
||||
|
||||
// Move to the next depth level: replies to the replies we just found.
|
||||
// (upsertReply dedupes via replyIds, so ids already seen are skipped
|
||||
// on the next iteration by virtue of not being newly added — but we
|
||||
// still need to query for their children, so include all newly-found
|
||||
// ids here.)
|
||||
currentLevelIds = nextLevelIds;
|
||||
}
|
||||
|
||||
// Final render to ensure consistency.
|
||||
renderReplies();
|
||||
}
|
||||
|
||||
async function fetchReplies() {
|
||||
if (!targetEventId) return;
|
||||
|
||||
// Cache first.
|
||||
try {
|
||||
const cachedReplies = await queryCache({ kinds: [1], '#e': [targetEventId] });
|
||||
if (Array.isArray(cachedReplies)) {
|
||||
cachedReplies.forEach((evt) => upsertReply(evt));
|
||||
renderReplies();
|
||||
}
|
||||
} catch (_) {}
|
||||
|
||||
// Then relay fetch.
|
||||
void ndkFetchEvents({ kinds: [1], '#e': [targetEventId] }).then((fresh) => {
|
||||
if (Array.isArray(fresh)) {
|
||||
fresh.forEach((evt) => upsertReply(evt));
|
||||
}
|
||||
renderReplies();
|
||||
}).catch((error) => {
|
||||
console.warn('[post-feed.html] Reply fetch failed:', error?.message || error);
|
||||
});
|
||||
await fetchRepliesRecursive(targetEventId, REPLY_FETCH_MAX_DEPTH);
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
@@ -1153,7 +1243,16 @@
|
||||
}
|
||||
|
||||
if (isReplyToThread(evt)) {
|
||||
appendReplyIfNew(evt);
|
||||
const wasNew = upsertReply(evt);
|
||||
if (wasNew) {
|
||||
renderReplies();
|
||||
// A newly-seen reply may itself have nested replies we haven't
|
||||
// fetched yet. Trigger a one-level-deep fetch for replies to it
|
||||
// so nested replies appear in realtime too.
|
||||
fetchRepliesRecursive(evt.id, 1).catch((err) => {
|
||||
console.warn('[post-feed.html] Realtime nested fetch failed:', err?.message || err);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user