fix: reload layout when double clicking on panel resizer

app/assets/javascripts/directives/views/panelResizer.ts

@@ -54,7 +54,7 @@ class PanelResizerCtrl implements PanelResizerScope {
   index!: number
   minWidth!: number
   onResizeFinish!: () => ResizeFinishCallback
-  onMouseMoveEvent?: () => () => void
+  onWidthEvent?: () => () => void
   panelId!: string
   property!: PanelSide
 
@@ -104,7 +104,7 @@ class PanelResizerCtrl implements PanelResizerScope {
 
   $onDestroy() {
     (this.onResizeFinish as any) = undefined;
-    (this.onMouseMoveEvent as any) = undefined;
+    (this.onWidthEvent as any) = undefined;
     (this.control as any) = undefined;
     window.removeEventListener(WINDOW_EVENT_RESIZE, this.handleResize);
     document.removeEventListener(MouseEventType.Move, this.onMouseMove);
@@ -189,6 +189,9 @@ class PanelResizerCtrl implements PanelResizerScope {
   addDoubleClickHandler() {
     this.resizerColumn.ondblclick = () => {
       this.$timeout(() => {
+        if (this.onWidthEvent) {
+          this.onWidthEvent()();
+        }
         const preClickCollapseState = this.isCollapsed();
         if (preClickCollapseState) {
           this.setWidth(this.widthBeforeLastDblClick || this.defaultWidth);
@@ -245,9 +248,6 @@ class PanelResizerCtrl implements PanelResizerScope {
       return;
     }
     event.preventDefault();
-    if (this.onMouseMoveEvent) {
-      this.onMouseMoveEvent()();
-    }
     if (this.property && this.property === PanelSide.Left) {
       this.handleLeftEvent(event);
     } else {
@@ -256,6 +256,9 @@ class PanelResizerCtrl implements PanelResizerScope {
   }
 
   handleWidthEvent(event?: MouseEvent) {
+    if (this.onWidthEvent) {
+      this.onWidthEvent()();
+    }
     let x;
     if (event) {
       x = event!.clientX;
@@ -393,7 +396,7 @@ export class PanelResizer extends WebDirective {
       index: '=',
       minWidth: '=',
       onResizeFinish: '&',
-      onMouseMoveEvent: '&',
+      onWidthEvent: '&',
       panelId: '=',
       property: '='
     };

app/assets/javascripts/views/notes/notes-view.pug

@@ -169,6 +169,6 @@
     default-width="300"
     hoverable="true"
     on-resize-finish="self.onPanelResize"
-    on-mouse-move-event="self.onPanelMouseMoveEvent"
+    on-width-event="self.onPanelWidthEvent"
     panel-id="'notes-column'"
     )

app/assets/javascripts/views/notes/notes_view.ts

@@ -93,7 +93,7 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
     };
     this.onWindowResize = this.onWindowResize.bind(this);
     this.onPanelResize = this.onPanelResize.bind(this);
-    this.onPanelMouseMoveEvent = this.onPanelMouseMoveEvent.bind(this);
+    this.onPanelWidthEvent = this.onPanelWidthEvent.bind(this);
     window.addEventListener('resize', this.onWindowResize, true);
     this.registerKeyboardShortcuts();
     this.autorun(async () => {
@@ -134,7 +134,7 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
     window.removeEventListener('resize', this.onWindowResize, true);
     (this.onWindowResize as any) = undefined;
     (this.onPanelResize as any) = undefined;
-    (this.onPanelMouseMoveEvent as any) = undefined;
+    (this.onPanelWidthEvent as any) = undefined;
     this.newNoteKeyObserver();
     this.nextNoteKeyObserver();
     this.previousNoteKeyObserver();
@@ -649,6 +649,7 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
     __: boolean,
     isCollapsed: boolean
   ) {
+    this.appState.activeNote.reloadTagsContainerMaxWidth();
     this.application.setPreference(
       PrefKey.NotesPanelWidth,
       newWidth
@@ -659,7 +660,7 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
     );
   }
 
-  onPanelMouseMoveEvent(): void {
+  onPanelWidthEvent(): void {
     this.appState.activeNote.reloadTagsContainerMaxWidth();
   }