clean up

package.json

@@ -20,6 +20,7 @@
     "@radix-ui/react-tabs": "^1.0.3",
     "@supabase/supabase-js": "^2.12.1",
     "@tanstack/query-core": "^4.27.0",
+    "@tanstack/react-query": "^4.28.0",
     "@tanstack/react-virtual": "3.0.0-beta.54",
     "@tauri-apps/api": "^1.2.0",
     "@uiw/react-markdown-preview": "^4.1.10",
@@ -37,10 +38,9 @@
     "nostr-tools": "^1.7.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-hook-form": "^7.43.7",
+    "react-hook-form": "^7.43.8",
     "react-player": "^2.12.0",
     "react-string-replace": "^1.1.0",
-    "react-virtuoso": "^4.1.0",
     "tauri-plugin-sql-api": "github:tauri-apps/tauri-plugin-sql",
     "unique-names-generator": "^4.7.1",
     "ws": "^8.13.0"
@@ -49,8 +49,8 @@
     "@tailwindcss/typography": "^0.5.9",
     "@tauri-apps/cli": "^1.2.3",
     "@trivago/prettier-plugin-sort-imports": "^4.1.1",
-    "@types/node": "^18.15.5",
+    "@types/node": "^18.15.9",
-    "@types/react": "^18.0.28",
+    "@types/react": "^18.0.29",
     "@types/react-dom": "^18.0.11",
     "@typescript-eslint/eslint-plugin": "^5.56.0",
     "@typescript-eslint/parser": "^5.56.0",
@@ -64,7 +64,7 @@
     "husky": "^8.0.3",
     "lint-staged": "^13.2.0",
     "postcss": "^8.4.21",
-    "prettier": "^2.8.6",
+    "prettier": "^2.8.7",
     "prettier-plugin-tailwindcss": "^0.2.5",
     "prop-types": "^15.8.1",
     "tailwindcss": "^3.2.7",

pnpm-lock.yaml

@@ -10,12 +10,13 @@ specifiers:
   '@supabase/supabase-js': ^2.12.1
   '@tailwindcss/typography': ^0.5.9
   '@tanstack/query-core': ^4.27.0
+  '@tanstack/react-query': ^4.28.0
   '@tanstack/react-virtual': 3.0.0-beta.54
   '@tauri-apps/api': ^1.2.0
   '@tauri-apps/cli': ^1.2.3
   '@trivago/prettier-plugin-sort-imports': ^4.1.1
-  '@types/node': ^18.15.5
+  '@types/node': ^18.15.9
-  '@types/react': ^18.0.28
+  '@types/react': ^18.0.29
   '@types/react-dom': ^18.0.11
   '@typescript-eslint/eslint-plugin': ^5.56.0
   '@typescript-eslint/parser': ^5.56.0
@@ -42,15 +43,14 @@ specifiers:
   nostr-relaypool: ^0.5.18
   nostr-tools: ^1.7.5
   postcss: ^8.4.21
-  prettier: ^2.8.6
+  prettier: ^2.8.7
   prettier-plugin-tailwindcss: ^0.2.5
   prop-types: ^15.8.1
   react: ^18.2.0
   react-dom: ^18.2.0
-  react-hook-form: ^7.43.7
+  react-hook-form: ^7.43.8
   react-player: ^2.12.0
   react-string-replace: ^1.1.0
-  react-virtuoso: ^4.1.0
   tailwindcss: ^3.2.7
   tauri-plugin-sql-api: github:tauri-apps/tauri-plugin-sql
   typescript: ^4.9.5
@@ -59,17 +59,18 @@ specifiers:
 
 dependencies:
   '@radix-ui/react-collapsible': 1.0.2_biqbaboplfbrettd7655fr4n2y
-  '@radix-ui/react-dialog': 1.0.3_zula6vjvt3wdocc4mwcxqa6nzi
+  '@radix-ui/react-dialog': 1.0.3_aen5vu2fkbnw3ssyd5drxdxkh4
-  '@radix-ui/react-dropdown-menu': 2.0.4_zula6vjvt3wdocc4mwcxqa6nzi
+  '@radix-ui/react-dropdown-menu': 2.0.4_aen5vu2fkbnw3ssyd5drxdxkh4
   '@radix-ui/react-icons': 1.3.0_react@18.2.0
-  '@radix-ui/react-popover': 1.0.5_zula6vjvt3wdocc4mwcxqa6nzi
+  '@radix-ui/react-popover': 1.0.5_aen5vu2fkbnw3ssyd5drxdxkh4
   '@radix-ui/react-tabs': 1.0.3_biqbaboplfbrettd7655fr4n2y
   '@supabase/supabase-js': 2.12.1
   '@tanstack/query-core': 4.27.0
+  '@tanstack/react-query': 4.28.0_biqbaboplfbrettd7655fr4n2y
   '@tanstack/react-virtual': 3.0.0-beta.54_react@18.2.0
   '@tauri-apps/api': 1.2.0
