From 58dd2076817def229937fdcae3cbc9586f977c7c Mon Sep 17 00:00:00 2001
From: Lokuyow <94349922+Lokuyow@users.noreply.github.com>
Date: Sun, 15 Dec 2024 04:55:04 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20ZapSubscriptionManager=E3=81=AB?=
 =?UTF-8?q?=E3=82=B5=E3=83=96=E3=82=B9=E3=82=AF=E3=83=AA=E3=83=97=E3=82=B7?=
 =?UTF-8?q?=E3=83=A7=E3=83=B3=E7=AE=A1=E7=90=86=E6=A9=9F=E8=83=BD=E3=82=92?=
 =?UTF-8?q?=E8=BF=BD=E5=8A=A0=E3=81=97=E3=80=81UI=E3=81=AE=E3=82=AF?=
 =?UTF-8?q?=E3=83=AA=E3=83=BC=E3=83=B3=E3=82=A2=E3=83=83=E3=83=97=E5=87=A6?=
 =?UTF-8?q?=E7=90=86=E3=82=92=E6=94=B9=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/UIManager.js    | 12 +++++++++++-
 src/ZapManager.js   | 34 +++++++++++++++++++++++++++++++++-
 src/ui/ZapListUI.js | 14 ++++++++++----
 3 files changed, 54 insertions(+), 6 deletions(-)

diff --git a/src/UIManager.js b/src/UIManager.js
index 18ea72c..d25273d 100644
--- a/src/UIManager.js
+++ b/src/UIManager.js
@@ -92,6 +92,7 @@ class NostrZapViewDialog extends HTMLElement {
     subscriptionManager.setZapListUI(this.zapListUI);
 
     // UIコンポーネントの初期化の後に
+    // viewId に基づいて正しいイベントを取得
     const zapEvents = cacheManager.getZapEvents(this.viewId);
 
     if (!zapEvents?.length) {
@@ -183,6 +184,9 @@ class NostrZapViewDialog extends HTMLElement {
   closeDialog() {
     const dialog = this.#getElement(".dialog");
     if (dialog?.open) {
+      this.zapListUI?.destroy();
+      // UIのクリーンアップのみを行い、キャッシュはそのまま保持
+      subscriptionManager.unsubscribe(this.viewId);
       dialog.close();
       this.remove();
     }
@@ -351,7 +355,13 @@ export async function showDialog(viewId) {
 }
 
 // 以下の���クスポート関数を修正
-export const closeDialog = (viewId) => dialogManager.execute(viewId, 'closeDialog');
+export const closeDialog = (viewId) => {
+  const dialog = dialogManager.get(viewId);
+  if (dialog) {
+    subscriptionManager.unsubscribe(viewId);
+    dialog.closeDialog();
+  }
+};
 export const displayZapStats = (stats, viewId) => dialogManager.execute(viewId, 'displayZapStats', stats);
 export const replacePlaceholderWithZap = (event, index, viewId) => 
   dialogManager.execute(viewId, 'replacePlaceholderWithZap', event, index);
diff --git a/src/ZapManager.js b/src/ZapManager.js
index 09b3d71..b29c862 100644
--- a/src/ZapManager.js
+++ b/src/ZapManager.js
@@ -10,8 +10,15 @@ class ZapSubscriptionManager {
     this.viewConfigs = new Map();
     this.configStore = new Map();
     this.observers = new Map();
+    // 追加: private フィールドを初期化
+    this.#subscriptions = new Map();
+    this.#state = new Map();
   }
 
+  // Private フィールド宣言を追加
+  #subscriptions;
+  #state;
+
   // 基本設定メソッド
   setZapListUI(zapListUI) {
     this.zapListUI = zapListUI;
@@ -370,7 +377,8 @@ class ZapSubscriptionManager {
     return new Promise((resolve) => {
       const bufferInterval = this._setupBufferInterval(batchEvents, viewId);
       
-      eventPool.subscribeToZaps(viewId, config, decoded, {
+      // サブスクリプションを保存
+      const subscription = eventPool.subscribeToZaps(viewId, config, decoded, {
         onevent: (event) => {
           const currentLastTime = this._handleInitialEvent(event, batchEvents, lastEventTime, viewId);
           if (currentLastTime !== null) {
@@ -382,6 +390,9 @@ class ZapSubscriptionManager {
           resolve({ batchEvents: [...batchEvents], lastEventTime });
         }
       });
+
+      // サブスクリプションを保存
+      this.#subscriptions.set(viewId, { zap: subscription });
     });
   }
 
@@ -465,6 +476,27 @@ class ZapSubscriptionManager {
     const canLoad = config && !state.isLoading && state.lastEventTime;
     return canLoad;
   }
+
+  unsubscribe(viewId) {
+    try {
+      // サブスクリプションの終了
+      const subscription = this.#subscriptions.get(viewId);
+      if (subscription?.zap) {
+        subscription.zap();
+        subscription.zap = null;
+      }
+
+      // 状態のリセット
+      this.#state.set(viewId, { isZapClosed: true });
+
+      // Observer のクリーンアップ
+      this._cleanupInfiniteScroll(viewId);
+      
+      console.log(`Unsubscribed from zaps for viewId: ${viewId}`);
+    } catch (error) {
+      console.error(`Failed to unsubscribe for viewId ${viewId}:`, error);
+    }
+  }
 }
 
 const subscriptionManager = new ZapSubscriptionManager();
diff --git a/src/ui/ZapListUI.js b/src/ui/ZapListUI.js
index a29c0f3..bf4016b 100644
--- a/src/ui/ZapListUI.js
+++ b/src/ui/ZapListUI.js
@@ -50,6 +50,12 @@ export class ZapListUI {
       this.profileUpdateUnsubscribe();
       this.profileUpdateUnsubscribe = null;
     }
+
+    // リストをクリア
+    const list = this.#getElement(".dialog-zap-list");
+    if (list) {
+      list.innerHTML = '';
+    }
   }
 
   // 2. リスト操作の基本メソッド
@@ -100,15 +106,15 @@ export class ZapListUI {
   }
 
   async renderZapListFromCache(zapEventsCache) {
-    if (!zapEventsCache?.length) {
-      // キャッシュ状態をリセット
+    // viewId に基づいて正しいイベントを取得
+    const events = cacheManager.getZapEvents(this.viewId);
+    if (!events?.length) {
       cacheManager.setNoZapsState(this.viewId, false);
       return this.showNoZapsMessage();
     }
 
     await this.#updateListContent(async (list) => {
-      // イベントの前処理を非同期で実行
-      const uniqueEvents = this.#getUniqueEvents(zapEventsCache);
+      const uniqueEvents = this.#getUniqueEvents(events); // zapEventsCache から events に変更
       const listFragment = document.createDocumentFragment();
       const profileUpdatesQueue = [];