From e27af8702ab89612160b0b7686751f0133acb83e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=20=C3=96sterlund?=
 <63011648+tomosterlund@users.noreply.github.com>
Date: Sun, 20 Nov 2022 17:20:06 +0100
Subject: [PATCH] fix: prevent qalendar from resetting to default mode when
 being resized (#98)

---
 cypress/e2e/01-smoke.cy.ts | 20 +++++++++++++++++++-
 src/Qalendar.vue           |  4 +---
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/cypress/e2e/01-smoke.cy.ts b/cypress/e2e/01-smoke.cy.ts
index eb4fc959..60f08b7b 100644
--- a/cypress/e2e/01-smoke.cy.ts
+++ b/cypress/e2e/01-smoke.cy.ts
@@ -51,4 +51,22 @@ describe('Rendering the component', () => {
       expect(periodNameElement.text()).to.not.equal(periodName)
     })
   });
-})
\ No newline at end of file
+
+  it('Keeps selected mode on resizing', () => {
+    // Start in week mode
+    cy.get('.mode-is-week')
+
+    // Change to another mode
+    cy
+      // @ts-ignore
+      .changeMode('month')
+
+    cy.get('.mode-is-month')
+
+    // Resize the window
+    cy.viewport(1000, 500).wait(1000)
+
+    // Expect to still be in the same mode
+    cy.get('.mode-is-month')
+  })
+})
diff --git a/src/Qalendar.vue b/src/Qalendar.vue
index f53802be..52a5086e 100644
--- a/src/Qalendar.vue
+++ b/src/Qalendar.vue
@@ -268,9 +268,7 @@ export default defineComponent({
 
       this.calendarWidth = calendarRoot.clientWidth;
 
-      if (this.calendarWidth < dayModeBreakpoint) this.mode = 'day';
-      if (this.calendarWidth >= dayModeBreakpoint)
-        this.mode = this.config?.defaultMode || 'week';
+      if (this.calendarWidth < dayModeBreakpoint && this.mode !== 'day') this.mode = 'day';
     },
 
     setPeriodOnMount() {