-  '@uiw/react-markdown-preview': 4.1.10_zula6vjvt3wdocc4mwcxqa6nzi
+  '@uiw/react-markdown-preview': 4.1.10_aen5vu2fkbnw3ssyd5drxdxkh4
-  '@uiw/react-md-editor': 3.20.5_zula6vjvt3wdocc4mwcxqa6nzi
+  '@uiw/react-md-editor': 3.20.5_aen5vu2fkbnw3ssyd5drxdxkh4
   boring-avatars: 1.7.0
   dayjs: 1.11.7
   destr: 1.2.2
@@ -83,10 +84,9 @@ dependencies:
   nostr-tools: 1.7.5
   react: 18.2.0
   react-dom: 18.2.0_react@18.2.0
-  react-hook-form: 7.43.7_react@18.2.0
+  react-hook-form: 7.43.8_react@18.2.0
   react-player: 2.12.0_react@18.2.0
   react-string-replace: 1.1.0
-  react-virtuoso: 4.1.0_biqbaboplfbrettd7655fr4n2y
   tauri-plugin-sql-api: github.com/tauri-apps/tauri-plugin-sql/3a8b9a6b244df7512bc5ef8692cebdedbab3ccce
   unique-names-generator: 4.7.1
   ws: 8.13.0
@@ -94,9 +94,9 @@ dependencies:
 devDependencies:
   '@tailwindcss/typography': 0.5.9_tailwindcss@3.2.7
   '@tauri-apps/cli': 1.2.3
-  '@trivago/prettier-plugin-sort-imports': 4.1.1_prettier@2.8.6
+  '@trivago/prettier-plugin-sort-imports': 4.1.1_prettier@2.8.7
-  '@types/node': 18.15.5
+  '@types/node': 18.15.9
-  '@types/react': 18.0.28
+  '@types/react': 18.0.29
   '@types/react-dom': 18.0.11
   '@typescript-eslint/eslint-plugin': 5.56.0_iskin7c6dxqunwflhstekcjqmq
   '@typescript-eslint/parser': 5.56.0_vgl77cfdswitgr47lm5swmv43m
@@ -110,8 +110,8 @@ devDependencies:
   husky: 8.0.3
   lint-staged: 13.2.0
   postcss: 8.4.21
-  prettier: 2.8.6
+  prettier: 2.8.7
-  prettier-plugin-tailwindcss: 0.2.5_c5px7p3j4kcmt2ngqd44w4h7we
+  prettier-plugin-tailwindcss: 0.2.5_yk5p2qt6yzw3zyyilt4azle7eu
   prop-types: 15.8.1
   tailwindcss: 3.2.7_postcss@8.4.21
   typescript: 4.9.5
@@ -390,9 +390,9 @@ packages:
     dev: false
     optional: true
 
-  /@eslint-community/eslint-utils/4.3.0_eslint@8.36.0:
+  /@eslint-community/eslint-utils/4.4.0_eslint@8.36.0:
     resolution:
-      { integrity: sha512-v3oplH6FYCULtFuCeqyuTd9D2WKO937Dxdq+GmHOLL72TTRriLxz2VLlNfkZRsvj6PKnOPAtuT6dwrs/pA5DvA== }
+      { integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA== }
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
@@ -401,9 +401,9 @@ packages:
       eslint-visitor-keys: 3.3.0
     dev: true
 
-  /@eslint-community/regexpp/4.4.0:
+  /@eslint-community/regexpp/4.4.1:
     resolution:
-      { integrity: sha512-A9983Q0LnDGdLPjxyXQ00sbV+K+O+ko2Dr+CZigbHWtX9pNfxlaBkMR8X1CztI73zuEyEBXTVjx7CE+/VSwDiQ== }
+      { integrity: sha512-BISJ6ZE4xQsuL/FmsyRaiffpq977bMlsKfGHTQrOGFErfByxIe6iZTxPf/00Zon9b9a7iUykfQwejN3s2ZW/Bw== }
     engines: { node: ^12.0.0 || ^14.0.0 || >=16.0.0 }
     dev: true
 
@@ -443,7 +443,7 @@ packages:
       '@floating-ui/core': 0.7.3
     dev: false
 
-  /@floating-ui/react-dom/0.7.2_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@floating-ui/react-dom/0.7.2_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-1T0sJcpHgX/u4I1OzIEhlcrvkUN8ln39nz7fMoE/2HDHrPiMFoOGR7++GYyfUmIQHkkrTinaeQsO3XWubjSvGg== }
     peerDependencies:
@@ -453,7 +453,7 @@ packages:
       '@floating-ui/dom': 0.5.4
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
-      use-isomorphic-layout-effect: 1.1.2_pmekkgnqduwlme35zpnqhenc34
+      use-isomorphic-layout-effect: 1.1.2_k4en7uapxoluuejoeg6o3ic2aa
     transitivePeerDependencies:
       - '@types/react'
     dev: false
@@ -812,7 +812,7 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@radix-ui/react-dialog/1.0.3_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@radix-ui/react-dialog/1.0.3_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-owNhq36kNPqC2/a+zJRioPg6HHnTn5B/sh/NjTY8r4W9g1L5VJlrzZIVcBr7R9Mg8iLjVmh6MGgMlfoVf/WO/A== }
     peerDependencies:
