dsh-obsidian-memo 0.16.3

package/src/client/wall/note-card.js

@@ -0,0 +1,201 @@
+/** 可 memo 的卡片展示与事件转发；通过稳定 actions ref 调用交互。 */
+import { ActionIcon, ObsidianIcon } from '../components/icons.js';
+import { MAX_CARD_COMMENTS } from '../constants.js';
+import { imageCacheKey } from '../images/cache.js';
+import { CardThumb } from '../images/components.js';
+import { React, h } from '../react.js';
+import { DEFAULT_NOTE_COLOR } from '../styles/tokens.js';
+import { cardImages, commentHead, emojiLabel } from './model.js';
+
+const NoteCard = React.memo(function NoteCard(props) {
+  const {
+    note, emojis, pending, hoverActive, drawerOpen, actions,
+  } = props;
+  const t = actions.current.t;
+  const color = typeof note.color === 'string' && note.color !== '' ? note.color : DEFAULT_NOTE_COLOR;
+  // Host 的深色配套纸色；缺失（旧数据/未升级 Host）时回退到浅色纸色。
+  const darkColor = typeof note.darkColor === 'string' && note.darkColor !== '' ? note.darkColor : color;
+  const title = note.title || note.name || '';
+  const excerpt = typeof note.excerpt === 'string' ? note.excerpt : '';
+  // 有图时：标题仍 3 行、摘要 1 行、评论 1 条；缩略图排在评论条之后并贴卡片底部左侧。
+  const { items: images, more: moreImages } = cardImages(note);
+  const hasImages = images.length > 0;
+  const comments = Array.isArray(note.comments)
+    ? note.comments.slice(0, hasImages ? 1 : MAX_CARD_COMMENTS)
+    : [];
+  const commentCount = typeof note.commentCount === 'number' ? note.commentCount : comments.length;
+  const rest = Math.max(0, commentCount - comments.length);
+  const disabled = Boolean(pending);
+  // 菜单随整张卡片悬停/聚焦出现；此时统一隐藏图片预览。
+  const menuVisible = Boolean(!pending && !drawerOpen && !props.dragging && hoverActive);
+  const emojiList = Array.isArray(emojis) ? emojis : [];
+  const stop = (event) => event.stopPropagation();
+
+  return h('div', {
+    className: 'SN_card',
+    'data-note-path': note.path,
+    'data-menu': menuVisible ? 'true' : 'false',
+    'data-images': hasImages ? 'true' : 'false',
+    'data-drawer': drawerOpen ? 'true' : 'false',
+    'data-dragging': props.dragging ? 'true' : 'false',
+    draggable: !disabled && !props.preview,
+    onDragStart: (event) => {
+      if (disabled || event.target.closest?.('button,a,input,textarea')) { event.preventDefault(); return; }
+      event.dataTransfer.effectAllowed = 'move';
+      event.dataTransfer.setData('application/x-dsh-memo', note.path);
+      const rect = event.currentTarget?.getBoundingClientRect();
+      const doc = event.currentTarget?.ownerDocument;
+      if (doc?.body && event.dataTransfer.setDragImage) {
+        // 系统拖影始终盖住页面，改用透明拖影 + 同一 portal 内的卡片与动作提示。
+        const image = doc.createElement('canvas');
+        image.width = image.height = 1;
+        image.style.cssText = 'position:fixed;left:0;top:0;pointer-events:none';
+        doc.body.appendChild(image);
+        event.dataTransfer.setDragImage(image, 0, 0);
+        setTimeout(() => image.remove(), 0);
+      }
+      const started = actions.current.onDragStart(note, {
+        x: event.clientX, y: event.clientY, width: rect?.width, height: rect?.height,
+        offsetX: rect ? event.clientX - rect.left : 0, offsetY: rect ? event.clientY - rect.top : 0,
+      }, event.currentTarget);
+      if (started === false) event.preventDefault();
+    },
+    onDragEnd: () => actions.current.onDragEnd(),
+    style: { '--sn-card-bg': color, '--sn-card-bg-dark': darkColor },
+    tabIndex: props.preview ? -1 : 0,
+    role: 'group',
+    'aria-label': title,
+    title: t('card.openHint'),
+    // 单击打开右侧抽屉（event.detail===1 守卫：双击的第二次 click 不触发“开→关”）。
+    onClick: (event) => {
+      if (event.detail !== 1) return;
+      actions.current.onOpen(note);
+    },
+    onKeyDown: (event) => {
+      if (event.isComposing || event.nativeEvent?.isComposing || event.keyCode === 229) return;
+      if ((event.metaKey || event.ctrlKey) && event.key === 'Backspace') {
+        event.preventDefault(); event.stopPropagation();
+        if (!disabled) actions.current.onDelete(note);
+      }
+    },
+    // 0.13.4：整张卡片 hover/focus 就视为「菜单出现」，不再只监听 emoji 行。
+    onMouseEnter: () => actions.current.onCardEnter(note),
+    // 鼠标移出但焦点还留在卡片内（比如刚点过 emoji/按钮）时保持菜单状态，避免图片闪现。
+    onMouseLeave: (event) => actions.current.onCardLeave(
+      note,
+      typeof document !== 'undefined' && event.currentTarget.contains(document.activeElement),
+    ),
+    onFocus: () => actions.current.onCardEnter(note),
+    onBlur: (event) => {
+      const next = event.relatedTarget;
+      if (!next || !event.currentTarget.contains(next)) actions.current.onCardLeave(note);
+    },
+  },
+    h('div', { className: 'SN_cardClip' },
+      // 标题独占宽度；文件夹 tag 只在同一菜单激活时覆盖在右上角。
+      h('div', { className: 'SN_cardHead' },
+        h('h3', { className: 'SN_cardTitle', title: title },
+          h('span', { className: 'SN_cardTitleText' }, title),
+        ),
+      ),
+      note.tag ? h('div', { className: 'SN_cardTagLayer' },
+        h('span', { className: 'SN_cardTag', title: note.tag }, note.tag)) : null,
+      // 0.13.9：没有正文就不渲染摘要行（不再显示占位文案）。
+      excerpt ? h('p', {
+        className: 'SN_cardExcerpt',
+        'data-compact': hasImages ? 'true' : 'false',
+      }, excerpt) : null,
+      comments.length === 0 && rest === 0 ? null : h('div', { className: 'SN_cardComments' },
+        comments.map((comment, index) => h('div', { className: 'SN_cComment', key: index, title: comment.text || '' },
+          h('span', { className: 'SN_cCommentHead' }, commentHead(comment)),
+          h('span', { className: 'SN_cCommentText' }, comment.text || ''),
+        )),
+        rest > 0 ? h('span', { className: 'SN_cCommentMore' }, t('card.moreComments', { count: rest })) : null,
+      ),
+      // 0.13 修正：图片条排在评论条之后，margin-top:auto 贴卡片底部、align-self:flex-start 靠左。
+      hasImages
+        ? h('div', { className: 'SN_cardImages' },
+          images.map((image, index) => h(CardThumb, {
+            key: imageCacheKey(note.path, image.source) + '#' + index,
+            path: note.path,
+            image: image,
+          })),
+          moreImages > 0
+            ? h('span', { className: 'SN_moreImages' }, t('card.moreImages', { count: moreImages }))
+            : null,
+        )
+        : null,
+      pending
+        ? h('div', { className: 'SN_cardActions', 'data-visible': 'true', onDoubleClick: stop },
+          h('span', { className: 'SN_pending' },
+            h('span', { className: 'SN_pendingDot', 'aria-hidden': 'true' }),
+            t('card.pending'),
+          ),
+        )
+        : drawerOpen
+          ? null
+          : h('div', {
+            className: 'SN_cardActions',
+            'data-visible': menuVisible ? 'true' : undefined,
+            onDoubleClick: stop,
+          },
+            // 修正轮：所有 AI emoji 预设平铺一行（最多 12 枚，flex-wrap 自动换行），
+            // 每枚 27×27 只画 emoji 字形；hover / 键盘 focus 时按钮上方浮出 label 小标签。
+            h('div', {
+              className: 'SN_aiRow',
+              role: 'group',
+              'aria-label': t('card.aiComment'),
+            },
+              emojiList.length === 0
+                ? h('span', { className: 'SN_aiEmpty' }, t('card.noPresets'))
+                : emojiList.map((emoji) => h('button', {
+                  key: emoji.id || emoji.emoji,
+                  type: 'button',
+                  className: 'SN_aiBtn',
+                  disabled: disabled,
+                  // 标签由上方 .SN_aiLabel 小标签展示，不用原生 title，避免双 tooltip。
+                  'aria-label': emojiLabel(emoji) || emoji.emoji || t('card.aiComment'),
+                  onClick: (event) => {
+                    event.stopPropagation();
+                    actions.current.onPreset(note, emoji);
+                  },
+                },
+                  h('span', { className: 'SN_aiEmoji', 'aria-hidden': 'true' }, emoji.emoji || '✨'),
+                  h('span', { className: 'SN_aiLabel', 'aria-hidden': 'true' }, emoji.label || emoji.emoji || ''),
+                )),
+            ),
+            h('div', { className: 'SN_actionDivider', 'aria-hidden': 'true' }),
+            h('div', { className: 'SN_actionRow' },
+              h('button', {
+                type: 'button',
+                className: 'SN_mini',
+                disabled: disabled,
+                onClick: (event) => {
+                  event.stopPropagation();
+                  actions.current.onCopy(note);
+                },
+              }, h(ActionIcon, { kind: 'copy', size: 13 }), t('card.copy')),
+              // 归档 / 到项目统一从拖拽栏进入；卡片只保留复制与 Obsidian。
+              h('button', {
+                type: 'button',
+                className: 'SN_mini SN_obsidianBtn',
+                disabled: disabled,
+                title: t('card.obsidian'),
+                'aria-label': t('card.obsidian'),
+                onClick: (event) => {
+                  event.stopPropagation();
+                  actions.current.onOpenObsidian(note);
+                },
+              },
+                h(ObsidianIcon, null),
+                h('span', { className: 'SN_obsidianText' }, t('card.obsidian')),
+              ),
+            ),
+          ),
+    ),
+  );
+});
+
+NoteCard.displayName = 'NoteCard';
+
+export { NoteCard };

