filters and sidebar

front/js/svelte/home/RecordRow.svelte

@@ -1,7 +1,6 @@
 <script>
     import {formatDistanceToNow, parseJSON} from "date-fns";
     import Avatar from "../account/Avatar.svelte";
-    import Status from "../records/Status.svelte";
     import {previewTitle} from "../records/Preview";
     import Preview from "../files/Preview.svelte";
     import {usernameById} from "../account/users";
@@ -19,29 +18,30 @@
 </script>
 
 <td>
+    <div class="row-name">
+    {#if record.status === "draft"}
+        <span class="status">DRAFT</span>
+    {/if}
     {#if schema.type === "files"}
-        <Preview {record} size="tiny"/>
+        <Preview {record} size="tiny" showFilename={true}/>
     {:else}
         <a
-            href="{channel.lucentUrl}/records/{record.id}"
-            class="text-decoration-none text-dark d-block"
+                href="{channel.lucentUrl}/records/{record.id}"
+
         >
             {previewTitle(channel.schemas, record, graph)}
         </a>
     {/if}
-
+    </div>
 </td>
 <td><a
-    class="text-decoration-none lx-small-text"
-    href="{channel.lucentUrl}/content/{schema.name}">{schema.label}</a
+        href="{channel.lucentUrl}/content/{schema.name}">{schema.label}</a
 >
 </td>
 
-<td class="text-center">
-    <Status status={record.status}/>
-</td>
+
 <td>
-    <div class="d-flex">
+    <div style="display: flex;gap: 14px">
         <Avatar name={usernameById(users, record._sys.updatedBy)} side={24}/>
         <div class="ms-2">
             {frieldlyUpdatedAt}