diff --git a/platypush/backend/http/webapp/src/components/panels/Media/Providers/File.vue b/platypush/backend/http/webapp/src/components/panels/Media/Providers/File.vue
index f9c99cf42a..c36c89c1eb 100644
--- a/platypush/backend/http/webapp/src/components/panels/Media/Providers/File.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Media/Providers/File.vue
@@ -1,9 +1,10 @@
 <template>
   <div class="media-file-browser">
-    <Loading v-if="loading" />
+    <Loading v-if="isLoading" />
     <Browser :is-media="true"
        :filter="filter"
        :has-back="true"
+       :homepage="mediaDirs"
        @back="$emit('back')"
        @path-change="$emit('path-change', $event)"
        @play="$emit('play', $event)"
@@ -22,6 +23,40 @@ export default {
     Browser,
     Loading,
   },
+
+  data() {
+    return {
+      loading_: false,
+      mediaDirs: {},
+    };
+  },
+
+  computed: {
+    isLoading() {
+      return this.loading_ || this.loading
+    },
+  },
+
+  methods: {
+    async refresh() {
+      this.loading_ = true
+
+      try {
+        this.mediaDirs = await this.request(`${this.mediaPlugin}.get_media_dirs`)
+      } finally {
+        this.loading_ = false
+      }
+    },
+  },
+
+  async mounted() {
+    const urlPath = this.getUrlArgs().path
+    if (urlPath) {
+      await this.$emit('path-change', urlPath)
+    }
+
+    await this.refresh()
+  },
 }
 </script>
 
diff --git a/platypush/backend/http/webapp/src/components/panels/Media/Providers/Mixin.vue b/platypush/backend/http/webapp/src/components/panels/Media/Providers/Mixin.vue
index 0931983a88..fefa759d32 100644
--- a/platypush/backend/http/webapp/src/components/panels/Media/Providers/Mixin.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Media/Providers/Mixin.vue
@@ -27,6 +27,10 @@ export default {
       default: false,
     },
 
+    mediaPlugin: {
+      type: String,
+    },
+
     selectedPlaylist: {
       default: null,
     },