package/src/client/wall/use-note-actions.js

@@ -0,0 +1,107 @@
+/** 复制、系统打开、归档、删除与撤回；维护乐观视图和操作错误。 */
+import { UNDO_MS } from '../constants.js';
+import { React } from '../react.js';
+import { isAbortError } from '../utils.js';
+
+function useNoteActions({
+  aliveRef, archiveTargets, closeNoteDrawer, localPending, noteDrawerRef, pushErrorToast, pushToast,
+  refreshNow, request, setDrawerArchive, setHoverPath, tRef, updateView, viewRef,
+}) {
+  const deletingRef = React.useRef(new Set());
+
+  function findTarget(targetId) {
+    return archiveTargets.find((target) => target.id === targetId) || null;
+  }
+
+  function undoArchive(undoToken) {
+    request('undoArchive', { undoToken: undoToken })
+      .then(() => {
+        if (!aliveRef.current) return;
+        pushToast({ text: tRef.current('toast.restored'), kind: 'success' });
+        return refreshNow(false);
+      })
+      .catch((error) => {
+        if (aliveRef.current && !isAbortError(error)) pushErrorToast(error);
+      });
+  }
+
+  async function undoDelete(undoToken) {
+    try {
+      await request('undoDelete', { undoToken });
+      if (!aliveRef.current) return;
+      pushToast({ text: tRef.current('toast.restored'), kind: 'success' });
+      await refreshNow(false);
+    } catch (error) { if (aliveRef.current && !isAbortError(error)) pushErrorToast(error); }
+  }
+
+  async function runDelete(note) {
+    if (!note || deletingRef.current.has(note.path) || note.pending || localPending[note.path]) return;
+    deletingRef.current.add(note.path);
+    try {
+      const result = await request('deleteNote', { path: note.path });
+      if (!aliveRef.current) return;
+      const previous = viewRef.current;
+      updateView(Object.assign({}, previous, { notes: previous.notes.filter((item) => item.path !== note.path) }));
+      if (noteDrawerRef.current?.path === note.path) closeNoteDrawer();
+      setHoverPath(null);
+      pushToast({ text: tRef.current('toast.deleted'), kind: 'success',
+        timeout: Math.max(1, Math.min(5000, result.expiresAt - Date.now())),
+        action: { label: tRef.current('toast.deleteUndo'), run: () => undoDelete(result.undoToken) } });
+      if (result.sharedImageCount) pushToast({ text: tRef.current('toast.sharedImages') });
+      refreshNow(false);
+    } catch (error) {
+      if (aliveRef.current && !isAbortError(error)) { pushErrorToast(error); refreshNow(false); }
+    }
+    finally { deletingRef.current.delete(note.path); }
+  }
+
+  async function copyNote(note) {
+    try {
+      const full = await request('note', { path: note.path });
+      await navigator.clipboard.writeText((full.title || note.title || note.name || '') + '\n' + (full.body || ''));
+      if (aliveRef.current) pushToast({ text: tRef.current('toast.copied'), kind: 'success' });
+    } catch (error) { if (aliveRef.current) pushErrorToast(new Error(tRef.current('toast.copyFailed'))); }
+  }
+
+  function runArchive(note, targetId) {
+    if (!note || !targetId) return;
+    setDrawerArchive(false);
+    const target = findTarget(targetId);
+    return request('archive', { path: note.path, targetId: targetId })
+      .then((value) => {
+        if (!aliveRef.current) return;
+        const previous = viewRef.current;
+        updateView(Object.assign({}, previous, {
+          notes: previous.notes.filter((item) => item.path !== note.path),
+        }));
+        if (noteDrawerRef.current && noteDrawerRef.current.path === note.path) closeNoteDrawer();
+        const token = value && typeof value.undoToken === 'string' ? value.undoToken : '';
+        if (token !== '') {
+          pushToast({
+            text: tRef.current('toast.archived', { label: (target && target.label) || targetId }),
+            kind: 'success',
+            timeout: UNDO_MS,
+            action: { label: tRef.current('toast.undo'), run: () => undoArchive(token) },
+          });
+        } else {
+          pushToast({ text: tRef.current('toast.archived', { label: (target && target.label) || targetId }), kind: 'success' });
+        }
+        refreshNow(false);
+      })
+      .catch((error) => {
+        if (aliveRef.current && !isAbortError(error)) pushErrorToast(error);
+      });
+  }
+
+  function openInObsidian(note) {
+    if (!note || typeof note.path !== 'string' || note.path === '') return;
+    request('openInObsidian', { path: note.path })
+      .catch((error) => {
+        if (aliveRef.current && !isAbortError(error)) pushErrorToast(error);
+      });
+  }
+
+  return { findTarget, runDelete, copyNote, runArchive, openInObsidian };
+}
+
+export { useNoteActions };