@@ -835,7 +835,7 @@ packages:
       aria-hidden: 1.2.3
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
-      react-remove-scroll: 2.5.5_pmekkgnqduwlme35zpnqhenc34
+      react-remove-scroll: 2.5.5_k4en7uapxoluuejoeg6o3ic2aa
     transitivePeerDependencies:
       - '@types/react'
     dev: false
@@ -867,7 +867,7 @@ packages:
       react-dom: 18.2.0_react@18.2.0
     dev: false
 
-  /@radix-ui/react-dropdown-menu/2.0.4_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@radix-ui/react-dropdown-menu/2.0.4_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-y6AT9+MydyXcByivdK1+QpjWoKaC7MLjkS/cH1Q3keEyMvDkiY85m8o2Bi6+Z1PPUlCsMULopxagQOSfN0wahg== }
     peerDependencies:
@@ -879,7 +879,7 @@ packages:
       '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0
       '@radix-ui/react-context': 1.0.0_react@18.2.0
       '@radix-ui/react-id': 1.0.0_react@18.2.0
-      '@radix-ui/react-menu': 2.0.4_zula6vjvt3wdocc4mwcxqa6nzi
+      '@radix-ui/react-menu': 2.0.4_aen5vu2fkbnw3ssyd5drxdxkh4
       '@radix-ui/react-primitive': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-use-controllable-state': 1.0.0_react@18.2.0
       react: 18.2.0
@@ -933,7 +933,7 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@radix-ui/react-menu/2.0.4_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@radix-ui/react-menu/2.0.4_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-mzKR47tZ1t193trEqlQoJvzY4u9vYfVH16ryBrVrCAGZzkgyWnMQYEZdUkM7y8ak9mrkKtJiqB47TlEnubeOFQ== }
     peerDependencies:
@@ -950,7 +950,7 @@ packages:
       '@radix-ui/react-focus-guards': 1.0.0_react@18.2.0
       '@radix-ui/react-focus-scope': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-id': 1.0.0_react@18.2.0
-      '@radix-ui/react-popper': 1.1.1_zula6vjvt3wdocc4mwcxqa6nzi
+      '@radix-ui/react-popper': 1.1.1_aen5vu2fkbnw3ssyd5drxdxkh4
       '@radix-ui/react-portal': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-presence': 1.0.0_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-primitive': 1.0.2_biqbaboplfbrettd7655fr4n2y
@@ -960,12 +960,12 @@ packages:
       aria-hidden: 1.2.3
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
-      react-remove-scroll: 2.5.5_pmekkgnqduwlme35zpnqhenc34
+      react-remove-scroll: 2.5.5_k4en7uapxoluuejoeg6o3ic2aa
     transitivePeerDependencies:
       - '@types/react'
     dev: false
 
-  /@radix-ui/react-popover/1.0.5_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@radix-ui/react-popover/1.0.5_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-GRHZ8yD12MrN2NLobHPE8Rb5uHTxd9x372DE9PPNnBjpczAQHcZ5ne0KXG4xpf+RDdXSzdLv9ym6mYJCDTaUZg== }
     peerDependencies:
@@ -980,7 +980,7 @@ packages:
       '@radix-ui/react-focus-guards': 1.0.0_react@18.2.0
       '@radix-ui/react-focus-scope': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-id': 1.0.0_react@18.2.0
-      '@radix-ui/react-popper': 1.1.1_zula6vjvt3wdocc4mwcxqa6nzi
+      '@radix-ui/react-popper': 1.1.1_aen5vu2fkbnw3ssyd5drxdxkh4
       '@radix-ui/react-portal': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-presence': 1.0.0_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-primitive': 1.0.2_biqbaboplfbrettd7655fr4n2y
@@ -989,12 +989,12 @@ packages:
       aria-hidden: 1.2.3
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
-      react-remove-scroll: 2.5.5_pmekkgnqduwlme35zpnqhenc34
+      react-remove-scroll: 2.5.5_k4en7uapxoluuejoeg6o3ic2aa
     transitivePeerDependencies:
       - '@types/react'
     dev: false
 
-  /@radix-ui/react-popper/1.1.1_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@radix-ui/react-popper/1.1.1_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-keYDcdMPNMjSC8zTsZ8wezUMiWM9Yj14wtF3s0PTIs9srnEPC9Kt2Gny1T3T81mmSeyDjZxsD9N5WCwNNb712w== }
     peerDependencies:
@@ -1002,7 +1002,7 @@ packages:
       react-dom: ^16.8 || ^17.0 || ^18.0
     dependencies:
       '@babel/runtime': 7.21.0
-      '@floating-ui/react-dom': 0.7.2_zula6vjvt3wdocc4mwcxqa6nzi
+      '@floating-ui/react-dom': 0.7.2_aen5vu2fkbnw3ssyd5drxdxkh4
       '@radix-ui/react-arrow': 1.0.2_biqbaboplfbrettd7655fr4n2y
       '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0
       '@radix-ui/react-context': 1.0.0_react@18.2.0
