diff --git a/kolibri/plugins/device/assets/src/views/DeviceIndex.vue b/kolibri/plugins/device/assets/src/views/DeviceIndex.vue index 6b663251d9b..d439440ee92 100644 --- a/kolibri/plugins/device/assets/src/views/DeviceIndex.vue +++ b/kolibri/plugins/device/assets/src/views/DeviceIndex.vue @@ -16,12 +16,7 @@ /> - - - + @@ -40,17 +35,14 @@ import redirectBrowser from 'kolibri.utils.redirectBrowser'; import urls from 'kolibri.urls'; import { PageNames } from '../constants'; - import PostSetupModalGroup from './PostSetupModalGroup'; + import PinAuthenticationModal from './PinAuthenticationModal'; import plugin_data from 'plugin_data'; - const welcomeDismissalKey = 'DEVICE_WELCOME_MODAL_DISMISSED'; - export default { name: 'DeviceIndex', components: { NotificationsRoot, - PostSetupModalGroup, PinAuthenticationModal, }, mixins: [commonCoreStrings], @@ -63,9 +55,6 @@ computed: { ...mapGetters(['isUserLoggedIn', 'userFacilityId']), ...mapState(['authenticateWithPin', 'grantPluginAccess']), - ...mapState({ - welcomeModalVisibleState: 'welcomeModalVisible', - }), facilities() { return this.$store.state.core.facilities; }, @@ -82,12 +71,6 @@ (plugin_data.allowGuestAccess && this.$store.getters.allowAccess) || this.isUserLoggedIn ); }, - welcomeModalVisible() { - return ( - this.welcomeModalVisibleState && - window.localStorage.getItem(welcomeDismissalKey) !== 'true' - ); - }, pageName() { return this.$route.name; }, @@ -111,10 +94,6 @@ }, }, methods: { - hideWelcomeModal() { - window.localStorage.setItem(welcomeDismissalKey, true); - this.$store.commit('SET_WELCOME_MODAL_VISIBLE', false); - }, closePinModal() { redirectBrowser(urls['kolibri:kolibri.plugins.learn:learn']()); return (this.showModal = false); diff --git a/kolibri/plugins/device/assets/src/views/ManageContentPage/index.vue b/kolibri/plugins/device/assets/src/views/ManageContentPage/index.vue index 492d54723ce..bac04b3e3be 100644 --- a/kolibri/plugins/device/assets/src/views/ManageContentPage/index.vue +++ b/kolibri/plugins/device/assets/src/views/ManageContentPage/index.vue @@ -1,6 +1,12 @@ @@ -153,6 +162,7 @@ import useUser from 'kolibri.coreVue.composables.useUser'; import samePageCheckGenerator from 'kolibri.utils.samePageCheckGenerator'; import { ContentNodeResource } from 'kolibri.resources'; + import { mapState } from 'vuex'; import SidePanelModal from '../SidePanelModal'; import SearchFiltersPanel from '../SearchFiltersPanel'; import { KolibriStudioId, PageNames } from '../../constants'; @@ -172,10 +182,13 @@ import LearningActivityChip from '../LearningActivityChip'; import SearchResultsGrid from '../SearchResultsGrid'; import LearnAppBarPage from '../LearnAppBarPage'; + import PostSetupModalGroup from '../../../../../device/assets/src/views/PostSetupModalGroup.vue'; import useChannels from './../../composables/useChannels'; import ResumableContentGrid from './ResumableContentGrid'; import OtherLibraries from './OtherLibraries'; + const welcomeDismissalKey = 'DEVICE_WELCOME_MODAL_DISMISSED'; + export default { name: 'LibraryPage', metaInfo() { @@ -193,6 +206,7 @@ SearchFiltersPanel, LearnAppBarPage, OtherLibraries, + PostSetupModalGroup, }, mixins: [commonLearnStrings, commonCoreStrings], setup(props) { @@ -388,12 +402,21 @@ }; }, computed: { + ...mapState({ + welcomeModalVisibleState: 'welcomeModalVisible', + }), allowDownloads() { return this.canAddDownloads && Boolean(this.deviceId); }, appBarTitle() { return this.learnString(this.deviceId ? 'exploreLibraries' : 'learnLabel'); }, + welcomeModalVisible() { + return ( + this.welcomeModalVisibleState && + window.localStorage.getItem(welcomeDismissalKey) !== 'true' + ); + }, channelsLabel() { if (this.deviceId) { if (this.deviceId === this.studioId) { @@ -428,6 +451,9 @@ studioId() { return KolibriStudioId; }, + areChannelsImported() { + return this.rootNodes.length > 0; + }, }, watch: { rootNodes(newNodes) { @@ -453,6 +479,10 @@ } }, methods: { + hideWelcomeModal() { + window.localStorage.setItem(welcomeDismissalKey, true); + this.$store.commit('SET_WELCOME_MODAL_VISIBLE', false); + }, findFirstEl() { this.$refs.resourcePanel.focusFirstEl(); },