package/src/client/wall/use-subfolders.js

@@ -0,0 +1,42 @@
+/** 子目录开关的版本化设置保存、乐观更新与失败回滚。 */
+import { React } from '../react.js';
+import { isAbortError } from '../utils.js';
+
+function useSubfolders({ aliveRef, pushErrorToast, pushToast, refreshNow, request, t, updateView, viewRef }) {
+  const [subfoldersBusy, setSubfoldersBusy] = React.useState(false);
+  const subfoldersBusyRef = React.useRef(false);
+
+  function toggleSubfolders() {
+    if (!viewRef.current.loaded || subfoldersBusyRef.current) return;
+    const settings = viewRef.current.settings;
+    if (!settings) {
+      pushToast({ text: t('settings.notReady'), kind: 'error' });
+      return;
+    }
+    const previous = settings;
+    const next = Object.assign({}, settings, { includeSubfolders: settings.includeSubfolders === false });
+    subfoldersBusyRef.current = true;
+    setSubfoldersBusy(true);
+    updateView(Object.assign({}, viewRef.current, { settings: next }));
+    request('saveSettings', { settings: next, expected: settings.configFile?.revision })
+      .then((value) => {
+        if (!aliveRef.current) return;
+        const normalized = value && value.settings ? value.settings : next;
+        updateView(Object.assign({}, viewRef.current, { settings: normalized }));
+        return refreshNow(true);
+      })
+      .catch((error) => {
+        if (!aliveRef.current || isAbortError(error)) return;
+        updateView(Object.assign({}, viewRef.current, { settings: previous }));
+        pushErrorToast(error);
+      })
+      .then(() => {
+        subfoldersBusyRef.current = false;
+        if (aliveRef.current) setSubfoldersBusy(false);
+      });
+  }
+
+  return { subfoldersBusy, toggleSubfolders };
+}
+
+export { useSubfolders };