@@ -1295,6 +1295,25 @@ packages:
       { integrity: sha512-sm+QncWaPmM73IPwFlmWSKPqjdTXZeFf/7aEmWh00z7yl2FjqophPt0dE1EHW9P1giMC5rMviv7OUbSDmWzXXA== }
     dev: false
 
+  /@tanstack/react-query/4.28.0_biqbaboplfbrettd7655fr4n2y:
+    resolution:
+      { integrity: sha512-8cGBV5300RHlvYdS4ea+G1JcZIt5CIuprXYFnsWggkmGoC0b5JaqG0fIX3qwDL9PTNkKvG76NGThIWbpXivMrQ== }
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-native: '*'
+    peerDependenciesMeta:
+      react-dom:
+        optional: true
+      react-native:
+        optional: true
+    dependencies:
+      '@tanstack/query-core': 4.27.0
+      react: 18.2.0
+      react-dom: 18.2.0_react@18.2.0
+      use-sync-external-store: 1.2.0_react@18.2.0
+    dev: false
+
   /@tanstack/react-virtual/3.0.0-beta.54_react@18.2.0:
     resolution:
       { integrity: sha512-D1mDMf4UPbrtHRZZriCly5bXTBMhylslm4dhcHqTtDJ6brQcgGmk8YD9JdWBGWfGSWPKoh2x1H3e7eh+hgPXtQ== }
@@ -1423,7 +1442,7 @@ packages:
       '@tauri-apps/cli-win32-x64-msvc': 1.2.3
     dev: true
 
-  /@trivago/prettier-plugin-sort-imports/4.1.1_prettier@2.8.6:
+  /@trivago/prettier-plugin-sort-imports/4.1.1_prettier@2.8.7:
     resolution:
       { integrity: sha512-dQ2r2uzNr1x6pJsuh/8x0IRA3CBUB+pWEW3J/7N98axqt7SQSm+2fy0FLNXvXGg77xEDC7KHxJlHfLYyi7PDcw== }
     peerDependencies:
@@ -1439,7 +1458,7 @@ packages:
       '@babel/types': 7.17.0
       javascript-natural-sort: 0.7.1
       lodash: 4.17.21
-      prettier: 2.8.6
+      prettier: 2.8.7
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -1479,9 +1498,9 @@ packages:
       { integrity: sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA== }
     dev: false
 
-  /@types/node/18.15.5:
+  /@types/node/18.15.9:
     resolution:
-      { integrity: sha512-Ark2WDjjZO7GmvsyFFf81MXuGTA/d6oP38anyxWOL6EREyBKAxKoFHwBhaZxCfLRLpO8JgVXwqOwSwa7jRcjew== }
+      { integrity: sha512-dUxhiNzBLr6IqlZXz6e/rN2YQXlFgOei/Dxy+e3cyXTJ4txSUbGT2/fmnD6zd/75jDMeW5bDee+YXxlFKHoV0A== }
 
   /@types/parse5/6.0.3:
     resolution:
@@ -1506,12 +1525,12 @@ packages:
     resolution:
       { integrity: sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw== }
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
     dev: true
 
-  /@types/react/18.0.28:
+  /@types/react/18.0.29:
     resolution:
-      { integrity: sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew== }
+      { integrity: sha512-wXHktgUABxplw1+UnljseDq4+uztQyp2tlWZRIxHlpchsCFqiYkvaDS8JR7eKOQm8wziTH/el5qL7D6gYNkYcw== }
     dependencies:
       '@types/prop-types': 15.7.5
       '@types/scheduler': 0.16.3
@@ -1535,7 +1554,7 @@ packages:
     resolution:
       { integrity: sha512-NbsqiNX9CnEfC1Z0Vf4mE1SgAJ07JnRYcNex7AJ9zAVzmiGHmjKFEk7O4TJIsgv2B1sLEb6owKFZrACwdYngsQ== }
     dependencies:
-      '@types/node': 18.15.5
+      '@types/node': 18.15.9
     dev: false
 
   /@typescript-eslint/eslint-plugin/5.56.0_iskin7c6dxqunwflhstekcjqmq:
@@ -1550,7 +1569,7 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@eslint-community/regexpp': 4.4.0
+      '@eslint-community/regexpp': 4.4.1
       '@typescript-eslint/parser': 5.56.0_vgl77cfdswitgr47lm5swmv43m
       '@typescript-eslint/scope-manager': 5.56.0
       '@typescript-eslint/type-utils': 5.56.0_vgl77cfdswitgr47lm5swmv43m
@@ -1653,7 +1672,7 @@ packages:
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
     dependencies:
-      '@eslint-community/eslint-utils': 4.3.0_eslint@8.36.0
+      '@eslint-community/eslint-utils': 4.4.0_eslint@8.36.0
       '@types/json-schema': 7.0.11
       '@types/semver': 7.3.13
       '@typescript-eslint/scope-manager': 5.56.0
@@ -1681,7 +1700,7 @@ packages:
       { integrity: sha512-3tt7FVSbjtBCNBhffy7k26rpnEmk8GQj9QkTGZBIfpHU7mG3Buryt69u6xooYM7/gmv7GIqD4QxxIauIp2HHKg== }
     dev: false
 
