Rename IFile to Resource and improve the types

frontend/src/api/files.ts

@@ -183,7 +183,7 @@ export async function checksum(url: string, algo: ChecksumAlgs) {
   return (await data.json()).checksums[algo];
 }
 
-export function getDownloadURL(file: IFile, inline: any) {
+export function getDownloadURL(file: ResourceItem, inline: any) {
   const params = {
     ...(inline && { inline: "true" }),
   };
@@ -191,7 +191,7 @@ export function getDownloadURL(file: IFile, inline: any) {
   return createURL("api/raw" + file.path, params);
 }
 
-export function getPreviewURL(file: IFile, size: string) {
+export function getPreviewURL(file: ResourceItem, size: string) {
   const params = {
     inline: "true",
     key: Date.parse(file.modified),
@@ -200,17 +200,12 @@ export function getPreviewURL(file: IFile, size: string) {
   return createURL("api/preview/" + size + file.path, params);
 }
 
-export function getSubtitlesURL(file: IFile) {
+export function getSubtitlesURL(file: ResourceItem) {
   const params = {
     inline: "true",
   };
 
-  const subtitles = [];
+  return file.subtitles?.map((d) => createURL("api/raw" + d, params));
-  for (const sub of file.subtitles) {
-    subtitles.push(createURL("api/raw" + sub, params));
-  }
-
-  return subtitles;
 }
 
 export async function usage(url: string) {

frontend/src/api/pub.ts

@@ -13,6 +13,7 @@ export async function fetch(url: string, password: string = "") {
   );
 
   const data = await res.json();
+  console.log(data);
   data.url = `/share${url}`;
 
   if (data.isDir) {
@@ -66,11 +67,11 @@ export function download(
   window.open(url);
 }
 
-export function getDownloadURL(share: IFile, inline = false) {
+export function getDownloadURL(res: Resource, inline = false) {
   const params = {
     ...(inline && { inline: "true" }),
-    ...(share.token && { token: share.token }),
+    ...(res.token && { token: res.token }),
   };
 
-  return createURL("api/public/dl/" + share.hash + share.path, params, false);
+  return createURL("api/public/dl/" + res.hash + res.path, params, false);
 }

frontend/src/stores/file.ts

@@ -3,8 +3,8 @@ import { defineStore } from "pinia";
 export const useFileStore = defineStore("file", {
   // convert to a function
   state: (): {
-    req: IFile | null;
+    req: Resource | null;
-    oldReq: IFile | null;
+    oldReq: Resource | null;
     reload: boolean;
     selected: any[];
     multiple: boolean;
@@ -36,7 +36,7 @@ export const useFileStore = defineStore("file", {
     toggleMultiple() {
       this.multiple = !this.multiple;
     },
-    updateRequest(value: IFile | null) {
+    updateRequest(value: Resource | null) {
       this.oldReq = this.req;
       this.req = value;
     },

frontend/src/types/common.d.ts

@@ -0,0 +1,4 @@
+interface Sorting {
+  by: string;
+  asc: boolean;
+}

frontend/src/types/file.d.ts

@@ -1,20 +1,32 @@
-interface IFile {
+interface ResourceBase {
-  index?: number;
-  name: string;
-  modified: string;
   path: string;
-  subtitles: any[];
+  name: string;
-  isDir: boolean;
   size: number;
-  fullPath: string;
+  extension: string;
-  type: FileType;
+  modified: string; // ISO 8601 datetime
-  items: IFile[];
+  mode: number;
-  token?: string;
+  isDir: boolean;
-  hash: string;
+  isSymlink: boolean;
-  url?: string;
+  type: ResourceType;
+  url: string;
+  fullPath?: string;
 }
 
-type FileType =
+interface Resource extends ResourceBase {
+  items: ResourceItem[];
+  numDirs: number;
+  numFiles: number;
+  sorting: Sorting;
+  hash?: string;
+  token?: string;
+}
+
+interface ResourceItem extends ResourceBase {
+  index?: number;
+  subtitles?: string[];
+}
+
+type ResourceType =
   | "video"
   | "audio"
   | "image"
@@ -23,27 +35,13 @@ type FileType =
   | "blob"
   | "textImmutable";
 
-type req = {
-  path: string;
-  name: string;
-  size: number;
-  extension: string;
-  modified: string;
-  mode: number;
-  isDir: boolean;
-  isSymlink: boolean;
-  type: string;
-  url: string;
-  hash: string;
-};
-
 interface Uploads {
   [key: string]: Upload;
 }
 
 interface Upload {
   id: number;
-  file: IFile;
+  file: Resource;
   type: string;
 }
 
@@ -51,8 +49,8 @@ interface Item {
   id: number;
   url?: string;
   path: string;
-  file: IFile;
+  file: Resource;
   dir?: boolean;
   overwrite?: boolean;
-  type?: FileType;
+  type?: ResourceType;
 }

frontend/src/types/settings.d.ts

@@ -15,18 +15,13 @@ interface SettingsDefaults {
   locale: string;
   viewMode: string;
   singleClick: boolean;
-  sorting: SettingsSorting;
+  sorting: Sorting;
   perm: Permissions;
   commands: any[];
   hideDotfiles: boolean;
   dateFormat: boolean;
 }
 
-interface SettingsSorting {
-  by: string;
-  asc: boolean;
-}
-
 interface SettingsBranding {
   name: string;
   disableExternal: boolean;

frontend/src/utils/upload.ts

@@ -1,7 +1,7 @@
 import { useUploadStore } from "@/stores/upload";
 import url from "@/utils/url";
 
-export function checkConflict(files: IFile[], items: Item[]) {
+export function checkConflict(files: Resource[], items: Item[]) {
   if (typeof items === "undefined" || items === null) {
     items = [];
   }
@@ -14,13 +14,15 @@ export function checkConflict(files: IFile[], items: Item[]) {
     let name = file.name;
 
     if (folder_upload) {
-      const dirs = file.fullPath.split("/");
+      const dirs = file.fullPath?.split("/");
-      if (dirs.length > 1) {
+      if (dirs && dirs.length > 1) {
         name = dirs[0];
       }
     }
 
     const res = items.findIndex(function hasConflict(element) {
+      // @ts-ignore
+      console.log({ left: element.name, right: this });
       // @ts-ignore Don't know what this does
       return element.name === this;
     }, name);
@@ -56,7 +58,7 @@ export function scanFiles(dt: { [key: string]: any; item: Item }) {
     function readEntry(entry: any, directory = "") {
       if (entry.isFile) {
         reading++;
-        entry.file((file: IFile) => {
+        entry.file((file: Resource) => {
           reading--;
 
           file.fullPath = `${directory}${file.name}`;
@@ -101,7 +103,7 @@ export function scanFiles(dt: { [key: string]: any; item: Item }) {
   });
 }
 
-function detectType(mimetype: string): FileType {
+function detectType(mimetype: string): ResourceType {
   if (mimetype.startsWith("video")) return "video";
   if (mimetype.startsWith("audio")) return "audio";
   if (mimetype.startsWith("image")) return "image";
@@ -110,7 +112,11 @@ function detectType(mimetype: string): FileType {
   return "blob";
 }
 
-export function handleFiles(files: IFile[], base: string, overwrite = false) {
+export function handleFiles(
+  files: Resource[],
+  base: string,
+  overwrite = false
+) {
   const uploadStore = useUploadStore();
 
   for (let i = 0; i < files.length; i++) {

frontend/src/views/Files.vue

@@ -136,7 +136,7 @@ const fetchData = async () => {
     fileStore.updateRequest(res);
     document.title = `${res.name} - ${document.title}`;
   } catch (err) {
-    if (err instanceof StatusError || err instanceof Error) {
+    if (err instanceof Error) {
       error.value = err;
     }
   } finally {

frontend/src/views/Share.vue

@@ -273,7 +273,7 @@ const fetchData = async () => {
   if (url[0] !== "/") url = "/" + url;
 
   try {
-    let file = await api.fetch(url, password.value);
+    const file = await api.fetch(url, password.value);
     file.hash = hash.value;
 
     token.value = file.token || "";
@@ -281,7 +281,7 @@ const fetchData = async () => {
     fileStore.updateRequest(file);
     document.title = `${file.name} - ${document.title}`;
   } catch (err) {
-    if (err instanceof StatusError || err instanceof Error) {
+    if (err instanceof Error) {
       error.value = err;
     }
   } finally {

frontend/src/views/files/Preview.vue

@@ -195,6 +195,7 @@ export default {
       return api.getDownloadURL(this.req);
     },
     raw() {
+      console.log(this.req);
       if (this.req.type === "image" && !this.fullSize) {
         return api.getPreviewURL(this.req, "big");
       }

frontend/src/views/settings/Global.vue

@@ -382,7 +382,7 @@ onMounted(async () => {
     settings.value = newSettings;
     shellValue.value = newSettings.shell.join("\n");
   } catch (err) {
-    if (err instanceof StatusError || err instanceof Error) {
+    if (err instanceof Error) {
       error.value = err;
     }
   } finally {

frontend/src/views/settings/Profile.vue

@@ -88,8 +88,8 @@ const layoutStore = useLayoutStore();
 const authStore = useAuthStore();
 const { t } = useI18n();
 
-const $showSuccess = inject("$showSuccess") as IToastSuccess;
+const $showSuccess = inject<IToastSuccess>("$showSuccess")!;
-const $showError = inject("$showError") as IToastError;
+const $showError = inject<IToastError>("$showError")!;
 
 const password = ref<string>("");
 const passwordConf = ref<string>("");
@@ -150,7 +150,7 @@ const updateSettings = async (event: Event) => {
   event.preventDefault();
 
   try {
-    if (authStore.user === null) throw "User is not set";
+    if (authStore.user === null) throw new Error("User is not set!");
 
     const data = {
       ...authStore.user,

frontend/src/views/settings/Shares.vue

@@ -73,8 +73,8 @@ import { inject, onBeforeUnmount, ref, onMounted } from "vue";
 import { useI18n } from "vue-i18n";
 import { StatusError } from "@/api/utils";
 
-const $showError = inject("$showError") as IToastSuccess;
+const $showError = inject<IToastError>("$showError")!;
-const $showSuccess = inject("$showSuccess") as IToastError;
+const $showSuccess = inject<IToastSuccess>("$showSuccess")!;
 const { t } = useI18n();
 
 const layoutStore = useLayoutStore();
@@ -90,17 +90,17 @@ onMounted(async () => {
   try {
     let newLinks = await api.list();
     if (authStore.user?.perm.admin) {
-      let userMap = new Map();
+      let userMap = new Map<number, string>();
       for (let user of await users.getAll())
         userMap.set(user.id, user.username);
-      for (let link of newLinks)
+      for (let link of newLinks) {
-        link.username = userMap.has(link.userID)
+        if (link.userID && userMap.has(link.userID))
-          ? userMap.get(link.userID)
+          link.username = userMap.get(link.userID);
-          : "";
+      }
     }
     links.value = newLinks;
   } catch (err) {
-    if (err instanceof StatusError || err instanceof Error) {
+    if (err instanceof Error) {
       error.value = err;
     }
   } finally {
@@ -126,8 +126,10 @@ const deleteLink = async (event: Event, link: any) => {
         api.remove(link.hash);
         links.value = links.value.filter((item) => item.hash !== link.hash);
         $showSuccess(t("settings.shareDeleted"));
-      } catch (e: any) {
+      } catch (err) {
-        $showError(e);
+        if (err instanceof Error) {
+          $showError(err);
+        }
       }
     },
   });

frontend/src/views/settings/User.vue

@@ -80,13 +80,13 @@ import { useRoute, useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { StatusError } from "@/api/utils";
 
-const error = ref<any | null>(null);
+const error = ref<StatusError | null>(null);
 const originalUser = ref<IUser | null>(null);
 const user = ref<IUser | null>(null);
 const createUserDir = ref<boolean>(false);
 
-const $showError = inject("$showError") as IToastError;
+const $showError = inject<IToastError>("$showError")!;
-const $showSuccess = inject("$showSuccess") as IToastSuccess;
+const $showSuccess = inject<IToastSuccess>("$showSuccess")!;
 
 const authStore = useAuthStore();
 const layoutStore = useLayoutStore();
@@ -127,8 +127,10 @@ const fetchData = async () => {
         : route.params.id;
       user.value = { ...(await api.get(parseInt(id))) };
     }
-  } catch (e) {
+  } catch (err) {
-    error.value = e;
+    if (err instanceof Error) {
+      error.value = err;
+    }
   } finally {
     layoutStore.loading = false;
   }

frontend/src/views/settings/Users.vue

@@ -61,7 +61,7 @@ onMounted(async () => {
   try {
     users.value = await api.getAll();
   } catch (err) {
-    if (err instanceof StatusError || err instanceof Error) {
+    if (err instanceof Error) {
       error.value = err;
     }
   } finally {