- Mobile menu components refactoring

- Components name renaming

resources/js/views/Platform.vue

@@ -1,118 +1,102 @@
 <template>
     <div id="application-wrapper">
 
-        <!--Full File Preview-->
-        <FileFullPreview />
+        <!--File preview window-->
+        <FilePreview />
 
-        <!--Mobile Navigation-->
-        <MobileNavigation />
-
-        <!--Processing popup-->
+        <!--Popups-->
         <ProcessingPopup />
+        <ConfirmPopup />
 
-        <!--Confirm Popup-->
-        <Confirm />
+        <ShareCreatePopup />
+        <ShareEditPopup />
 
-        <!--Share Item popup-->
-        <ShareCreate />
-        <ShareEdit />
+        <CreateFolderPopup />
+        <RenameItemPopup />
 
-        <!--Rename folder/file item-->
-        <RenameItem />
+        <MoveItemPopup />
 
-        <!--Create folder mobile UI-->
-        <CreateFolder />
+        <!--Mobile components-->
+        <FileSortingMobile />
+        <FileMenuMobile />
 
-        <!--Move item popup-->
-        <MoveItem />
+        <MultiSelectToolbarMobile />
 
-        <!-- Mobile Menu for Multi selected items -->
-        <MobileMultiSelectMenu />
+        <!--Navigations-->
+        <MobileNavigation />
+        <SidebarNavigation />
 
-        <!--Drag UI-->
+        <!--Others-->
         <DragUI />
 
-        <!--Mobile menu for selecting view and sorting-->
-        <MobileSortingAndPreview />
-
-        <!--Mobile Menu-->
-        <MobileMenu />
-
-        <!--Navigation Sidebar-->
-        <MenuBar />
-
-        <!--File page-->
-        <keep-alive :include="['Admin', 'Users']">
-            <router-view :class="{'is-scaled-down': isScaledDown}" />
-        </keep-alive>
+        <router-view :class="{'is-scaled-down': isScaledDown}" />
     </div>
 </template>
 
 <script>
-import MobileSortingAndPreview from '@/components/FilesView/MobileSortingAndPreview'
-import MobileMultiSelectMenu from '@/components/FilesView/MobileMultiSelectMenu'
-import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
-import FileFullPreview from '@/components/FilesView/FileFullPreview'
-import MobileNavigation from '@/components/Others/MobileNavigation'
-import CreateFolder from '@/components/Others/CreateFolder'
-import MobileMenu from '@/components/FilesView/MobileMenu'
-import ShareCreate from '@/components/Others/ShareCreate'
-import Confirm from '@/components/Others/Popup/Confirm'
-import RenameItem from '@/components/Others/RenameItem'
-import ShareEdit from '@/components/Others/ShareEdit'
-import MoveItem from '@/components/Others/MoveItem'
-import DragUI from '@/components/FilesView/DragUI'
-import MenuBar from '@/components/Sidebar/MenuBar'
-import {includes} from 'lodash'
-import {mapGetters} from 'vuex'
-import {events} from '@/bus'
+    import MultiSelectToolbarMobile from '@/components/FilesView/MultiSelectToolbarMobile'
+    import FileSortingMobile from '@/components/FilesView/FileSortingMobile'
+    import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
+    import CreateFolderPopup from '@/components/Others/CreateFolderPopup'
+    import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
+    import MobileNavigation from '@/components/Others/MobileNavigation'
+    import ShareCreatePopup from '@/components/Others/ShareCreatePopup'
+    import FileMenuMobile from '@/components/FilesView/FileMenuMobile'
+    import ConfirmPopup from '@/components/Others/Popup/ConfirmPopup'
+    import RenameItemPopup from '@/components/Others/RenameItemPopup'
+    import ShareEditPopup from '@/components/Others/ShareEditPopup'
+    import MoveItemPopup from '@/components/Others/MoveItemPopup'
+    import FilePreview from '@/components/FilesView/FilePreview'
+    import DragUI from '@/components/FilesView/DragUI'
+    import {mapGetters} from 'vuex'
+    import {events} from '@/bus'
 
-export default {
-    name: 'Platform',
-    components: {
-        MobileSortingAndPreview,
-        MobileMultiSelectMenu,
-        MobileNavigation,
-        FileFullPreview,
-        ProcessingPopup,
-        CreateFolder,
-        ShareCreate,
-        MobileMenu,
-        RenameItem,
-        ShareEdit,
-        MoveItem,
-        Confirm,
-        MenuBar,
-        DragUI,
-    },
-    computed: {
-        ...mapGetters([
-            'config'
-        ]),
-    },
-    data() {
-        return {
-            isScaledDown: false
+    export default {
+        name: 'Platform',
+        components: {
+            MultiSelectToolbarMobile,
+            CreateFolderPopup,
+            FileSortingMobile,
+            SidebarNavigation,
+            MobileNavigation,
+            ShareCreatePopup,
+            ProcessingPopup,
+            RenameItemPopup,
+            ShareEditPopup,
+            FileMenuMobile,
+            MoveItemPopup,
+            ConfirmPopup,
+            FilePreview,
+            DragUI,
+        },
+        computed: {
+            ...mapGetters([
+                'config'
+            ]),
+        },
+        data() {
+            return {
+                isScaledDown: false
+            }
+        },
+        mounted() {
+            events.$on('mobile-navigation:show', () => this.isScaledDown = true)
+            events.$on('mobile-menu:show', () => this.isScaledDown = true)
+
+            events.$on('mobile-navigation:hide', () => this.isScaledDown = false)
+            events.$on('fileItem:deselect', () => this.isScaledDown = false)
+            events.$on('mobile-menu:hide', () => this.isScaledDown = false)
         }
-    },
-    mounted() {
-        events.$on('show:mobile-navigation', () => this.isScaledDown = true)
-        events.$on('hide:mobile-navigation', () => this.isScaledDown = false)
-        events.$on('mobileMenu:show', () => this.isScaledDown = true)
-        events.$on('fileItem:deselect', () => this.isScaledDown = false)
-        events.$on('mobileSortingAndPreview', state => this.isScaledDown = state)
     }
-}
 </script>
 
 <style lang="scss">
-@import '@assets/vuefilemanager/_variables';
-@import '@assets/vuefilemanager/_mixins';
+    @import '@assets/vuefilemanager/_mixins';
 
-@media only screen and (max-width: 690px) {
+    @media only screen and (max-width: 690px) {
 
-    .is-scaled-down {
-        @include transform(scale(0.95));
+        .is-scaled-down {
+            @include transform(scale(0.95));
+        }
     }
-}
 </style>