package/src/client/wall/use-wall-content.js

@@ -0,0 +1,135 @@
+/** 便签墙卡片 memo、加载占位和配置/错误/空目录状态。 */
+import { CenterState } from '../components/feedback.js';
+import { Fragment, React, h } from '../react.js';
+import { NoteCard } from './note-card.js';
+
+function useWallContent({
+  actionsRef, dateRangeLabel, dragNote, emojis, filteredNotes, handleRefresh, handleWallClick,
+  handleWallMouseDown, hoverPath, loadError, loadMoreRef, loadingMore, localPending, noteDrawer,
+  openSettings, setDateMenu, setShowBackTop, sortedNotes, t, view, visibleLimit,
+}) {
+  const cardLocaleRef = React.useRef({ t: t, tick: 0 });
+
+  if (cardLocaleRef.current.t !== t) {
+    cardLocaleRef.current = { t: t, tick: cardLocaleRef.current.tick + 1 };
+  }
+
+  const wallCards = React.useMemo(() => sortedNotes.slice(0, visibleLimit).map((note) => h(NoteCard, {
+    key: cardLocaleRef.current.tick + ':' + note.path,
+    note, emojis, pending: note.pending || localPending[note.path] || null,
+    hoverActive: Boolean(hoverPath && hoverPath.path === note.path),
+    drawerOpen: Boolean(noteDrawer),
+    dragging: Boolean(dragNote && dragNote.path === note.path), actions: actionsRef,
+  })), [sortedNotes, visibleLimit, emojis, localPending, hoverPath, Boolean(noteDrawer), dragNote?.path, cardLocaleRef.current.tick]);
+
+  function renderWall() {
+    // 0.13.8 动态加载：只渲染前 visibleLimit 张（默认 50）；哨兵滚进视口再补下一批。
+    const hasMore = sortedNotes.length > visibleLimit;
+    return h('div', {
+      className: 'SN_wall',
+      onScroll: (event) => {
+        const wall = event.currentTarget;
+        setShowBackTop(wall.scrollTop >= wall.clientHeight && wall.scrollTop > 0);
+      },
+      onMouseDown: handleWallMouseDown,
+      onClick: handleWallClick,
+    },
+      wallCards,
+      h('div', {
+        key: 'load-more',
+        className: 'SN_loadMore',
+        'data-loading': loadingMore ? 'true' : 'false',
+        ref: loadMoreRef,
+        role: 'status',
+        'aria-live': 'polite',
+        'aria-hidden': hasMore || loadingMore ? undefined : 'true',
+        'aria-label': loadingMore ? t('panel.loadingMore') : undefined,
+      },
+        loadingMore
+          ? h(Fragment, null,
+            h('span', { className: 'SN_loadDots', 'aria-hidden': 'true' },
+              h('span', { className: 'SN_loadDot' }),
+              h('span', { className: 'SN_loadDot' }),
+              h('span', { className: 'SN_loadDot' }),
+            ),
+            h('span', { className: 'SN_loadText' }, t('panel.loadingMore')),
+          )
+          : null,
+      ),
+    );
+  }
+
+  function renderSkeleton() {
+    const cards = [];
+    for (let index = 0; index < 8; index += 1) {
+      cards.push(h('div', { key: index, className: 'SN_skelCard' }));
+    }
+    return h('div', { className: 'SN_wall', 'aria-busy': 'true', 'aria-label': t('panel.loading') }, cards);
+  }
+
+  function renderContent() {
+    if (!view.loaded) {
+      if (loadError) {
+        return h(CenterState, {
+          mark: '!',
+          title: t('state.loadErrorTitle'),
+          text: loadError,
+          actionLabel: t('state.loadErrorAction'),
+          onAction: handleRefresh,
+        });
+      }
+      return renderSkeleton();
+    }
+    if (!view.configured) {
+      if (view.error) {
+        return h(CenterState, {
+          mark: '!',
+          title: t('state.errorTitle'),
+          text: view.error,
+          actionLabel: t('state.unconfiguredAction'),
+          onAction: openSettings,
+        });
+      }
+      return h(CenterState, {
+        mark: '⚙',
+        title: t('state.unconfiguredTitle'),
+        text: t('state.unconfiguredText'),
+        actionLabel: t('state.unconfiguredAction'),
+        onAction: openSettings,
+      });
+    }
+    if (view.error && view.notes.length === 0) {
+      return h(CenterState, {
+        mark: '!',
+        title: t('state.errorTitle'),
+        text: view.error,
+        actionLabel: t('state.errorAction'),
+        onAction: handleRefresh,
+      });
+    }
+    if (view.notes.length === 0) {
+      return h(CenterState, {
+        mark: '✎',
+        title: t('state.emptyTitle'),
+        text: t('state.emptyText'),
+        actionLabel: t('state.emptyAction'),
+        onAction: handleRefresh,
+      });
+    }
+    // 0.13.4：墙上有便签，但当前日期筛选范围内没有 → 给出可操作的空态。
+    if (filteredNotes.length === 0) {
+      return h(CenterState, {
+        mark: '◷',
+        title: t('state.dateEmptyTitle'),
+        text: t('state.dateEmptyText', { range: dateRangeLabel }),
+        actionLabel: t('state.dateEmptyAction'),
+        onAction: () => setDateMenu(true),
+      });
+    }
+    return renderWall();
+  }
+
+  return { renderContent };
+}
+
+export { useWallContent };

