fix: Correct JS formatting

frontend/src/api/files.ts

@@ -188,10 +188,15 @@ export async function diskUsage(url: string) {
   return await data.json();
 }
 
-export async function archive(url: string, name: string, format: string, ...files: string[]) {
+export async function archive(
+  url: string,
+  name: string,
+  format: string,
+  ...files: string[]
+) {
   let arg = "";
 
-  for (let file of files) {
+  for (const file of files) {
     arg += file + ",";
   }
 
@@ -214,7 +219,12 @@ export async function unarchive(path: string, name: string, override: boolean) {
   return resourceAction(url, "PATCH");
 }
 
-export async function chmod(path: string, perms: number, recursive: boolean, recursionType: string) {
+export async function chmod(
+  path: string,
+  perms: number,
+  recursive: boolean,
+  recursionType: string
+) {
   const action = `chmod`;
   let url = `${path}?action=${action}&permissions=${perms}&recursive=${recursive}`;
   if (recursive) {

frontend/src/components/Quota.vue

@@ -44,23 +44,37 @@ const quotaStore = useQuotaStore();
 const { t } = useI18n();
 
 const loaded = computed(() =>
-  quotaStore.quota ? quotaStore.quota.inodes !== null && quotaStore.quota.space !== null : false
+  quotaStore.quota
+    ? quotaStore.quota.inodes !== null && quotaStore.quota.space !== null
+    : false
 );
 
 const spaceProgress = computed(() =>
-  quotaStore.quota && quotaStore.quota.space !== null ? progress(quotaStore.quota.space) : 0
+  quotaStore.quota && quotaStore.quota.space !== null
+    ? progress(quotaStore.quota.space)
+    : 0
 );
 
 const inodeProgress = computed(() =>
-  quotaStore.quota && quotaStore.quota.inodes !== null ? progress(quotaStore.quota.inodes) : 0
+  quotaStore.quota && quotaStore.quota.inodes !== null
+    ? progress(quotaStore.quota.inodes)
+    : 0
 );
 
 const spaceUsageTitle = computed(() =>
-  !quotaStore.quota ? "- / -" : filesize(quotaStore.quota.space.usage) + " / " + filesize(quotaStore.quota.space.quota)
+  !quotaStore.quota
+    ? "- / -"
+    : filesize(quotaStore.quota.space.usage) +
+      " / " +
+      filesize(quotaStore.quota.space.quota)
 );
 
 const inodeUsageTitle = computed(() =>
-  !quotaStore.quota ? "- / -" : filesize(quotaStore.quota.inodes.usage) + " / " + filesize(quotaStore.quota.inodes.quota)
+  !quotaStore.quota
+    ? "- / -"
+    : filesize(quotaStore.quota.inodes.usage) +
+      " / " +
+      filesize(quotaStore.quota.inodes.quota)
 );
 
 const progress = (info: QuotaInfo) => {
@@ -71,5 +85,5 @@ const progress = (info: QuotaInfo) => {
 
 onMounted(() => {
   quotaStore.fetchQuota();
-})
+});
 </script>

frontend/src/components/Sidebar.vue

@@ -131,7 +131,7 @@
           href="https://github.com/filebrowser/filebrowser"
           >File Browser</a
         >
-        <span> {{ ' ' }} {{ version }}</span>
+        <span> {{ " " }} {{ version }}</span>
       </span>
       <span>
         <a @click="help">{{ $t("sidebar.help") }}</a>

frontend/src/components/files/ContextMenu.vue

@@ -1,10 +1,5 @@
 <template>
-  <div
+  <div id="context-menu" ref="contextMenuDiv" class="card" :style="menuStyle">
-    id="context-menu"
-    ref="contextMenuDiv"
-    class="card"
-    :style="menuStyle"
-  >
     <p>
       <action icon="info" :label="t('buttons.info')" show="info" />
     </p>
@@ -81,8 +76,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref,computed, onMounted, onBeforeUnmount, CSSProperties } from "vue";
+import { ref, computed, onMounted, onBeforeUnmount, CSSProperties } from "vue";
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute, useRouter } from "vue-router";
 import { useAuthStore } from "@/stores/auth";
 import { useFileStore } from "@/stores/file";
 import { useLayoutStore } from "@/stores/layout";
@@ -125,10 +120,9 @@ const options = computed(() => {
     download: authStore.user?.perm.download ?? false,
     delete: fileStore.selectedCount > 0 && authStore.user?.perm.delete,
     edit:
-      fileStore.selectedCount === 1 && (
+      fileStore.selectedCount === 1 &&
-        fileStore.req?.items[fileStore.selected[0]].type === "text" ||
+      (fileStore.req?.items[fileStore.selected[0]].type === "text" ||
-        fileStore.req?.items[fileStore.selected[0]].type === "textImmutable"
+        fileStore.req?.items[fileStore.selected[0]].type === "textImmutable"),
-      ),
     rename: fileStore.selectedCount === 1 && authStore.user?.perm.rename,
     share: fileStore.selectedCount === 1 && authStore.user?.perm.share,
     move: fileStore.selectedCount > 0 && authStore.user?.perm.rename,

frontend/src/components/files/ListingItem.vue

@@ -29,7 +29,9 @@
       </p>
       <p v-else class="name">{{ name }}</p>
 
-      <p class="size" :data-order="diskUsage?.size || humanSize() || '-1'">{{ usedDiskSize }}</p>
+      <p class="size" :data-order="diskUsage?.size || humanSize() || '-1'">
+        {{ usedDiskSize }}
+      </p>
 
       <p class="modified">
         <time :datetime="modified">{{ humanTime() }}</time>
@@ -91,10 +93,14 @@ const diskUsage = ref<DiskUsage | null>(null);
 const usedDiskSize = computed((): string => {
   if (props.isDir) {
     if (!diskUsage.value) {
-      return '-';
+      return "-";
     }
 
-    return diskUsage.value.size + ' ' + t("prompts.inodeCount", { count: diskUsage.value.inodes });
+    return (
+      diskUsage.value.size +
+      " " +
+      t("prompts.inodeCount", { count: diskUsage.value.inodes })
+    );
   }
 
   return humanSize();
@@ -109,9 +115,13 @@ const isDraggable = computed(
   () => !props.readOnly && authStore.user?.perm.rename
 );
 
-watch(diskUsages, () => {
+watch(
+  diskUsages,
+  () => {
     updateDiskUsage();
-}, { deep: true });
+  },
+  { deep: true }
+);
 
 const canDrop = computed(() => {
   if (!props.isDir || props.readOnly) return false;

frontend/src/components/prompts/Archive.vue

@@ -38,7 +38,7 @@
 import { inject, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import { onMounted } from "vue";
-import { useRoute } from 'vue-router'
+import { useRoute } from "vue-router";
 import { useFileStore } from "@/stores/file";
 import { useQuotaStore } from "@/stores/quota";
 import { useLayoutStore } from "@/stores/layout";
@@ -74,7 +74,7 @@ const archive = async (format: string) => {
   let items: string[] = [];
 
   for (let i of fileStore.selected) {
-    let item = fileStore.req?.items[i].name
+    let item = fileStore.req?.items[i].name;
     if (item) {
       items.push(item);
     }

frontend/src/components/prompts/Permissions.vue

@@ -117,7 +117,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, inject } from "vue";
+import { computed, inject, onMounted, ref } from "vue";
 import { useFileStore } from "@/stores/file";
 import { useLayoutStore } from "@/stores/layout";
 import { useI18n } from "vue-i18n";
@@ -130,10 +130,28 @@ const { t } = useI18n();
 
 const $showError = inject<IToastError>("$showError")!;
 
-let loading = false;
+const loading = ref<boolean>(false);
-let recursive = false;
+const recursive = ref<boolean>(false);
-let recursionType = "all";
+const recursionType = ref<string>("all");
-let masks = {
+const permissions = ref<FilePermissions>({
+  owner: {
+    read: false,
+    write: false,
+    execute: false,
+  },
+  group: {
+    read: false,
+    write: false,
+    execute: false,
+  },
+  others: {
+    read: false,
+    write: false,
+    execute: false,
+  },
+});
+
+const masks = {
   permissions: 511,
   owner: {
     read: 256,
@@ -152,46 +170,26 @@ let masks = {
   },
 };
 
-const permissions = computed((): FilePermissions => {
+onMounted(() => {
-  let permObj = {
-    owner: {
-      read: false,
-      write: false,
-      execute: false,
-    },
-    group: {
-      read: false,
-      write: false,
-      execute: false,
-    },
-    others: {
-      read: false,
-      write: false,
-      execute: false,
-    },
-  };
-
   let item = fileStore.req?.items[fileStore.selected[0]];
   if (!item) {
-    return permObj
+    return;
   }
 
   let perms = item.mode & masks.permissions;
 
   // OWNER PERMS
-  permObj.owner.read = (perms & masks.owner.read) != 0;
+  permissions.value.owner.read = (perms & masks.owner.read) != 0;
-  permObj.owner.write = (perms & masks.owner.write) != 0;
+  permissions.value.owner.write = (perms & masks.owner.write) != 0;
-  permObj.owner.execute = (perms & masks.owner.execute) != 0;
+  permissions.value.owner.execute = (perms & masks.owner.execute) != 0;
   // GROUP PERMS
-  permObj.group.read = (perms & masks.group.read) != 0;
+  permissions.value.group.read = (perms & masks.group.read) != 0;
-  permObj.group.write = (perms & masks.group.write) != 0;
+  permissions.value.group.write = (perms & masks.group.write) != 0;
-  permObj.group.execute = (perms & masks.group.execute) != 0;
+  permissions.value.group.execute = (perms & masks.group.execute) != 0;
   // OTHERS PERMS
-  permObj.others.read = (perms & masks.others.read) != 0;
+  permissions.value.others.read = (perms & masks.others.read) != 0;
-  permObj.others.write = (perms & masks.others.write) != 0;
+  permissions.value.others.write = (perms & masks.others.write) != 0;
-  permObj.others.execute = (perms & masks.others.execute) != 0;
+  permissions.value.others.execute = (perms & masks.others.execute) != 0;
-
-  return permObj;
 });
 
 const permMode = computed((): number => {
@@ -239,21 +237,21 @@ const chmod = async () => {
   }
 
   try {
-    loading = true;
+    loading.value = true;
 
     await api.chmod(
       item.url,
       permMode.value,
-      recursive,
+      recursive.value,
-      recursionType,
+      recursionType.value
     );
 
     layoutStore.closeHovers();
-    fileStore.reload = true
+    fileStore.reload = true;
   } catch (e: any) {
     $showError(e);
   } finally {
-    loading = false;
+    loading.value = false;
   }
 };
 </script>

frontend/src/components/prompts/Unarchive.vue

@@ -79,16 +79,9 @@ const overwriteAvailable = computed((): boolean => {
     return false;
   }
 
-  return [
+  return [".zip", ".rar", ".tar", ".bz2", ".gz", ".xz", ".lz4", ".sz"].includes(
-    ".zip",
+    item.extension
-    ".rar",
+  );
-    ".tar",
-    ".bz2",
-    ".gz",
-    ".xz",
-    ".lz4",
-    ".sz",
-  ].includes(item.extension);
 });
 
 const cancel = () => {

frontend/src/components/settings/Languages.vue

@@ -29,7 +29,7 @@ export default {
       ru_RU: "Русский",
       tr_TR: "Türkçe",
       uk_UA: "Український",
-      zh_CN: "中文 (简体)"
+      zh_CN: "中文 (简体)",
     };
 
     // Vue3 reactivity breaks with this configuration

frontend/src/i18n/index.ts

@@ -106,9 +106,9 @@ export const isRtl = (locale?: string) => {
 };
 
 export function setLocale(locale: string) {
-  let normalizedLocale = locale
+  let normalizedLocale = locale;
   if (locale.includes("_")) {
-    normalizedLocale = locale.split("_")[0]
+    normalizedLocale = locale.split("_")[0];
   }
 
   dayjs.locale(normalizedLocale);

frontend/src/stores/contextMenu.ts

@@ -8,10 +8,10 @@ export const useContextMenuStore = defineStore("context-menu", {
   }),
   actions: {
     show(x: number, y: number) {
-      this.position = { x, y }
+      this.position = { x, y };
     },
     hide() {
-      this.position = null
+      this.position = null;
     },
   },
 });

frontend/src/stores/file.ts

@@ -33,8 +33,8 @@ export const useFileStore = defineStore("file", {
       return state.isFiles && state?.req?.isDir;
     },
     onlyArchivesSelected: (state) => {
-      let extensions = [".zip", ".tar", ".gz", ".bz2", ".xz", ".lz4", ".sz"];
+      const extensions = [".zip", ".tar", ".gz", ".bz2", ".xz", ".lz4", ".sz"];
-      let items = state.req?.items;
+      const items = state.req?.items;
 
       if (!items) {
         return false;
@@ -45,7 +45,7 @@ export const useFileStore = defineStore("file", {
       }
 
       for (const i of state.selected) {
-        let item = items[i];
+        const item = items[i];
         if (item.isDir || !extensions.includes(item.extension)) {
           return false;
         }

frontend/src/stores/quota.ts

@@ -16,7 +16,7 @@ export const useQuotaStore = defineStore("quota", {
 
       setTimeout(async () => {
         try {
-          let data = await api.getQuota();
+          const data = await api.getQuota();
 
           if (
             data !== null &&
@@ -29,6 +29,6 @@ export const useQuotaStore = defineStore("quota", {
           console.log(e);
         }
       }, delay);
-    }
+    },
   },
 });

frontend/src/types/contextMenu.d.ts

@@ -1,4 +1,4 @@
 interface ContextMenuPosition {
-  x: number,
+  x: number;
-  y: number,
+  y: number;
 }

frontend/src/types/permissions.d.ts

@@ -1,11 +1,11 @@
 interface FilePermissions {
-  owner: PermissionModes,
+  owner: PermissionModes;
-  group: PermissionModes,
+  group: PermissionModes;
-  others: PermissionModes,
+  others: PermissionModes;
 }
 
 interface PermissionModes {
-  read: boolean,
+  read: boolean;
-  write: boolean,
+  write: boolean;
-  execute: boolean,
+  execute: boolean;
 }

frontend/src/views/Layout.vue

@@ -50,7 +50,8 @@ watch(route, () => {
   }
 });
 
-const contextMenuVisible = computed((): boolean =>
+const contextMenuVisible = computed(
+  (): boolean =>
     (fileStore.isListing || false) && contextMenuStore.position !== null
 );
 </script>

frontend/src/views/files/FileListing.vue

@@ -903,13 +903,10 @@ const calculateDirSizes = () => {
   Promise.allSettled(promises).then((results) => {
     for (let result of results) {
       if (result.status === "fulfilled") {
-        fileStore.addDiskUsage(
+        fileStore.addDiskUsage(result.value.path, {
-          result.value.path,
-          {
           size: result.value.diskUsage,
           inodes: result.value.inodes,
-          },
+        });
-        )
       }
     }