Remove Permissions and add Date formatting in File listing

Removed 'Permissions' column from the file listing in index.html to declutter the view. Instead of showing permissions, we now format the 'Modified' field with a human-friendly date format, to improve readability. This involves changes in 'list.js', where the field 'Permissions' is now replaced with a formatted 'Modified' date. Additionally, a 'formatDate' function is added in 'files.js' to handle the new date formatting logic.

src/index.html

@@ -59,7 +59,6 @@
         <tr class="sticky top-0 bg-red-500">
           <th>Name</th>
           <th>Size</th>
-          <th>Permissions</th>
           <th>Modified</th>
         </tr>
         </thead>
@@ -71,7 +70,6 @@
     <tr data-el="action">
       <td data-el="name"></td>
       <td data-el="size"></td>
-      <td data-el="permission"></td>
       <td data-el="modified"></td>
     </tr>
   </template>

src/parts/files.js

@@ -91,3 +91,19 @@ export const formatDirectoryItemCount = (directoryItemCount) => {
 export const openFile = async (path) => {
     return await tauriInvoke('open_file', { path });
 }
+
+export const formatDate = (timestamp) => {
+    const now = (new Date).getTime();
+    const date = new Date(parseInt(`${timestamp}000`))
+    const then = (date).getTime();
+    const diff = now - then;
+    const diffInDays = Math.floor(diff/(1000 * 60 * 60 * 24));
+
+    if (diffInDays <= 0) {
+        return `${date.getHours()}:${date.getMinutes()}`;
+    } else if (diffInDays <= 365) {
+        return `${date.toLocaleString('default', { month: 'short' })} ${date.getDate()}`
+    }
+
+    return `${date.toLocaleString('default', { month: 'short' })} ${date.getDate()} ${date.getFullYear()}`;
+}

src/parts/files/list.js

@@ -1,5 +1,5 @@
 import {getTemplate} from "../../libs/template.js";
-import {formatBytes, formatDirectoryItemCount, getEntries, openFile} from "../files.js";
+import {formatBytes, formatDate, formatDirectoryItemCount, getEntries, openFile} from "../files.js";
 import {getCurrentDir, navigate} from "../../libs/navigation.js";
 import {getOneElementOrThrow} from "../../libs/element.js";
 import {sep} from "../../libs/path.js";
@@ -42,8 +42,7 @@ export const renderListFiles = () => {
                 if (entry.is_directory) prefix = sep;
                 return `${prefix}${value}`;
             });
-            applyValue(entry, itemTemplate, 'permission')
-            applyValue(entry, itemTemplate, 'modified')
+            applyValue(entry, itemTemplate, 'modified', (value) => formatDate(value))
             applyValue(
                 entry,
                 itemTemplate,