1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Add double click to reset sidebar width (#4109)

This commit is contained in:
Sebastian Malton 2021-10-22 09:10:21 -04:00 committed by GitHub
parent cd14097668
commit 8fa2adf870
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 4 deletions

View File

@ -26,7 +26,7 @@ import { observer } from "mobx-react";
import { cssNames } from "../../utils"; import { cssNames } from "../../utils";
import { ErrorBoundary } from "../error-boundary"; import { ErrorBoundary } from "../error-boundary";
import { ResizeDirection, ResizeGrowthDirection, ResizeSide, ResizingAnchor } from "../resizing-anchor"; import { ResizeDirection, ResizeGrowthDirection, ResizeSide, ResizingAnchor } from "../resizing-anchor";
import { sidebarStorage } from "./sidebar-storage"; import { defaultSidebarWidth, sidebarStorage } from "./sidebar-storage";
interface Props { interface Props {
sidebar: React.ReactNode; sidebar: React.ReactNode;
@ -46,7 +46,6 @@ export class MainLayout extends React.Component<Props> {
}; };
render() { render() {
const { onSidebarResize } = this;
const { className, footer, children, sidebar } = this.props; const { className, footer, children, sidebar } = this.props;
const { width: sidebarWidth } = sidebarStorage.get(); const { width: sidebarWidth } = sidebarStorage.get();
const style = { "--sidebar-width": `${sidebarWidth}px` } as React.CSSProperties; const style = { "--sidebar-width": `${sidebarWidth}px` } as React.CSSProperties;
@ -60,7 +59,8 @@ export class MainLayout extends React.Component<Props> {
placement={ResizeSide.TRAILING} placement={ResizeSide.TRAILING}
growthDirection={ResizeGrowthDirection.LEFT_TO_RIGHT} growthDirection={ResizeGrowthDirection.LEFT_TO_RIGHT}
getCurrentExtent={() => sidebarWidth} getCurrentExtent={() => sidebarWidth}
onDrag={onSidebarResize} onDrag={this.onSidebarResize}
onDoubleClick={() => this.onSidebarResize(defaultSidebarWidth)}
minExtent={120} minExtent={120}
maxExtent={400} maxExtent={400}
/> />

View File

@ -28,7 +28,9 @@ export interface SidebarStorageState {
} }
} }
export const defaultSidebarWidth = 200;
export const sidebarStorage = createStorage<SidebarStorageState>("sidebar", { export const sidebarStorage = createStorage<SidebarStorageState>("sidebar", {
width: 200, width: defaultSidebarWidth,
expanded: {}, expanded: {},
}); });