v1.5-beta.1

app/User.php

@@ -135,7 +135,7 @@ class User extends Authenticatable
      */
     public function favourites()
     {
-        return $this->belongsToMany(FileManagerFolder::class, 'favourite_folder', 'user_id', 'folder_unique_id', 'id', 'unique_id')->select(['unique_id', 'name', 'type']);
+        return $this->belongsToMany(FileManagerFolder::class, 'favourite_folder', 'user_id', 'folder_unique_id', 'id', 'unique_id')->with('shared:token,id,item_id,permission,protected');
     }
 
     /**

config/app.php

@@ -80,7 +80,7 @@ return [
     |
     */
 
-    'locale' => 'en',
+    'locale' => 'sk',
 
     /*
     |--------------------------------------------------------------------------

config/vuefilemanager.php

@@ -17,5 +17,5 @@ return [
     'limit_storage_by_capacity' => true,
 
     // Define user storage capacity in MB. E.g. value 2000 is 2.00GB
-    'user_storage_capacity' => 300,
+    'user_storage_capacity' => 150,
 ];

resources/js/components/FilesView/DesktopToolbar.vue

@@ -43,14 +43,14 @@
                     <ToolbarButton
                             source="move"
                             :class="{'is-inactive': canMoveInView}"
-                            action="Move"
+                            :action="$t('actions.move')"
                             @click.native="moveItem"
                     />
                     <ToolbarButton
                             v-if="! $isThisLocation(['public'])"
                             source="share"
                             :class="{'is-inactive': canShareInView}"
-                            action="Share"
+                            :action="$t('actions.share')"
                             @click.native="shareItem"
                     />
                     <ToolbarButton

resources/js/components/FilesView/EmptyPage.vue

@@ -14,7 +14,7 @@
 
             <!--Trash empty message-->
             <div class="text-content" v-if="$isThisLocation(['participant_uploads']) && ! isLoading">
-                <h1 class="title">You don't have any uploads from other users.</h1>
+                <h1 class="title">{{ $t('messages.nothing_from_participants') }}</h1>
             </div>
 
             <!--Base file browser empty message-->

resources/js/components/Others/MobileNavigation.vue

@@ -42,32 +42,32 @@
                 navigation: [
                     {
                         icon: 'hard-drive',
-                        title: 'Files',
+                        title: this.$t('menu.files'),
                         routeName: 'Files',
                     },
                     {
                         icon: 'latest',
-                        title: 'Recent Uploads',
+                        title: this.$t('menu.latest'),
                         routeName: 'Files',
                     },
                     {
                         icon: 'share',
-                        title: 'Shared Files',
+                        title: this.$t('menu.shared'),
                         routeName: 'SharedFiles',
                     },
                     {
                         icon: 'trash',
-                        title: 'Trash',
+                        title: this.$t('menu.trash'),
                         routeName: 'Trash',
                     },
                     {
                         icon: 'settings',
-                        title: 'Settings',
+                        title: this.$t('menu.settings'),
                         routeName: 'MobileSettings',
                     },
                     {
                         icon: 'power',
-                        title: 'Log Out',
+                        title: this.$t('menu.logout'),
                         routeName: 'LogOut',
                     },
                 ]

resources/js/components/Others/StorageitemDetail.vue

@@ -4,6 +4,7 @@
             <div class="icon">
                 <image-icon v-if="type == 'images'" size="23"></image-icon>
                 <video-icon v-if="type == 'videos'" size="23"></video-icon>
+                <music-icon v-if="type == 'audios'" size="23"></music-icon>
                 <file-text-icon v-if="type == 'documents'" size="23"></file-text-icon>
                 <file-icon v-if="type == 'others'" size="23"></file-icon>
                 <hard-drive-icon v-if="type == 'disk'" size="23"></hard-drive-icon>
@@ -19,7 +20,7 @@
 
 <script>
     import ProgressBar from '@/components/FilesView/ProgressBar'
-    import { ImageIcon, VideoIcon, FileTextIcon, FileIcon, HardDriveIcon } from 'vue-feather-icons'
+    import { ImageIcon, VideoIcon, FileTextIcon, FileIcon, HardDriveIcon, MusicIcon } from 'vue-feather-icons'
 
     export default {
         name: 'StorageItemDetail',
@@ -28,6 +29,7 @@
             HardDriveIcon,
             FileTextIcon,
             ProgressBar,
+            MusicIcon,
             VideoIcon,
             ImageIcon,
             FileIcon,
@@ -93,6 +95,23 @@
             }
         }
 
+        &.audios {
+
+            .icon {
+
+                path, line, polyline, rect, circle, polygon {
+                    stroke: $pink;
+                }
+            }
+
+            .storage-progress {
+
+                /deep/ span {
+                    background: $pink;
+                }
+            }
+        }
+
         &.documents {
 
             .icon {

resources/js/components/Sidebar/StorageSize.vue

@@ -1,89 +0,0 @@
-<template>
-    <div class="storage-size" v-if="app">
-        <div class="storage-info">
-            <span class="title">{{ $t('storage.title') }}</span>
-            <span class="size">{{ $t('storage.used', {used: app.storage.used, capacity: app.storage.capacity}) }}</span>
-        </div>
-        <ProgressBar :progress="app.storage.percentage" :class="{'is-exceeded': app.storage.percentage > 100}"/>
-    </div>
-</template>
-
-<script>
-    import ProgressBar from '@/components/FilesView/ProgressBar'
-    import { mapGetters } from 'vuex'
-
-    export default {
-        name: 'StorageSize',
-        components: {
-            ProgressBar,
-        },
-        computed: {
-            ...mapGetters(['app']),
-        },
-    }
-</script>
-
-<style scoped lang="scss">
-    @import '@assets/vue-file-manager/_variables';
-    @import '@assets/vue-file-manager/_mixins';
-
-    .storage-size {
-        position: absolute;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        margin: 15px;
-        border-radius: 8px;
-
-        .storage-info {
-            display: flex;
-            flex-wrap: nowrap;
-            align-items: center;
-
-            span {
-                width: 100%;
-                white-space: nowrap;
-            }
-
-            .title {
-                @include font-size(14);
-                font-weight: 700;
-                color: $text;
-            }
-
-            .size {
-                @include font-size(12);
-                text-align: right;
-                color: $text-muted;
-            }
-        }
-    }
-
-    .progress-bar {
-
-        &.is-exceeded /deep/ span {
-            background: $danger;
-        }
-    }
-
-    @media only screen and (max-width: 690px) {
-
-        .storage-size {
-            position: relative;
-            margin-bottom: 0;
-
-            .size {
-                @include font-size(10);
-            }
-        }
-    }
-
-    @media (prefers-color-scheme: dark) {
-        .storage-size {
-
-            .storage-info .title {
-                color: $dark_mode_text_primary;
-            }
-        }
-    }
-</style>

resources/js/i18n/index.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 import VueI18n from 'vue-i18n';
 
 import en from './lang/en.json'
-//import sk from './lang/sk.json'
+import sk from './lang/sk.json'
 //import cn from './lang/cn.json'
 
 Vue.use(VueI18n);
@@ -10,7 +10,7 @@ Vue.use(VueI18n);
 const i18n = new VueI18n({
     locale: config.locale,
     messages: Object.assign({
-        en
+        en, sk
     }),
 });
 

resources/js/i18n/lang/cn.json

@@ -2,8 +2,13 @@
     "routes": {
         "create_new_password": "创建新密码"
     },
+    "routes_title": {
+        "profile": "User Profile",
+        "settings_password": "Change Password",
+        "settings_storage": "Storage",
+        "settings_mobile": "Settings"
+    },
     "profile": {
-        "page_title": "用户信息",
         "store_pass": "保存您的密码",
         "change_pass": "修改您的密码",
         "profile_info": "用户信息",
@@ -78,8 +83,9 @@
         "placeholder_search_files": "搜索文件"
     },
     "messages": {
+        "nothing_from_participants": "You don't have any uploads from other users.",
         "nothing_to_preview": "没有任何信息可以预览。",
-        "nothing_was_found": "没找到任何信息"
+        "nothing_was_found": "没找到任何信息。"
     },
     "locations": {
         "shared": "已分享",
@@ -111,8 +117,15 @@
         "of": "of"
     },
     "storage": {
-        "used": "{used} 在 {capacity} 已使用",
+        "sec_capacity": "Storage Capacity",
-        "title": "存储空间"
+        "sec_details": "Capacity Used Details",
+        "total_used": "Total used {used}",
+        "total_capacity": "Your storage capacity {capacity}",
+        "images": "Images",
+        "videos": "Videos",
+        "audios": "Audios",
+        "documents": "Documents",
+        "others": "Others"
     },
     "folder": {
         "item_counts": "{count} 个文件 | {count} 个文件",
@@ -144,13 +157,28 @@
         "share": "分享",
         "move": "移动"
     },
+    "menu": {
+        "files": "Files",
+        "latest": "Recent Uploads",
+        "shared": "Shared Files",
+        "trash": "Trash",
+        "settings": "Settings",
+        "logout": "Log Out",
+        "profile": "Profile Settings",
+        "password": "Password",
+        "storage": "Storage"
+    },
     "sidebar": {
-        "shared": "已分享",
-        "locations": "位置",
         "favourites": "收藏",
         "favourites_empty": "将您想要收藏的文件夹拖动至此",
-        "latest": "最新上传",
+        "folders_empty": "Create some new folder.",
-        "latest_empty": "您并没有最新上传的记录"
+        "latest": "Recent Uploads",
+        "home": "Home",
+        "tools_title": "Tools",
+        "locations_title": "Base",
+        "navigator_title": "Navigator",
+        "my_shared": "My Shared Items",
+        "participant_uploads": "Participant Uploads"
     },
     "popup_rename": {
         "title": "修改文件/夹名称"
@@ -208,7 +236,9 @@
         "create_folder": "穿件文件夹",
         "preview": "更改预览",
         "upload": "上传文件",
-        "delete": "删除内容"
+        "delete": "删除内容",
+        "move": "Move item",
+        "share": "Share item"
     },
     "types": {
         "folder": "文件夹",

resources/js/i18n/lang/en.json

@@ -2,8 +2,13 @@
     "routes": {
         "create_new_password": "create-new-password"
     },
+    "routes_title": {
+        "profile": "User Profile",
+        "settings_password": "Change Password",
+        "settings_storage": "Storage",
+        "settings_mobile": "Settings"
+    },
     "profile": {
-        "page_title": "User Profile",
         "store_pass": "Store New Password",
         "change_pass": "Change Password",
         "profile_info": "Profile Information",
@@ -78,8 +83,9 @@
         "placeholder_search_files": "Search files or folders..."
     },
     "messages": {
+        "nothing_from_participants": "You don't have any uploads from other users.",
         "nothing_to_preview": "There is nothing to preview.",
-        "nothing_was_found": "Nothing was found"
+        "nothing_was_found": "Nothing was found."
     },
     "locations": {
         "shared": "Shared",
@@ -111,8 +117,15 @@
         "of": "of"
     },
     "storage": {
-        "used": "{used} of {capacity} Used",
+        "sec_capacity": "Storage Capacity",
-        "title": "Storage"
+        "sec_details": "Capacity Used Details",
+        "total_used": "Total used {used}",
+        "total_capacity": "Your storage capacity {capacity}",
+        "images": "Images",
+        "videos": "Videos",
+        "audios": "Audios",
+        "documents": "Documents",
+        "others": "Others"
     },
     "folder": {
         "item_counts": "{count} Item | {count} Items",
@@ -144,13 +157,28 @@
         "share": "Share",
         "move": "Move"
     },
+    "menu": {
+        "files": "Files",
+        "latest": "Recent Uploads",
+        "shared": "Shared Files",
+        "trash": "Trash",
+        "settings": "Settings",
+        "logout": "Log Out",
+        "profile": "Profile Settings",
+        "password": "Password",
+        "storage": "Storage"
+    },
     "sidebar": {
-        "shared": "Shared",
-        "locations": "Locations",
         "favourites": "Favourites",
         "favourites_empty": "Drag here your favourite folder.",
-        "latest": "Last Uploads",
+        "folders_empty": "Create some new folder.",
-        "latest_empty": "You don't have any latest uploads."
+        "latest": "Recent Uploads",
+        "home": "Home",
+        "tools_title": "Tools",
+        "locations_title": "Base",
+        "navigator_title": "Navigator",
+        "my_shared": "My Shared Items",
+        "participant_uploads": "Participant Uploads"
     },
     "popup_rename": {
         "title": "Change your item name"
@@ -208,7 +236,9 @@
         "create_folder": "Create folder",
         "preview": "Change preview",
         "upload": "Upload file",
-        "delete": "Delete item"
+        "delete": "Delete item",
+        "move": "Move item",
+        "share": "Share item"
     },
     "types": {
         "folder": "Folder",

resources/js/i18n/lang/sk.json

@@ -2,8 +2,13 @@
     "routes": {
         "create_new_password": "vytvorit-nove-heslo"
     },
+    "routes_title": {
+        "profile": "Uživateľský profil",
+        "settings_password": "Zmeniť heslo",
+        "settings_storage": "Úložisko",
+        "settings_mobile": "Nastavenia"
+    },
     "profile": {
-        "page_title": "Uživateľský profil",
         "store_pass": "Uložiť nové heslo",
         "change_pass": "Zmeniť heslo",
         "profile_info": "Profil",
@@ -78,8 +83,9 @@
         "placeholder_search_files": "Hľadajte súbory…"
     },
     "messages": {
+        "nothing_from_participants": "Zatiaľ nemáš žiadné súbory od ostatných uživateľov",
         "nothing_to_preview": "Tu nie je nič pre zobrazenie.",
-        "nothing_was_found": "Nič sa nenašlo"
+        "nothing_was_found": "Nič sa nenašlo."
     },
     "locations": {
         "shared": "Zdieľané",
@@ -111,8 +117,15 @@
         "of": "z"
     },
     "storage": {
-        "used": "{used} z {capacity} Použité",
+        "sec_capacity": "Kapacita úložiska",
-        "title": "Úložisko"
+        "sec_details": "Detail využitej kapacity",
+        "total_used": "Používané {used}",
+        "total_capacity": "Tvoja kapacita disku {capacity}",
+        "images": "Obrázky",
+        "videos": "Videá",
+        "audios": "Audio",
+        "documents": "Dokumenty",
+        "others": "Ostatné"
     },
     "folder": {
         "item_counts": "{count} Položka | {count} Položky",
@@ -144,13 +157,28 @@
         "share": "Zdieľať",
         "move": "Presunúť"
     },
-    "sidebar": {
+    "menu": {
-        "shared": "Zdieľané",
+        "files": "Súbory",
-        "locations": "Umiestnenie",
-        "favourites": "Obľúbené",
-        "favourites_empty": "Presuňte sem svoj obľúbený priečinok.",
         "latest": "Posledne nahrané",
-        "latest_empty": "Nemáte žiadne nahrané súbory"
+        "shared": "Zdieľané súbory",
+        "trash": "Kôš",
+        "settings": "Nastavenia",
+        "logout": "Odhlásiť sa",
+        "profile": "Nastavenia profilu",
+        "password": "Heslo",
+        "storage": "Úložisko"
+    },
+    "sidebar": {
+        "favourites": "Obľúbené",
+        "favourites_empty": "Presuňte sem obľúbený priečinok",
+        "folders_empty": "Vytvorte svoj prvý priečinok",
+        "latest": "Posledne nahraté",
+        "home": "Domov",
+        "tools_title": "Nástroje",
+        "locations_title": "Menu",
+        "navigator_title": "Navigátor",
+        "my_shared": "Moje zdieľané položky",
+        "participant_uploads": "Nahrávania účastníkov"
     },
     "popup_rename": {
         "title": "Zmeňte názov položky"
@@ -208,7 +236,9 @@
         "create_folder": "Vytvoriť priečinok",
         "preview": "Zmeniť náhľad",
         "upload": "Nahrať súbory",
-        "delete": "Vymazať položku"
+        "delete": "Vymazať položku",
+        "move": "Presunúť položku",
+        "share": "Zdieľať položku"
     },
     "types": {
         "folder": "Priečinok",

resources/js/router.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+import i18n from '@/i18n/index'
 
 import Index from './views/Auth/SignIn'
 import SignUp from './views/Auth/SignUp'
@@ -109,7 +110,7 @@ const router = new Router({
                     component: Profile,
                     meta: {
                         requiresAuth: true,
-                        title: 'User Profile'
+                        title: i18n.t('routes_title.profile')
                     },
                 },
                 {
@@ -118,7 +119,7 @@ const router = new Router({
                     component: Password,
                     meta: {
                         requiresAuth: true,
-                        title: 'Change Password'
+                        title: i18n.t('routes_title.settings_password')
                     },
                 },
                 {
@@ -127,7 +128,7 @@ const router = new Router({
                     component: Storage,
                     meta: {
                         requiresAuth: true,
-                        title: 'Storage'
+                        title: i18n.t('routes_title.settings_storage')
                     },
                 },
             ]
@@ -138,7 +139,7 @@ const router = new Router({
             component: MobileSettings,
             meta: {
                 requiresAuth: true,
-                title: 'Settings'
+                title: i18n.t('routes_title.settings_mobile')
             },
         }
     ],

resources/js/store/modules/fileBrowser.js

@@ -72,7 +72,7 @@ const actions = {
 
         commit('STORE_PREVIOUS_FOLDER', getters.currentFolder)
         commit('STORE_CURRENT_FOLDER', {
-            name: 'Latest',
+            name: i18n.t('sidebar.latest'),
             unique_id: undefined,
             location: 'latest',
         })
@@ -90,7 +90,7 @@ const actions = {
         commit('FLUSH_FOLDER_HISTORY')
 
         let currentFolder = {
-            name: 'Shared',
+            name: i18n.t('sidebar.my_shared'),
             location: 'shared',
             unique_id: undefined,
         }
@@ -112,7 +112,7 @@ const actions = {
 
         commit('STORE_PREVIOUS_FOLDER', getters.currentFolder)
         commit('STORE_CURRENT_FOLDER', {
-            name: 'Participant Uploads',
+            name: i18n.t('sidebar.participant_uploads'),
             unique_id: undefined,
             location: 'participant_uploads',
         })
@@ -131,7 +131,7 @@ const actions = {
         commit('FLUSH_FOLDER_HISTORY')
 
         let trash = {
-            name: 'Trash',
+            name: i18n.t('locations.trash'),
             unique_id: undefined,
             location: 'trash-root',
         }

resources/js/views/FilePages/Files.vue

@@ -4,14 +4,14 @@
         <ContentSidebar>
 
             <!--Locations-->
-            <ContentGroup title="Base">
+            <ContentGroup :title="$t('sidebar.locations_title')">
                 <div class="menu-list-wrapper">
                     <a class="menu-list-item link" :class="{'is-active': $isThisLocation(['base'])}" @click="goHome">
                         <div class="icon">
                             <home-icon size="17"></home-icon>
                         </div>
                         <div class="label">
-                            Home
+                            {{ $t('sidebar.home') }}
                         </div>
                     </a>
                     <a class="menu-list-item link" :class="{'is-active': $isThisLocation(['latest'])}"
@@ -20,16 +20,16 @@
                             <upload-cloud-icon size="17"></upload-cloud-icon>
                         </div>
                         <div class="label">
-                            Recent Uploads
+                            {{ $t('sidebar.latest') }}
                         </div>
                     </a>
                 </div>
             </ContentGroup>
 
             <!--Navigator-->
-            <ContentGroup title="Navigator" class="navigator">
+            <ContentGroup :title="$t('sidebar.navigator_title')" class="navigator">
                 <span class="empty-note navigator" v-if="app.tree.length == 0">
-                    Create some new folder.
+                    {{ $t('sidebar.folders_empty') }}
                 </span>
                 <TreeMenuNavigator class="folder-tree" :depth="0" :nodes="items" v-for="items in app.tree"
                                    :key="items.unique_id"/>

resources/js/views/FilePages/SharedFiles.vue

@@ -4,14 +4,14 @@
         <ContentSidebar>
 
             <!--Navigator-->
-            <ContentGroup title="Base">
+            <ContentGroup :title="$t('sidebar.locations_title')">
                 <div class="menu-list-wrapper">
                     <li class="menu-list-item link" :class="{'is-active': $isThisLocation(['shared'])}" @click="getShared()">
                         <div class="icon">
                             <link-icon size="17"></link-icon>
                         </div>
                         <div class="label">
-                            My Shared Items
+                            {{ $t('sidebar.my_shared') }}
                         </div>
                     </li>
                     <li class="menu-list-item link" :class="{'is-active': $isThisLocation(['participant_uploads'])}" @click="getParticipantUploads()">
@@ -19,7 +19,7 @@
                             <users-icon size="17"></users-icon>
                         </div>
                         <div class="label">
-                            Participant Uploads
+                            {{ $t('sidebar.participant_uploads') }}
                         </div>
                     </li>
                 </div>

resources/js/views/FilePages/Trash.vue

@@ -3,14 +3,14 @@
         <ContentSidebar>
 
             <!--Tools-->
-            <ContentGroup title="Tools" class="navigator">
+            <ContentGroup :title="$t('sidebar.tools_title')" class="navigator">
                 <div class="menu-list-wrapper">
                     <div class="menu-list-item link" @click="emptyTrash()">
                         <div class="icon">
                             <trash-icon size="17"></trash-icon>
                         </div>
                         <div class="label">
-                            Empty Trash
+                            {{ $t('context_menu.empty_trash') }}
                         </div>
                     </div>
                 </div>

resources/js/views/Mobile/MobileSettings.vue

@@ -26,17 +26,17 @@
                 navigation: [
                     {
                         icon: 'user',
-                        title: 'Profile Settings',
+                        title: this.$t('menu.profile'),
                         routeName: 'Profile',
                     },
                     {
                         icon: 'lock',
-                        title: 'Password',
+                        title: this.$t('menu.password'),
                         routeName: 'Password',
                     },
                     {
                         icon: 'hard-drive',
-                        title: 'Storage',
+                        title: this.$t('menu.storage'),
                         routeName: 'Storage',
                     },
                 ]

resources/js/views/Settings.vue

@@ -14,7 +14,7 @@
                             <user-icon size="17"></user-icon>
                         </div>
                         <div class="label">
-                            Profile Settings
+                            {{ $t('menu.profile') }}
                         </div>
                     </router-link>
                     <router-link :to="{name: 'Password'}" class="menu-list-item link">
@@ -22,7 +22,7 @@
                             <lock-icon size="17"></lock-icon>
                         </div>
                         <div class="label">
-                            Password
+                            {{ $t('menu.password') }}
                         </div>
                     </router-link>
                     <router-link :to="{name: 'Storage'}" class="menu-list-item link">
@@ -30,7 +30,7 @@
                             <hard-drive-icon size="17"></hard-drive-icon>
                         </div>
                         <div class="label">
-                            Storage
+                            {{ $t('menu.storage') }}
                         </div>
                     </router-link>
                 </div>

resources/js/views/User/Password.vue

@@ -2,7 +2,7 @@
     <div id="user-settings">
 
         <MobileHeader />
-        <PageHeader title="Password Settings"/>
+        <PageHeader :title="$router.currentRoute.meta.title"/>
 
         <div class="content-page">
 

resources/js/views/User/Profile.vue

@@ -2,7 +2,7 @@
     <div id="user-settings" v-if="app">
 
         <MobileHeader />
-        <PageHeader :title="$t('profile.page_title')" />
+        <PageHeader :title="$router.currentRoute.meta.title" />
 
         <div class="content-page">
             <div class="avatar-upload">

resources/js/views/User/Storage.vue

@@ -1,18 +1,19 @@
 <template>
-    <div id="user-settings" v-if="app">
+    <div id="user-settings" v-if="storageDetails && storage">
 
         <MobileHeader/>
         <PageHeader :title="$router.currentRoute.meta.title"/>
 
         <div class="content-page">
-            <SectionTitle>Storage Capacity</SectionTitle>
+            <SectionTitle>{{ $t('storage.sec_capacity') }}</SectionTitle>
-            <StorageItemDetail type="disk" :title="'Total used ' + storage.used" :percentage="storage.percentage" :used="storage.capacity"/>
+            <StorageItemDetail type="disk" :title="$t('storage.total_used', {used: storage.used})" :percentage="storage.percentage" :used="$t('storage.total_capacity', {capacity: storage.capacity})"/>
 
-            <SectionTitle>Capacity Used Details</SectionTitle>
+            <SectionTitle>{{ $t('storage.sec_details') }}</SectionTitle>
-            <StorageItemDetail type="images" title="Images" :percentage="storageDetails.images.percentage" :used="storageDetails.images.used" />
+            <StorageItemDetail type="images" :title="$t('storage.images')" :percentage="storageDetails.images.percentage" :used="storageDetails.images.used" />
-            <StorageItemDetail type="videos" title="Videos" :percentage="storageDetails.videos.percentage" :used="storageDetails.videos.used" />
+            <StorageItemDetail type="videos" :title="$t('storage.videos')" :percentage="storageDetails.videos.percentage" :used="storageDetails.videos.used" />
-            <StorageItemDetail type="documents" title="Documents" :percentage="storageDetails.documents.percentage" :used="storageDetails.documents.used" />
+            <StorageItemDetail type="audios" :title="$t('storage.audios')" :percentage="storageDetails.audios.percentage" :used="storageDetails.audios.used" />
-            <StorageItemDetail type="others" title="Others" :percentage="storageDetails.others.percentage" :used="storageDetails.others.used" />
+            <StorageItemDetail type="documents" :title="$t('storage.documents')" :percentage="storageDetails.documents.percentage" :used="storageDetails.documents.used" />
+            <StorageItemDetail type="others" :title="$t('storage.others')" :percentage="storageDetails.others.percentage" :used="storageDetails.others.used" />
         </div>
     </div>
 </template>
@@ -33,9 +34,6 @@
             MobileHeader,
             PageHeader,
         },
-        computed: {
-            ...mapGetters(['app']),
-        },
         data() {
             return {
                 storage: undefined,