1 files changed, 8 insertions, 56 deletions

diff --git a/viewer/src/views/PanelTop.vue b/viewer/src/views/PanelTop.vue
index 0efc9b6..0591f37 100644
--- a/viewer/src/views/PanelTop.vue
+++ b/viewer/src/views/PanelTop.vue
@@ -18,69 +18,21 @@
 -->
 
 <template>
-  <div v-if="isReady">
-    <b-steps
-      v-model="activeStep"
-      class="pathBreadcrumb"
-      type="is-info"
-      :has-navigation="false"
-      :animated="false"
-      @input="onStepClick"
-    >
-      <b-step-item
-        v-for="item in $galleryStore.currentItemPath"
-        :key="item.path"
-        :label="item.title"
-        :icon="getIcon(item)"
-        :to="item.path"
-      />
-    </b-steps>
+  <div class="flex">
+    <ld-command :current-item-path="$galleryStore.currentItemPath" />
+    <ld-breadcrumb
+      :current-item-path="$galleryStore.currentItemPath"
+      :search-mode="$uiStore.searchMode"
+    />
   </div>
 </template>
 
 <script lang="ts">
-import { Component, Vue, Prop, Watch } from "vue-property-decorator";
-import Gallery from "./Gallery.vue";
+import { Component, Vue } from "vue-property-decorator";
 
 @Component
-export default class PanelTop extends Vue {
-  activeStep: number = -1;
-
-  mounted() {
-    this.currentItemPathChanged();
-  }
-
-  get isReady() {
-    return this.activeStep >= 0;
-  }
-
-  @Watch("$galleryStore.currentItemPath")
-  currentItemPathChanged() {
-    this.activeStep = -1;
-    this.$nextTick(() => (this.activeStep = this.$galleryStore.currentItemPath.length - 1));
-  }
-
-  getIcon(item: Gallery.Item) {
-    switch (item.properties.type) {
-      case "picture":
-        return "image";
-      case "directory":
-        return "folder";
-    }
-  }
-
-  onStepClick(index: number) {
-    const item = this.$galleryStore.currentItemPath[index];
-    if (item) this.$router.push(item.path);
-  }
-}
+export default class PanelTop extends Vue {}
 </script>
 
 <style lang="scss">
-.pathBreadcrumb {
-  margin: 3px;
-}
-.step-title {
-  color: white;
-}
 </style>