-  /@uiw/react-markdown-preview/4.1.10_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@uiw/react-markdown-preview/4.1.10_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-PtjKQi1BhejVfFp/DpMCQ1QlugkjzPGXIDH/oYnpvoqdDvXB8yjfQYLCFFqLPyywXV3BVk0HkAgMGOjUHp08pw== }
     peerDependencies:
@@ -1692,7 +1711,7 @@ packages:
       '@uiw/copy-to-clipboard': 1.0.12
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
-      react-markdown: 8.0.6_pmekkgnqduwlme35zpnqhenc34
+      react-markdown: 8.0.6_k4en7uapxoluuejoeg6o3ic2aa
       rehype-attr: 2.1.4
       rehype-autolink-headings: 6.1.1
       rehype-ignore: 1.0.4
@@ -1707,7 +1726,7 @@ packages:
       - supports-color
     dev: false
 
-  /@uiw/react-md-editor/3.20.5_zula6vjvt3wdocc4mwcxqa6nzi:
+  /@uiw/react-md-editor/3.20.5_aen5vu2fkbnw3ssyd5drxdxkh4:
     resolution:
       { integrity: sha512-aJ5TFy6vIZ9XNW6hQugCGXg8xVR0YagOAHt5fCXh2OoAQ6agxZwWBERCiHnFRNfcgBMBKatTnSQV8Pe0XcpOGw== }
     peerDependencies:
@@ -1715,7 +1734,7 @@ packages:
       react-dom: '>=16.8.0'
     dependencies:
       '@babel/runtime': 7.21.0
-      '@uiw/react-markdown-preview': 4.1.10_zula6vjvt3wdocc4mwcxqa6nzi
+      '@uiw/react-markdown-preview': 4.1.10_aen5vu2fkbnw3ssyd5drxdxkh4
       react: 18.2.0
       react-dom: 18.2.0_react@18.2.0
       rehype: 12.0.1
@@ -2068,7 +2087,7 @@ packages:
     hasBin: true
     dependencies:
       caniuse-lite: 1.0.30001469
-      electron-to-chromium: 1.4.337
+      electron-to-chromium: 1.4.340
       node-releases: 2.0.10
       update-browserslist-db: 1.0.10_browserslist@4.21.5
 
@@ -2488,9 +2507,9 @@ packages:
       { integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA== }
     dev: true
 
-  /electron-to-chromium/1.4.337:
+  /electron-to-chromium/1.4.340:
     resolution:
-      { integrity: sha512-W8gdzXG86mVPoc56eM8YA+QiLxaAxJ8cmDjxZgfhLLWVvZQxyA918w5tX2JEWApZta45T1/sYcmFHTsTOUE3nw== }
+      { integrity: sha512-zx8hqumOqltKsv/MF50yvdAlPF9S/4PXbyfzJS6ZGhbddGkRegdwImmfSVqCkEziYzrIGZ/TlrzBND4FysfkDg== }
 
   /emoji-regex/8.0.0:
     resolution:
@@ -2868,8 +2887,8 @@ packages:
     engines: { node: ^12.22.0 || ^14.17.0 || >=16.0.0 }
     hasBin: true
     dependencies:
-      '@eslint-community/eslint-utils': 4.3.0_eslint@8.36.0
+      '@eslint-community/eslint-utils': 4.4.0_eslint@8.36.0
-      '@eslint-community/regexpp': 4.4.0
+      '@eslint-community/regexpp': 4.4.1
       '@eslint/eslintrc': 2.0.1
       '@eslint/js': 8.36.0
       '@humanwhocodes/config-array': 0.11.8
@@ -4720,7 +4739,7 @@ packages:
       '@scure/base': 1.1.1
       '@scure/bip32': 1.2.0
       '@scure/bip39': 1.2.0
-      prettier: 2.8.6
+      prettier: 2.8.7
     dev: false
 
   /not/0.1.0:
@@ -5114,7 +5133,7 @@ packages:
     engines: { node: '>= 0.8.0' }
     dev: true
 
-  /prettier-plugin-tailwindcss/0.2.5_c5px7p3j4kcmt2ngqd44w4h7we:
+  /prettier-plugin-tailwindcss/0.2.5_yk5p2qt6yzw3zyyilt4azle7eu:
     resolution:
       { integrity: sha512-vZ/iKieyCx0WTxHbkf5E1rBlv/ybFk8WTT4hL5W2jlVxum2Zbe0jMUpuQdDrpa4z2vnPiJ5KIWCqL/kd16fKYg== }
     engines: { node: '>=12.17.0' }
@@ -5167,13 +5186,13 @@ packages:
       prettier-plugin-twig-melody:
         optional: true
     dependencies:
-      '@trivago/prettier-plugin-sort-imports': 4.1.1_prettier@2.8.6
+      '@trivago/prettier-plugin-sort-imports': 4.1.1_prettier@2.8.7
-      prettier: 2.8.6
+      prettier: 2.8.7
     dev: true
 
