Search results slightly prettier

assets/src/components/Search.vue

@@ -20,7 +20,11 @@
         <span v-if="search.length === 0 && commands.length === 0">{{ text }}</span>
         <ul v-else-if="search.length > 0">
           <li v-for="s in search">
-            <router-link @click.native="close" :to="'./' + s">./{{ s }}</router-link>
+            <router-link @click.native="close" :to="'./' + s.path">
+              <i v-if="s.dir" class="material-icons">folder</i>
+              <i v-else class="material-icons">insert_drive_file</i>
+              <span>./{{ s.path }}</span>
+            </router-link>
           </li>
         </ul>
 
@@ -184,10 +188,12 @@ export default {
       // In case of being a search.
       api.search(path, this.value,
         (event) => {
-          let url = event.data
-          if (url[0] === '/') url = url.substring(1)
+          let response = JSON.parse(event.data)
+          if (response.path[0] === '/') {
+            response.path = response.path.substring(1)
+          }
 
-          this.search.push(url)
+          this.search.push(response)
           this.scrollable.scrollTop = this.scrollable.scrollHeight
         },
         (event) => {

assets/src/css/header.css

@@ -177,11 +177,24 @@ header .search-button {
 
 #search.active #result i {
   color: #ccc;
+}
+
+#search.active #result > p > i {
   text-align: center;
   margin: 0 auto;
   display: table;
 }
 
+#search.active #result ul li a {
+  display: flex;
+  align-items: center;
+  padding: .3em 0;
+}
+
+#search.active #result ul li a i {
+  margin-right: .3em;
+}
+
 #search::-webkit-input-placeholder {
   color: rgba(255, 255, 255, .5);
 }

websockets.go

@@ -2,6 +2,7 @@ package filemanager
 
 import (
 	"bytes"
+	"encoding/json"
 	"mime"
 	"net/http"
 	"os"
@@ -321,7 +322,12 @@ func search(c *RequestContext, w http.ResponseWriter, r *http.Request) (int, err
 			}
 		}
 
-		return conn.WriteMessage(websocket.TextMessage, []byte(path))
+		response, _ := json.Marshal(map[string]interface{}{
+			"dir":  f.IsDir(),
+			"path": path,
+		})
+
+		return conn.WriteMessage(websocket.TextMessage, response)
 	})
 
 	if err != nil {