From bf687da24ca62cb4146aac4aa7e4482c51ca5aa4 Mon Sep 17 00:00:00 2001 From: Pionxzh Date: Fri, 13 Sep 2024 01:54:44 +0800 Subject: [PATCH] fix: handle hydration missing menu and style #258 --- src/main.tsx | 25 ++++++++++++++++++++----- vite.config.ts | 11 +++++++++++ 2 files changed, 31 insertions(+), 5 deletions(-) diff --git a/src/main.tsx b/src/main.tsx index adde464..804fa78 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -16,13 +16,14 @@ function main() { styleEl.id = 'sentinel-css' document.head.append(styleEl) - const injectionWeakMap = new WeakMap() + const injectionMap = new Map() - sentinel.on('nav', (nav) => { - if (injectionWeakMap.has(nav)) return - injectionWeakMap.set(nav, true) + const injectNavMenu = (nav: HTMLElement) => { + if (injectionMap.has(nav)) return const container = getMenuContainer() + injectionMap.set(nav, container) + const chatList = nav.querySelector(':scope > div.overflow-y-auto, :scope > div.overflow-y-hidden') if (chatList) { chatList.after(container) @@ -31,7 +32,21 @@ function main() { // fallback to the bottom of the nav nav.append(container) } - }) + } + + sentinel.on('nav', injectNavMenu) + + setInterval(() => { + injectionMap.forEach((container, nav) => { + if (!nav.isConnected) { + container.remove() + injectionMap.delete(nav) + } + }) + + const navList = Array.from(document.querySelectorAll('nav')).filter(nav => !injectionMap.has(nav)) + navList.forEach(injectNavMenu) + }, 300) // Support for share page if (isSharePage()) { diff --git a/vite.config.ts b/vite.config.ts index 38a98a9..d44b6a8 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -73,6 +73,17 @@ export default defineConfig({ ['jszip', cdn.jsdelivr('JSZip', 'dist/jszip.min.js')], ['html2canvas', cdn.jsdelivr('html2canvas', 'dist/html2canvas.min.js')], ], + cssSideEffects() { + return (e) => { + const o = document.createElement('style') + o.textContent = e + document.head.append(o) + setInterval(() => { + if (o.isConnected) return + document.head.append(o) + }, 300) + } + }, }, server: { open: true,