-  /prettier/2.8.6:
+  /prettier/2.8.7:
     resolution:
-      { integrity: sha512-mtuzdiBbHwPEgl7NxWlqOkithPyp4VN93V7VeHVWBF+ad3I5avc0RVDT4oImXQy9H/AqxA2NSQH8pSxHW6FYbQ== }
+      { integrity: sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw== }
     engines: { node: '>=10.13.0' }
     hasBin: true
 
@@ -5222,9 +5241,9 @@ packages:
       { integrity: sha512-xTYf9zFim2pEif/Fw16dBiXpe0hoy5PxcD8+OwBnTtNLfIm3g6WxhKNurY+6OmdH1u6Ta/W/Vl6vjbYP1MFnDg== }
     dev: false
 
-  /react-hook-form/7.43.7_react@18.2.0:
+  /react-hook-form/7.43.8_react@18.2.0:
     resolution:
-      { integrity: sha512-38yehQkQQ5uufaPKFScs7jhLE8n3+LG9H/BZfFAiBL2+7piDmw/BrdNJV4irzMaPnWZGhmGLHVICHXNVGIuXZg== }
+      { integrity: sha512-BQm+Ge5KjTk1EchDBRhdP8Pkb7MArO2jFF+UWYr3rtvh6197khi22uloLqlWeuY02ItlCzPunPsFt1/q9wQKnw== }
     engines: { node: '>=12.22.0' }
     peerDependencies:
       react: ^16.8.0 || ^17 || ^18
@@ -5241,7 +5260,7 @@ packages:
       { integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w== }
     dev: false
 
-  /react-markdown/8.0.6_pmekkgnqduwlme35zpnqhenc34:
+  /react-markdown/8.0.6_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-KgPWsYgHuftdx510wwIzpwf+5js/iHqBR+fzxefv8Khk3mFbnioF1bmL2idHN3ler0LMQmICKeDrWnZrX9mtbQ== }
     peerDependencies:
@@ -5250,7 +5269,7 @@ packages:
     dependencies:
       '@types/hast': 2.3.4
       '@types/prop-types': 15.7.5
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       '@types/unist': 2.0.6
       comma-separated-tokens: 2.0.3
       hast-util-whitespace: 2.0.1
@@ -5283,7 +5302,7 @@ packages:
       react-fast-compare: 3.2.1
     dev: false
 
-  /react-remove-scroll-bar/2.3.4_pmekkgnqduwlme35zpnqhenc34:
+  /react-remove-scroll-bar/2.3.4_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-63C4YQBUt0m6ALadE9XV56hV8BgJWDmmTPY758iIJjfQKt2nYwoUrPk0LXRXcB/yIj82T1/Ixfdpdk68LwIB0A== }
     engines: { node: '>=10' }
@@ -5294,13 +5313,13 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       react: 18.2.0
-      react-style-singleton: 2.2.1_pmekkgnqduwlme35zpnqhenc34
+      react-style-singleton: 2.2.1_k4en7uapxoluuejoeg6o3ic2aa
       tslib: 2.5.0
     dev: false
 
-  /react-remove-scroll/2.5.5_pmekkgnqduwlme35zpnqhenc34:
+  /react-remove-scroll/2.5.5_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-ImKhrzJJsyXJfBZ4bzu8Bwpka14c/fQt0k+cyFp/PBhTfyDnU5hjOtM4AG/0AMyy8oKzOTR0lDgJIM7pYXI0kw== }
     engines: { node: '>=10' }
@@ -5311,13 +5330,13 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       react: 18.2.0
-      react-remove-scroll-bar: 2.3.4_pmekkgnqduwlme35zpnqhenc34
+      react-remove-scroll-bar: 2.3.4_k4en7uapxoluuejoeg6o3ic2aa
-      react-style-singleton: 2.2.1_pmekkgnqduwlme35zpnqhenc34
+      react-style-singleton: 2.2.1_k4en7uapxoluuejoeg6o3ic2aa
       tslib: 2.5.0
-      use-callback-ref: 1.3.0_pmekkgnqduwlme35zpnqhenc34
+      use-callback-ref: 1.3.0_k4en7uapxoluuejoeg6o3ic2aa
-      use-sidecar: 1.1.2_pmekkgnqduwlme35zpnqhenc34
+      use-sidecar: 1.1.2_k4en7uapxoluuejoeg6o3ic2aa
     dev: false
 
   /react-string-replace/1.1.0:
@@ -5326,7 +5345,7 @@ packages:
     engines: { node: '>=0.12.0' }
     dev: false
 
-  /react-style-singleton/2.2.1_pmekkgnqduwlme35zpnqhenc34:
+  /react-style-singleton/2.2.1_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g== }
     engines: { node: '>=10' }
@@ -5337,25 +5356,13 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       get-nonce: 1.0.1
       invariant: 2.2.4
       react: 18.2.0
       tslib: 2.5.0
     dev: false
 
