From 5fec56e9b02ec8a3dbed7c99a7328edf51d41035 Mon Sep 17 00:00:00 2001 From: Innei Date: Tue, 3 Dec 2024 14:49:15 +0800 Subject: [PATCH] fix: don't inject pwa into debug html Signed-off-by: Innei --- apps/renderer/__debug_proxy.html | 8 -- apps/renderer/__debug_proxy.ts | 95 ---------------- apps/renderer/debug_proxy.html | 105 ++++++++++++++++++ .../entry-column/Items/social-media-item.tsx | 12 +- configs/tailwind-extend.css | 4 + vite.config.ts | 18 ++- 6 files changed, 131 insertions(+), 111 deletions(-) delete mode 100644 apps/renderer/__debug_proxy.html delete mode 100644 apps/renderer/__debug_proxy.ts create mode 100644 apps/renderer/debug_proxy.html diff --git a/apps/renderer/__debug_proxy.html b/apps/renderer/__debug_proxy.html deleted file mode 100644 index 147c9c40d..000000000 --- a/apps/renderer/__debug_proxy.html +++ /dev/null @@ -1,8 +0,0 @@ - - - - Debug Proxy - - - - diff --git a/apps/renderer/__debug_proxy.ts b/apps/renderer/__debug_proxy.ts deleted file mode 100644 index e1d5ef3b1..000000000 --- a/apps/renderer/__debug_proxy.ts +++ /dev/null @@ -1,95 +0,0 @@ -globalThis["__DEBUG_PROXY__"] = true - -const searchParams = new URLSearchParams(window.location.search) -const debugHost = searchParams.get("debug-host") - -const resetSessionStorage = () => { - sessionStorage.removeItem("debug-host") -} - -const resetParams = searchParams.get("reset") -if (resetParams) { - resetSessionStorage() -} - -const debugHostInSessionStorage = sessionStorage.getItem("debug-host") - -const host = debugHost || debugHostInSessionStorage || "https://localhost:2233" -if (debugHost) { - sessionStorage.setItem("debug-host", debugHost) -} - -const createRefreshRuntimeScript = ` -import RefreshRuntime from "${host}/@react-refresh"; -RefreshRuntime.injectIntoGlobalHook(window); -window.$RefreshReg$ = () => {}; -window.$RefreshSig$ = () => (type) => type; -window.__vite_plugin_react_preamble_installed__ = true; -` -const $script = document.createElement("script") -$script.innerHTML = createRefreshRuntimeScript -$script.type = "module" -document.head.append($script) - -fetch(`${host}`) - .then((res) => res.text()) - .then((html) => { - const parser = new DOMParser() - const doc = parser.parseFromString(html, "text/html") - - const scripts = doc.querySelectorAll("script") - - scripts.forEach((script) => { - script.remove() - }) - - // header meta - - const $meta = doc.head.querySelectorAll("meta") - $meta.forEach((meta) => { - document.head.append(meta) - }) - - const $style = doc.head.querySelectorAll("style") - $style.forEach((style) => { - document.head.append(style) - }) - - document.body.innerHTML = doc.body.innerHTML - - scripts.forEach((script) => { - const $script = document.createElement("script") - $script.type = "module" - $script.crossOrigin = script.crossOrigin - - if (script.src) { - $script.src = new URL( - script.src.startsWith("http") ? new URL(script.src).pathname : script.src, - host, - ).toString() - } else if (script.innerHTML) { - $script.innerHTML = script.innerHTML - } else { - return - } - - document.body.append($script) - }) - }) - -const injectScript = (apiUrl: string) => { - const upstreamOrigin = window.location.origin - const template = `function injectEnv(env2) { -for (const key in env2) { -if (env2[key] === void 0) continue; -globalThis["__followEnv"] ??= {}; -globalThis["__followEnv"][key] = env2[key]; -} -} -injectEnv({"VITE_API_URL":"${apiUrl}","VITE_EXTERNAL_API_URL":"${apiUrl}","VITE_WEB_URL":"${upstreamOrigin}"})` - const $script = document.createElement("script") - $script.innerHTML = template - document.head.prepend($script) -} - -injectScript(import.meta.env.VITE_API_URL) diff --git a/apps/renderer/debug_proxy.html b/apps/renderer/debug_proxy.html new file mode 100644 index 000000000..f2ff9ae0b --- /dev/null +++ b/apps/renderer/debug_proxy.html @@ -0,0 +1,105 @@ + + + + Debug Proxy + + + + + diff --git a/apps/renderer/src/modules/entry-column/Items/social-media-item.tsx b/apps/renderer/src/modules/entry-column/Items/social-media-item.tsx index 3d94a96e4..22a10427e 100644 --- a/apps/renderer/src/modules/entry-column/Items/social-media-item.tsx +++ b/apps/renderer/src/modules/entry-column/Items/social-media-item.tsx @@ -1,6 +1,6 @@ import { useMobile } from "@follow/components/hooks/useMobile.js" import { AutoResizeHeight } from "@follow/components/ui/auto-resize-height/index.js" -import { ActionButton, MotionButtonBase } from "@follow/components/ui/button/index.js" +import { ActionButton } from "@follow/components/ui/button/index.js" import { Skeleton } from "@follow/components/ui/skeleton/index.jsx" import type { MediaModel } from "@follow/shared/hono" import { LRUCache } from "@follow/utils/lru-cache" @@ -379,15 +379,15 @@ const CollapsedSocialMediaItem: Component<{ "relative", !isShowMore && "max-h-[300px] overflow-hidden", isShowMore && "h-auto", - !isShowMore && isOverflow && "mask-b-xl", + !isShowMore && isOverflow && "mask-b-2xl", )} ref={ref} > {children} {isOverflow && !isShowMore && ( -
- +
)} diff --git a/configs/tailwind-extend.css b/configs/tailwind-extend.css index 08a9e9b6d..5a25865a3 100644 --- a/configs/tailwind-extend.css +++ b/configs/tailwind-extend.css @@ -409,6 +409,10 @@ mask-image: linear-gradient(rgb(255, 255, 255) calc(100% - 70px), rgba(255, 255, 255, 0) 100%); } + .mask-b-2xl { + mask-image: linear-gradient(rgb(255, 255, 255) calc(100% - 90px), rgba(255, 255, 255, 0) 100%); + } + .mask-horizontal { mask-image: linear-gradient( 90deg, diff --git a/vite.config.ts b/vite.config.ts index c38b1f650..2a0e4732e 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,3 +1,4 @@ +import { copyFileSync, existsSync } from "node:fs" import { resolve } from "node:path" import { fileURLToPath } from "node:url" @@ -5,7 +6,7 @@ import legacy from "@vitejs/plugin-legacy" import { minify as htmlMinify } from "html-minifier-terser" import { cyan, dim, green } from "kolorist" import { parseHTML } from "linkedom" -import type { PluginOption, ViteDevServer } from "vite" +import type { PluginOption, ResolvedConfig, ViteDevServer } from "vite" import { defineConfig, loadEnv } from "vite" import { analyzer } from "vite-bundle-analyzer" import mkcert from "vite-plugin-mkcert" @@ -57,7 +58,6 @@ export default ({ mode }) => { rollupOptions: { input: { main: resolve(ROOT, "/index.html"), - __debug_proxy: resolve(ROOT, "/__debug_proxy.html"), }, }, }, @@ -134,6 +134,7 @@ export default ({ mode }) => { globPatterns: [ "**/*.{js,json,css,html,txt,svg,png,ico,webp,woff,woff2,ttf,eot,otf,wasm}", ], + manifestTransforms: [ (manifest) => { return { @@ -288,9 +289,22 @@ function checkBrowserSupport() { } const htmlPlugin: (env: any) => PluginOption = () => { + let config: ResolvedConfig return { name: "html-transform", + configResolved(resolvedConfig) { + config = resolvedConfig + }, enforce: "post", + closeBundle() { + const { root } = config + const dist = config.build.outDir + const debugProxyHtml = resolve(root, "debug_proxy.html") + + if (existsSync(debugProxyHtml)) { + copyFileSync(debugProxyHtml, resolve(dist, "__debug_proxy.html")) + } + }, transformIndexHtml(html) { return htmlMinify( html.replace(