self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-01-02 12:47:41 +02:00
Code Issues Releases Activity

Desktop: Fixes #8194: Remove dead area at the end of the note list (#8825)

Browse Source
This commit is contained in:
CptMeetKat 2023-09-17 17:27:42 +10:00 committed by GitHub
parent 1ad83d65ab
commit a4658f0416
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/app-desktop/gui/NoteListControls/NoteListControls.tsx
View File

@ -27,7 +27,6 @@ interface Props {
notesParentType: string; notesParentType: string;
height: number; height: number;
width: number; width: number;
onContentHeightChange: (sameRow: boolean)=> void;
newNoteButtonEnabled: boolean; newNoteButtonEnabled: boolean;
newTodoButtonEnabled: boolean; newTodoButtonEnabled: boolean;
} }
@ -41,7 +40,6 @@ interface Breakpoints {
const StyledRoot = styled.div` const StyledRoot = styled.div`
box-sizing: border-box; box-sizing: border-box;
height: ${(props: any) => props.height}px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: ${(props: any) => props.theme.mainPadding}px; padding: ${(props: any) => props.theme.mainPadding}px;
@ -185,12 +183,10 @@ function NoteListControls(props: Props) {
if (breakpoint === dynamicBreakpoints.Xl) { if (breakpoint === dynamicBreakpoints.Xl) {
noteControlsRef.current.style.flexDirection = 'row'; noteControlsRef.current.style.flexDirection = 'row';
searchAndSortRef.current.style.flex = '2 1 50%'; searchAndSortRef.current.style.flex = '2 1 50%';
props.onContentHeightChange(true);
} else { } else {
noteControlsRef.current.style.flexDirection = 'column'; noteControlsRef.current.style.flexDirection = 'column';
props.onContentHeightChange(false);
} }
}, [breakpoint, dynamicBreakpoints, props.onContentHeightChange]); }, [breakpoint, dynamicBreakpoints]);
useEffect(() => { useEffect(() => {
CommandService.instance().registerRuntime('focusSearch', focusSearchRuntime(searchBarRef)); CommandService.instance().registerRuntime('focusSearch', focusSearchRuntime(searchBarRef));

16
packages/app-desktop/gui/NoteListWrapper/NoteListWrapper.tsx
View File

@ -23,28 +23,20 @@ const StyledRoot = styled.div`
export default function NoteListWrapper(props: Props) { export default function NoteListWrapper(props: Props) {
const theme = themeStyle(props.themeId); const theme = themeStyle(props.themeId);
const [controlHeight, setControlHeight] = useState(theme.topRowHeight); const [controlHeight] = useState(theme.topRowHeight);
const onContentHeightChange = (sameRow: boolean) => {
if (sameRow) {
setControlHeight(theme.topRowHeight);
} else {
setControlHeight(theme.topRowHeight * 2);
}
};
const noteListSize = useMemo(() => { const noteListSize = useMemo(() => {
return { return {
width: props.size.width, width: props.size.width,
height: props.size.height - controlHeight, height: props.size.height,
}; };
}, [props.size, controlHeight]); }, [props.size]);
// <NoteList resizableLayoutEventEmitter={props.resizableLayoutEventEmitter} size={noteListSize} visible={props.visible}/> // <NoteList resizableLayoutEventEmitter={props.resizableLayoutEventEmitter} size={noteListSize} visible={props.visible}/>
return ( return (
<StyledRoot> <StyledRoot>
<NoteListControls height={controlHeight} width={noteListSize.width} onContentHeightChange={onContentHeightChange}/> <NoteListControls height={controlHeight} width={noteListSize.width}/>
<NoteList2 resizableLayoutEventEmitter={props.resizableLayoutEventEmitter} size={noteListSize} visible={props.visible}/> <NoteList2 resizableLayoutEventEmitter={props.resizableLayoutEventEmitter} size={noteListSize} visible={props.visible}/>
</StyledRoot> </StyledRoot>
); );