From e2664c2dda663343fa8f53536d6b625daaba6103 Mon Sep 17 00:00:00 2001 From: Innei Date: Mon, 12 Aug 2024 14:02:02 +0800 Subject: [PATCH] fix: resizeable panel Signed-off-by: Innei --- package.json | 4 +- patches/re-resizable@6.9.17.patch | 49 +++++++++++++++++++ pnpm-lock.yaml | 7 ++- src/main/tipc/menu.ts | 2 +- .../src/components/ui/modal/stacked/modal.tsx | 3 ++ .../src/modules/settings/modal/content.tsx | 13 ++--- .../src/modules/settings/modal/layout.tsx | 7 ++- .../pages/(main)/(layer)/(subview)/layout.tsx | 2 +- src/renderer/src/store/entry/helper.ts | 2 +- src/renderer/src/store/entry/store.ts | 4 +- 10 files changed, 76 insertions(+), 17 deletions(-) create mode 100644 patches/re-resizable@6.9.17.patch diff --git a/package.json b/package.json index 4ea958581..9b1167b7a 100644 --- a/package.json +++ b/package.json @@ -146,7 +146,6 @@ "@tailwindcss/container-queries": "0.1.1", "@tailwindcss/typography": "0.5.13", "@types/lodash-es": "4.17.12", - "@types/node": "^20.14.12", "@types/react": "^18.3.3", "@types/react-dom": "^18.3.0", @@ -182,7 +181,8 @@ "sonner@1.5.0": "patches/sonner@1.5.0.patch", "hono@4.4.7": "patches/hono@4.4.7.patch", "immer@10.1.1": "patches/immer@10.1.1.patch", - "@mozilla/readability@0.5.0": "patches/@mozilla__readability@0.5.0.patch" + "@mozilla/readability@0.5.0": "patches/@mozilla__readability@0.5.0.patch", + "re-resizable@6.9.17": "patches/re-resizable@6.9.17.patch" } }, "simple-git-hooks": { diff --git a/patches/re-resizable@6.9.17.patch b/patches/re-resizable@6.9.17.patch new file mode 100644 index 000000000..be8b84d82 --- /dev/null +++ b/patches/re-resizable@6.9.17.patch @@ -0,0 +1,49 @@ +diff --git a/lib/resizer.js b/lib/resizer.js +index a051e406e92de35277d9aa335302a9216943f5b4..6214d334cf4840748e0ea192ace51129b414acc8 100644 +--- a/lib/resizer.js ++++ b/lib/resizer.js +@@ -25,32 +25,32 @@ var __assign = (this && this.__assign) || function () { + import * as React from 'react'; + var rowSizeBase = { + width: '100%', +- height: '10px', ++ height: '20px', + top: '0px', + left: '0px', + cursor: 'row-resize', + }; + var colSizeBase = { +- width: '10px', ++ width: '20px', + height: '100%', + top: '0px', + left: '0px', + cursor: 'col-resize', + }; + var edgeBase = { +- width: '20px', +- height: '20px', ++ width: '40px', ++ height: '40px', + position: 'absolute', + }; + var styles = { +- top: __assign(__assign({}, rowSizeBase), { top: '-5px' }), +- right: __assign(__assign({}, colSizeBase), { left: undefined, right: '-5px' }), +- bottom: __assign(__assign({}, rowSizeBase), { top: undefined, bottom: '-5px' }), +- left: __assign(__assign({}, colSizeBase), { left: '-5px' }), +- topRight: __assign(__assign({}, edgeBase), { right: '-10px', top: '-10px', cursor: 'ne-resize' }), +- bottomRight: __assign(__assign({}, edgeBase), { right: '-10px', bottom: '-10px', cursor: 'se-resize' }), +- bottomLeft: __assign(__assign({}, edgeBase), { left: '-10px', bottom: '-10px', cursor: 'sw-resize' }), +- topLeft: __assign(__assign({}, edgeBase), { left: '-10px', top: '-10px', cursor: 'nw-resize' }), ++ top: __assign(__assign({}, rowSizeBase), { top: '-10px' }), ++ right: __assign(__assign({}, colSizeBase), { left: undefined, right: '-10px' }), ++ bottom: __assign(__assign({}, rowSizeBase), { top: undefined, bottom: '-10px' }), ++ left: __assign(__assign({}, colSizeBase), { left: '-10px' }), ++ topRight: __assign(__assign({}, edgeBase), { right: '-20px', top: '-20px', cursor: 'ne-resize' }), ++ bottomRight: __assign(__assign({}, edgeBase), { right: '-20px', bottom: '-20px', cursor: 'se-resize' }), ++ bottomLeft: __assign(__assign({}, edgeBase), { left: '-20px', bottom: '-20px', cursor: 'sw-resize' }), ++ topLeft: __assign(__assign({}, edgeBase), { left: '-20px', top: '-20px', cursor: 'nw-resize' }), + }; + var Resizer = /** @class */ (function (_super) { + __extends(Resizer, _super); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7213ed692..2a3290036 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,6 +14,9 @@ patchedDependencies: immer@10.1.1: hash: og7mbnoo5vh43tjlw5rbmrdbvu path: patches/immer@10.1.1.patch + re-resizable@6.9.17: + hash: yitcmpfwcomg2fky72uc3lhk2i + path: patches/re-resizable@6.9.17.patch sonner@1.5.0: hash: 6s3tquyt5wnkqaogymn3mkivuq path: patches/sonner@1.5.0.patch @@ -231,7 +234,7 @@ importers: version: 4.0.1 re-resizable: specifier: 6.9.17 - version: 6.9.17(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 6.9.17(patch_hash=yitcmpfwcomg2fky72uc3lhk2i)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-error-boundary: specifier: 4.0.13 version: 4.0.13(react@18.3.1) @@ -13516,7 +13519,7 @@ snapshots: murmur-32: 0.2.0 optional: true - re-resizable@6.9.17(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + re-resizable@6.9.17(patch_hash=yitcmpfwcomg2fky72uc3lhk2i)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) diff --git a/src/main/tipc/menu.ts b/src/main/tipc/menu.ts index 185d2c429..492dc4ee0 100644 --- a/src/main/tipc/menu.ts +++ b/src/main/tipc/menu.ts @@ -7,7 +7,7 @@ import { getMainWindow } from "../window" import { t } from "./_instance" type MenuItem = ActionMenuItem | { type: "separator" } -interface ActionMenuItem { +export interface ActionMenuItem { type: "text" label: string enabled?: boolean diff --git a/src/renderer/src/components/ui/modal/stacked/modal.tsx b/src/renderer/src/components/ui/modal/stacked/modal.tsx index 5ff41dc51..8d5b1c20f 100644 --- a/src/renderer/src/components/ui/modal/stacked/modal.tsx +++ b/src/renderer/src/components/ui/modal/stacked/modal.tsx @@ -315,6 +315,9 @@ export const ModalInternal = memo( }} > { return ( @@ -49,19 +50,19 @@ const Close = () => { } const Content = () => { - const key = useSettingTab() || "general" + const key = useDeferredValue(useSettingTab() || "general") const { Component, loader } = pages[key] if (!Component) return null return ( - <> + @@ -81,6 +82,6 @@ const Content = () => { !

- + ) } diff --git a/src/renderer/src/modules/settings/modal/layout.tsx b/src/renderer/src/modules/settings/modal/layout.tsx index 400c27098..d83ee4080 100644 --- a/src/renderer/src/modules/settings/modal/layout.tsx +++ b/src/renderer/src/modules/settings/modal/layout.tsx @@ -7,7 +7,7 @@ import { cn } from "@renderer/lib/utils" import { useDragControls } from "framer-motion" import { Resizable } from "re-resizable" import type { PointerEventHandler, PropsWithChildren } from "react" -import { useCallback, useEffect, useRef } from "react" +import { Suspense, useCallback, useEffect, useRef } from "react" import { settings } from "../constants" import { SettingsSidebarTitle } from "../title" @@ -78,6 +78,9 @@ export function SettingModalLayout( >
- {children} + {children}
diff --git a/src/renderer/src/pages/(main)/(layer)/(subview)/layout.tsx b/src/renderer/src/pages/(main)/(layer)/(subview)/layout.tsx index 2d338b365..80333bab7 100644 --- a/src/renderer/src/pages/(main)/(layer)/(subview)/layout.tsx +++ b/src/renderer/src/pages/(main)/(layer)/(subview)/layout.tsx @@ -40,7 +40,7 @@ export function Component() { "absolute inset-x-0 top-0 z-10 p-4", "grid grid-cols-[1fr_auto_1fr] items-center gap-4", isTitleSticky && - "group border-b bg-white/80 backdrop-blur-xl dark:bg-black/90", + "group border-b bg-zinc-50/80 backdrop-blur-xl dark:bg-neutral-900/90", )} > ) => unread.fetch.apply(null, args) +export const internal_batchMarkRead = (...args: Parameters) => unread.fetch.apply(null, args) export const getEntryIsInView = (entryId: string) => { const state = useEntryStore.getState() diff --git a/src/renderer/src/store/entry/store.ts b/src/renderer/src/store/entry/store.ts index 7663a661c..8a09c87da 100644 --- a/src/renderer/src/store/entry/store.ts +++ b/src/renderer/src/store/entry/store.ts @@ -20,7 +20,7 @@ import { imageActions } from "../image" import { feedUnreadActions } from "../unread" import { userActions } from "../user" import { createZustandStore, doMutationAndTransaction } from "../utils/helper" -import { interval_batchMarkRead } from "./helper" +import { internal_batchMarkRead } from "./helper" import type { EntryState, FlatEntryModel } from "./types" const createState = (): EntryState => ({ @@ -325,7 +325,7 @@ class EntryActions { // Send api request async () => { if (read) { - await interval_batchMarkRead([feedId, entryId]) + await internal_batchMarkRead([feedId, entryId]) } else { await apiClient.reads.$delete({ json: {