package/src/client/wall/use-wall-filters.js

@@ -0,0 +1,92 @@
+/** 持有排序和日期菜单状态，管理本地持久化与日期时钟。 */
+import { SORT_OPTIONS } from '../constants.js';
+import {
+  readStoredDateEnabled, readStoredDateFilter, readStoredDateRealtime, readStoredSort, storeDateEnabled,
+  storeDateFilter, storeDateRealtime, storeSort,
+} from '../preferences.js';
+import { React } from '../react.js';
+import { isDateFilterId } from './model.js';
+
+function useWallFilters() {
+  const [sortId, setSortId] = React.useState(readStoredSort);
+  const [sortMenu, setSortMenu] = React.useState(false);
+  const sortWrapRef = React.useRef(null);
+  const [dateFilter, setDateFilter] = React.useState(readStoredDateFilter);
+  const [dateEnabled, setDateEnabled] = React.useState(readStoredDateEnabled);
+  const [dateRealtime, setDateRealtime] = React.useState(readStoredDateRealtime);
+  const [dateMenu, setDateMenu] = React.useState(false);
+  const dateWrapRef = React.useRef(null);
+  const [nowTick, setNowTick] = React.useState(() => Date.now());
+
+  React.useEffect(() => {
+    const timer = setInterval(() => setNowTick(Date.now()), 60 * 1000);
+    return () => clearInterval(timer);
+  }, []);
+
+  React.useEffect(() => {
+    if (!sortMenu) return undefined;
+    const onPointerDown = (event) => {
+      const target = event.target;
+      if (sortWrapRef.current && target && sortWrapRef.current.contains(target)) return;
+      setSortMenu(false);
+    };
+    document.addEventListener('mousedown', onPointerDown, true);
+    return () => document.removeEventListener('mousedown', onPointerDown, true);
+  }, [sortMenu]);
+
+  React.useEffect(() => {
+    if (!dateMenu) return undefined;
+    const onPointerDown = (event) => {
+      const target = event.target;
+      if (dateWrapRef.current && target && dateWrapRef.current.contains(target)) return;
+      setDateMenu(false);
+    };
+    document.addEventListener('mousedown', onPointerDown, true);
+    return () => document.removeEventListener('mousedown', onPointerDown, true);
+  }, [dateMenu]);
+
+  function toggleSortMenu() {
+    setSortMenu((value) => !value);
+    setDateMenu(false);
+  }
+
+  function chooseSort(id) {
+    if (!SORT_OPTIONS.some((option) => option.id === id)) return;
+    setSortId(id);
+    storeSort(id);
+    setSortMenu(false);
+  }
+
+  function openDateMenu() {
+    setDateMenu(true);
+    setSortMenu(false);
+  }
+
+  function toggleDateEnabled() {
+    const next = !dateEnabled;
+    setDateEnabled(next);
+    storeDateEnabled(next);
+    setDateMenu(false);
+  }
+
+  function chooseDateFilter(id) {
+    if (!isDateFilterId(id)) return;
+    setDateFilter(id);
+    storeDateFilter(id);
+    if (!dateEnabled) {
+      setDateEnabled(true);
+      storeDateEnabled(true);
+    }
+    setDateMenu(false);
+  }
+
+  function toggleDateRealtime() {
+    const next = !dateRealtime;
+    setDateRealtime(next);
+    storeDateRealtime(next);
+  }
+
+  return { sortId, sortMenu, setSortMenu, sortWrapRef, dateFilter, dateEnabled, dateRealtime, dateMenu, setDateMenu, dateWrapRef, nowTick, setNowTick, toggleSortMenu, chooseSort, openDateMenu, toggleDateEnabled, chooseDateFilter, toggleDateRealtime };
+}
+
+export { useWallFilters };

