Merge pull request learningequality#11474 from KshitijThareja/11330

Replace KResponsiveWindow mixin by useKResponsiveWindow composable
AllanOXDi · Nov 13, 2023 · 0fef16d · 0fef16d
2 parents cb1a8ea + 6a0feef
commit 0fef16d
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/kolibri/plugins/setup_wizard/assets/src/views/OnboardingStepBase.vue b/kolibri/plugins/setup_wizard/assets/src/views/OnboardingStepBase.vue
@@ -144,15 +144,19 @@
   import LanguageSwitcherModal from 'kolibri.coreVue.components.LanguageSwitcherModal';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import AppError from 'kolibri-common/components/AppError';
-  import responsiveWindowMixin from 'kolibri.coreVue.mixins.responsiveWindowMixin';
+  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
   import { availableLanguages, currentLanguage } from 'kolibri.utils.i18n';
   import { FooterMessageTypes } from '../constants';
 
   export default {
     name: 'OnboardingStepBase',
     components: { AppError, CoreLogo, LanguageSwitcherModal },
     inject: ['wizardService'],
-    mixins: [commonCoreStrings, responsiveWindowMixin],
+    mixins: [commonCoreStrings],
+    setup() {
+      const { windowIsSmall } = useKResponsiveWindow();
+      return { windowIsSmall };
+    },
     props: {
       /**
        * The event sent to the state machine when the user clicks GO BACK.

diff --git a/kolibri/plugins/setup_wizard/assets/src/views/SetupWizardIndex.vue b/kolibri/plugins/setup_wizard/assets/src/views/SetupWizardIndex.vue
@@ -28,7 +28,7 @@
   import { interpret } from 'xstate';
   import { mapState } from 'vuex';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import responsiveWindowMixin from 'kolibri.coreVue.mixins.responsiveWindowMixin';
+  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
   import { checkCapability } from 'kolibri.utils.appCapabilities';
   import Lockr from 'lockr';
   import { wizardMachine } from '../machines/wizardMachine';
@@ -46,7 +46,11 @@
       LoadingPage,
       ErrorPage,
     },
-    mixins: [commonCoreStrings, responsiveWindowMixin],
+    mixins: [commonCoreStrings],
+    setup() {
+      const { windowIsLarge } = useKResponsiveWindow();
+      return { windowIsLarge };
+    },
     data() {
       return {
         service: interpret(wizardMachine),