refactor(frontend): 🔥 rewrite backup UI for new page base components

Removed old split code and used the composition api to to re-write the import/export functionality of mealie.

frontend/api/class-interfaces/backups.ts

@@ -10,8 +10,9 @@ export interface BackupOptions {
   notifications?: boolean;
 }
 
-export interface ImportBackup extends BackupOptions {
+export interface ImportBackup {
   name: string;
+  options: BackupOptions;
 }
 
 export interface BackupJob {
@@ -58,7 +59,7 @@ export class BackupAPI extends BaseAPI {
   /** Import a database backup file generated from Mealie.
    */
   async restoreDatabase(fileName: string, payload: BackupOptions) {
-    return await this.requests.post(routes.backupsFileNameImport(fileName), payload);
+    return await this.requests.post(routes.backupsFileNameImport(fileName), {name: fileName, ...payload});
   }
 
   /** Removes a database backup from the file system

frontend/api/class-interfaces/users.ts

@@ -12,6 +12,10 @@ interface CreateAPIToken {
   name: string;
 }
 
+interface ResponseToken {
+  token: string;
+}
+
 // Code
 
 const prefix = "/api";
@@ -28,7 +32,7 @@ const routes = {
   usersIdFavoritesSlug: (id: string, slug: string) => `${prefix}/users/${id}/favorites/${slug}`,
 
   usersApiTokens: `${prefix}/users/api-tokens`,
-  usersApiTokensTokenId: (token_id: string) => `${prefix}/users/api-tokens/${token_id}`,
+  usersApiTokensTokenId: (token_id: string | number) => `${prefix}/users/api-tokens/${token_id}`,
 };
 
 export class UserApi extends BaseCRUDAPI<UserOut, UserIn> {
@@ -56,10 +60,10 @@ export class UserApi extends BaseCRUDAPI<UserOut, UserIn> {
   }
 
   async createAPIToken(tokenName: CreateAPIToken) {
-    return await this.requests.post(routes.usersApiTokens, tokenName);
+    return await this.requests.post<ResponseToken>(routes.usersApiTokens, tokenName);
   }
 
-  async deleteApiToken(tokenId: string) {
+  async deleteAPIToken(tokenId: string | number) {
     return await this.requests.delete(routes.usersApiTokensTokenId(tokenId));
   }
 

frontend/api/class-interfaces/utils.ts

@@ -0,0 +1,20 @@
+import { BaseAPI } from "./_base";
+
+const prefix = "/api";
+
+export class UtilsAPI extends BaseAPI {
+  async download(url: string) {
+    const { response } = await this.requests.get(url);
+
+    if (!response) {
+      return;
+    }
+
+    // @ts-ignore
+    const token: String = response.data.fileToken;
+
+    const tokenURL = prefix + "/utils/download?token=" + token;
+    window.open(tokenURL, "_blank");
+    return await response;
+  }
+}