package/src/client/wall/use-wall-paging.js

@@ -0,0 +1,55 @@
+/** 分批渲染和墙底哨兵；筛选变化时回到首屏。 */
+import { WALL_PAGE_SIZE, WALL_PRELOAD_PX } from '../constants.js';
+import { React } from '../react.js';
+import { nextVisibleCount } from './model.js';
+
+function useWallPaging({ aliveRef, dateEnabled, dateFilter, dateRealtime, panelRef, pinned, sortId, sortedNotes, view }) {
+  const [visibleLimit, setVisibleLimit] = React.useState(WALL_PAGE_SIZE);
+  const [loadingMore, setLoadingMore] = React.useState(false);
+  const visibleLimitRef = React.useRef(WALL_PAGE_SIZE);
+  const loadingMoreRef = React.useRef(false);
+  const loadMoreRef = React.useRef(null);
+  const sortedNotesRef = React.useRef([]);
+
+  visibleLimitRef.current = visibleLimit;
+
+  sortedNotesRef.current = sortedNotes;
+
+  React.useEffect(() => {
+    visibleLimitRef.current = WALL_PAGE_SIZE;
+    setVisibleLimit(WALL_PAGE_SIZE);
+  }, [sortId, dateFilter, dateRealtime, dateEnabled]);
+
+  function requestMore() {
+    if (loadingMoreRef.current) return;
+    const total = sortedNotesRef.current.length;
+    if (visibleLimitRef.current >= total) return;
+    loadingMoreRef.current = true;
+    setLoadingMore(true);
+    setTimeout(() => {
+      if (!aliveRef.current) return;
+      setVisibleLimit((limit) => nextVisibleCount(limit, sortedNotesRef.current.length));
+      loadingMoreRef.current = false;
+      setLoadingMore(false);
+    }, 0);
+  }
+
+  React.useEffect(() => {
+    if (!view.loaded) return undefined;
+    if (sortedNotes.length <= visibleLimit) return undefined;
+    if (typeof IntersectionObserver !== 'function') return undefined;
+    const panel = panelRef.current;
+    const sentinel = loadMoreRef.current;
+    const wall = panel && typeof panel.querySelector === 'function' ? panel.querySelector('.SN_wall') : null;
+    if (!wall || !sentinel) return undefined;
+    const observer = new IntersectionObserver((entries) => {
+      if (entries.some((entry) => entry.isIntersecting)) requestMore();
+    }, { root: wall, rootMargin: '0px 0px ' + WALL_PRELOAD_PX + 'px 0px' });
+    observer.observe(sentinel);
+    return () => observer.disconnect();
+  }, [view.loaded, sortedNotes.length, visibleLimit, pinned]);
+
+  return { visibleLimit, loadingMore, loadMoreRef };
+}
+
+export { useWallPaging };