-  /react-virtuoso/4.1.0_biqbaboplfbrettd7655fr4n2y:
-    resolution:
-      { integrity: sha512-Vcq5WXn18PvPT55kdeGQ8BN3K95XyPe7hum8zG6Tx7g1CtUYVsQKN7fouMxBSy+XymEDB5ynGy8JWhuqyLLtPw== }
-    engines: { node: '>=10' }
-    peerDependencies:
-      react: '>=16 || >=17 || >= 18'
-      react-dom: '>=16 || >=17 || >= 18'
-    dependencies:
-      react: 18.2.0
-      react-dom: 18.2.0_react@18.2.0
-    dev: false
-
   /react/18.2.0:
     resolution:
       { integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== }
@@ -6196,7 +6203,7 @@ packages:
     dependencies:
       punycode: 2.3.0
 
-  /use-callback-ref/1.3.0_pmekkgnqduwlme35zpnqhenc34:
+  /use-callback-ref/1.3.0_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-3FT9PRuRdbB9HfXhEq35u4oZkvpJ5kuYbpqhCfmiZyReuRgpnhDlbr2ZEnnuS0RrJAPn6l23xjFg9kpDM+Ms7w== }
     engines: { node: '>=10' }
@@ -6207,12 +6214,12 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       react: 18.2.0
       tslib: 2.5.0
     dev: false
 
-  /use-isomorphic-layout-effect/1.1.2_pmekkgnqduwlme35zpnqhenc34:
+  /use-isomorphic-layout-effect/1.1.2_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA== }
     peerDependencies:
@@ -6222,11 +6229,11 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       react: 18.2.0
     dev: false
 
-  /use-sidecar/1.1.2_pmekkgnqduwlme35zpnqhenc34:
+  /use-sidecar/1.1.2_k4en7uapxoluuejoeg6o3ic2aa:
     resolution:
       { integrity: sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw== }
     engines: { node: '>=10' }
@@ -6237,12 +6244,21 @@ packages:
       '@types/react':
         optional: true
     dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.29
       detect-node-es: 1.1.0
       react: 18.2.0
       tslib: 2.5.0
     dev: false
 
+  /use-sync-external-store/1.2.0_react@18.2.0:
+    resolution:
+      { integrity: sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA== }
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /utf-8-validate/5.0.10:
     resolution:
       { integrity: sha512-Z6czzLq4u8fPOyx7TU6X3dvUZVvoJmxSQ+IcrlmagKhilxlhZgxPK6C5Jqbkw1IDUmFTM+cz9QDnnLTwDz/2gQ== }

src/components/note/base.tsx

@@ -2,6 +2,7 @@ import NoteMetadata from '@components/note/metadata';
 import { NoteParent } from '@components/note/parent';
 import { ImagePreview } from '@components/note/preview/image';
 import { VideoPreview } from '@components/note/preview/video';
+import { NoteRepost } from '@components/note/repost';
 import { UserExtend } from '@components/user/extend';
 import { UserMention } from '@components/user/mention';
 
@@ -11,8 +12,6 @@ import { memo, useMemo } from 'react';
 import ReactPlayer from 'react-player/lazy';
 import reactStringReplace from 'react-string-replace';
 
