xiaoxue_admin
/
Folo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: resizeable panel 

Signed-off-by: Innei <i@innei.in>
This commit is contained in:
Innei 2024-08-12 14:02:02 +08:00
parent 36a34de26c
commit e2664c2dda
No known key found for this signature in database
GPG Key ID: 0F62D33977F021F7
10 changed files with 76 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
package.json
View File

@ -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": {

49
patches/re-resizable@6.9.17.patch Normal file
View File

@ -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);

7
pnpm-lock.yaml
View File

@ -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)

2
src/main/tipc/menu.ts
View File

@ -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

3
src/renderer/src/components/ui/modal/stacked/modal.tsx
View File

@ -315,6 +315,9 @@ export const ModalInternal = memo(
}}
>
<ResizeSwitch
enable={{
bottomRight: true,
}}
onResizeStart={handleResizeEnable}
defaultSize={resizeDefaultSize}
className="flex grow flex-col"

13
src/renderer/src/modules/settings/modal/content.tsx
View File

@ -4,6 +4,7 @@ import { useCurrentModal } from "@renderer/components/ui/modal"
import { ScrollArea } from "@renderer/components/ui/scroll-area"
import { SettingsTitle } from "@renderer/modules/settings/title"
import type { FC } from "react"
import { Suspense, useDeferredValue } from "react"
import { settings } from "../constants"
import { SettingTabProvider, useSettingTab } from "./context"
@ -40,7 +41,7 @@ const Close = () => {
return (
<MotionButtonBase
className="absolute right-8 top-7 z-[99]"
className="absolute right-8 top-8 z-[99]"
onClick={dismiss}
>
<i className="i-mgc-close-cute-re" />
@ -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 (
<>
<Suspense>
<SettingsTitle loader={loader} className="relative mb-0 px-8" />
<Close />
<ScrollArea.ScrollArea
mask={false}
rootClassName="h-full grow flex-1 shrink-0 overflow-auto pl-8 pr-7 pb-8"
viewportClassName="pr-1 min-h-full [&>div]:min-h-full [&>div]:relative"
rootClassName="h-full grow flex-1 shrink-0 overflow-auto pl-8 pr-7"
viewportClassName="pr-1 min-h-full [&>div]:min-h-full [&>div]:relative pb-8"
>
<Component />
@ -81,6 +82,6 @@ const Content = () => {
!
</p>
</ScrollArea.ScrollArea>
</>
</Suspense>
)
}

7
src/renderer/src/modules/settings/modal/layout.tsx
View File

@ -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(
>
<Resizable
onResizeStart={handlePointDown}
enable={{
bottomRight: true,
}}
style={{ ...resizeableStyle, position: "static" }}
defaultSize={{
width: 800,
@ -119,7 +122,7 @@ export function SettingModalLayout(
))}
</div>
<div className="relative flex h-full flex-1 flex-col bg-theme-background pt-1">
{children}
<Suspense>{children}</Suspense>
</div>
</div>
</Resizable>

2
src/renderer/src/pages/(main)/(layer)/(subview)/layout.tsx
View File

@ -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",
)}
>
<MotionButtonBase

2
src/renderer/src/store/entry/helper.ts
View File

@ -44,7 +44,7 @@ const unread = create({
* Only call in store action
* @internal
*/
export const interval_batchMarkRead = (...args: Parameters<typeof unread.fetch>) => unread.fetch.apply(null, args)
export const internal_batchMarkRead = (...args: Parameters<typeof unread.fetch>) => unread.fetch.apply(null, args)
export const getEntryIsInView = (entryId: string) => {
const state = useEntryStore.getState()

4
src/renderer/src/store/entry/store.ts
View File

@ -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: {