-import { NoteRepost } from './repost';
-
 export const NoteBase = memo(function NoteBase({ event }: { event: any }) {
   const router = useRouter();
 

src/components/note/parent.tsx

@@ -1,6 +1,7 @@
 import NoteMetadata from '@components/note/metadata';
 import { ImagePreview } from '@components/note/preview/image';
 import { VideoPreview } from '@components/note/preview/video';
+import { NoteRepost } from '@components/note/repost';
 import { RelayContext } from '@components/relaysProvider';
 import { UserExtend } from '@components/user/extend';
 import { UserMention } from '@components/user/mention';
@@ -89,7 +90,7 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) {
             return <UserMention key={match + i} pubkey={tags[match][1]} />;
           } else if (tags[match][0] === 'e') {
             // note-mentions
-            return <p key={match + i}>note-{tags[match][1]}</p>;
+            return <NoteRepost key={match + i} id={tags[match][1]} />;
           } else {
             return;
           }

src/pages/_app.tsx

@@ -2,7 +2,10 @@ import RelayProvider from '@components/relaysProvider';
 
 import { relaysAtom } from '@stores/relays';
 
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { Provider, useAtomValue } from 'jotai';
+import { queryClientAtom } from 'jotai-tanstack-query';
+import { useHydrateAtoms } from 'jotai/react/utils';
 import type { NextPage } from 'next';
 import type { AppProps } from 'next/app';
 import { ReactElement, ReactNode } from 'react';
@@ -18,14 +21,25 @@ type AppPropsWithLayout = AppProps & {
   Component: NextPageWithLayout;
 };
 
+const queryClient = new QueryClient();
+
+const HydrateAtoms = ({ children }) => {
+  useHydrateAtoms([[queryClientAtom, queryClient]]);
+  return children;
+};
+
 export default function MyApp({ Component, pageProps }: AppPropsWithLayout) {
   // Use the layout defined at the page level, if available
   const getLayout = Component.getLayout ?? ((page) => page);
   const relays = useAtomValue(relaysAtom);
 
   return (
-    <Provider>
+    <QueryClientProvider client={queryClient}>
-      <RelayProvider relays={relays}>{getLayout(<Component {...pageProps} />)}</RelayProvider>
+      <Provider>
-    </Provider>
+        <HydrateAtoms>
+          <RelayProvider relays={relays}>{getLayout(<Component {...pageProps} />)}</RelayProvider>
+        </HydrateAtoms>
+      </Provider>
+    </QueryClientProvider>
   );
 }

src/pages/newsfeed/following.tsx

@@ -3,17 +3,16 @@ import WithSidebarLayout from '@layouts/withSidebar';
 
 import { NoteBase } from '@components/note/base';
 import FormBasic from '@components/note/form/basic';
+import { Placeholder } from '@components/note/placeholder';
 
-import { hasNewerNoteAtom, notesAtom } from '@stores/note';
+import { notesAtom } from '@stores/note';
 
 import { useVirtualizer } from '@tanstack/react-virtual';
 import { useAtom } from 'jotai';
-import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useRef } from 'react';
+import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, Suspense, useRef } from 'react';
 
 export default function Page() {
   const [data]: any = useAtom(notesAtom);
-  const [hasNewerNote, setHasNewerNote] = useAtom(hasNewerNoteAtom);
-
   const parentRef = useRef(null);
 
   const virtualizer = useVirtualizer({
@@ -25,40 +24,26 @@ export default function Page() {
   });
   const items = virtualizer.getVirtualItems();
 
-  const loadNewest = () => {
-    console.log('load');
-  };
-
   return (
     <div ref={parentRef} className="scrollbar-hide h-full w-full overflow-y-auto" style={{ contain: 'strict' }}>
-      <div>
+      <div className="relative">
-        {hasNewerNote && (
-          <div className="absolute top-8 left-1/2 z-50 -translate-x-1/2 transform">
-            <button
-              onClick={() => loadNewest()}
-              className="inline-flex h-8 transform items-center justify-center gap-1 rounded-full bg-fuchsia-500 px-3 text-sm shadow-lg shadow-fuchsia-900/50 active:translate-y-1"
-            >
-              <span className="text-white drop-shadow">Load newest</span>
-            </button>
-          </div>
-        )}
-      </div>
-      <div>
         <FormBasic />
       </div>
-      <div>
+      <Suspense fallback={<Placeholder />}>
-        {items.length > 0 && (
+        <div>
-          <div className="relative w-full" style={{ height: virtualizer.getTotalSize() }}>
+          {items.length > 0 && (
-            <div className="absolute top-0 left-0 w-full" style={{ transform: `translateY(${items[0].start}px)` }}>
+            <div className="relative w-full" style={{ height: virtualizer.getTotalSize() }}>
-              {items.map((virtualRow) => (
+              <div className="absolute top-0 left-0 w-full" style={{ transform: `translateY(${items[0].start}px)` }}>
-                <div key={virtualRow.key} data-index={virtualRow.index} ref={virtualizer.measureElement}>
+                {items.map((virtualRow) => (
-                  <NoteBase event={data[virtualRow.index]} />
+                  <div key={virtualRow.key} data-index={virtualRow.index} ref={virtualizer.measureElement}>
-                </div>
+                    <NoteBase event={data[virtualRow.index]} />
-              ))}
+                  </div>
+                ))}
+              </div>
             </div>
-          </div>
+          )}
-        )}
+        </div>
-      </div>
+      </Suspense>
     </div>
   );
 }

src/stores/account.tsx

@@ -1,9 +1,9 @@
 import { isSSR } from '@utils/ssr';
 import { getActiveAccount } from '@utils/storage';
 
-import { atom } from 'jotai';
+import { atomWithCache } from 'jotai-cache';
 
-export const activeAccountAtom = atom(async () => {
+export const activeAccountAtom = atomWithCache(async () => {
   const response = isSSR ? {} : await getActiveAccount();
   return response;
 });

src/stores/note.tsx

@@ -4,13 +4,18 @@ import { getAllNotes } from '@utils/storage';
 import { atom } from 'jotai';
 import { atomsWithQuery } from 'jotai-tanstack-query';
 
-// usecase: notify user that connector has receive newer note
+// notify user that connector has receive newer note
 export const hasNewerNoteAtom = atom(false);
-// usecase: query notes from database
+// query notes from database
 export const [notesAtom] = atomsWithQuery(() => ({
   queryKey: ['notes'],
   queryFn: async ({ queryKey: [] }) => {
     const res = isSSR ? [] : await getAllNotes();
     return res;
   },
+  refetchInterval: 1000000,
+  refetchOnReconnect: true,
+  refetchOnWindowFocus: true,
+  refetchOnMount: true,
+  keepPreviousData: false,
 }));

src/stores/relays.tsx

@@ -1,9 +1,9 @@
 import { isSSR } from '@utils/ssr';
 import { getAllRelays } from '@utils/storage';
 
-import { atom } from 'jotai';
+import { atomWithCache } from 'jotai-cache';
 
-export const relaysAtom = atom(async () => {
+export const relaysAtom = atomWithCache(async () => {
   const response = isSSR ? [] : await getAllRelays();
   return response;
 });