ui cleanup

frontend/lib/api/classes/items.ts

@@ -33,15 +33,15 @@ export interface Item {
 
 export class ItemsApi extends BaseAPI {
   async getAll() {
-    return this.http.get<Results<Item>>(route('/items'));
+    return this.http.get<Results<Item>>({ url: route('/items') });
   }
 
   async create(item: ItemCreate) {
-    return this.http.post<ItemCreate, Item>(route('/items'), item);
+    return this.http.post<ItemCreate, Item>({ url: route('/items'), body: item });
   }
 
   async get(id: string) {
-    const payload = await this.http.get<Item>(route(`/items/${id}`));
+    const payload = await this.http.get<Item>({ url: route(`/items/${id}`) });
 
     if (!payload.data) {
       return payload;
@@ -55,10 +55,17 @@ export class ItemsApi extends BaseAPI {
   }
 
   async delete(id: string) {
-    return this.http.delete<void>(route(`/items/${id}`));
+    return this.http.delete<void>({ url: route(`/items/${id}`) });
   }
 
   async update(id: string, item: ItemCreate) {
-    return this.http.put<ItemCreate, Item>(route(`/items/${id}`), item);
+    return this.http.put<ItemCreate, Item>({ url: route(`/items/${id}`), body: item });
+  }
+
+  async import(file: File) {
+    const formData = new FormData();
+    formData.append('csv', file);
+
+    return this.http.post<FormData, void>({ url: route('/items/import'), data: formData });
   }
 }

frontend/lib/api/classes/labels.ts

@@ -16,22 +16,22 @@ export type Label = LabelCreate &
 
 export class LabelsApi extends BaseAPI {
   async getAll() {
-    return this.http.get<Results<Label>>(route('/labels'));
+    return this.http.get<Results<Label>>({ url: route('/labels') });
   }
 
-  async create(label: LabelCreate) {
-    return this.http.post<LabelCreate, Label>(route('/labels'), label);
+  async create(body: LabelCreate) {
+    return this.http.post<LabelCreate, Label>({ url: route('/labels'), body });
   }
 
   async get(id: string) {
-    return this.http.get<Label>(route(`/labels/${id}`));
+    return this.http.get<Label>({ url: route(`/labels/${id}`) });
   }
 
   async delete(id: string) {
-    return this.http.delete<void>(route(`/labels/${id}`));
+    return this.http.delete<void>({ url: route(`/labels/${id}`) });
   }
 
-  async update(id: string, label: LabelUpdate) {
-    return this.http.put<LabelUpdate, Label>(route(`/labels/${id}`), label);
+  async update(id: string, body: LabelUpdate) {
+    return this.http.put<LabelUpdate, Label>({ url: route(`/labels/${id}`), body });
   }
 }

frontend/lib/api/classes/locations.ts

@@ -15,21 +15,21 @@ export type LocationUpdate = LocationCreate;
 
 export class LocationsApi extends BaseAPI {
   async getAll() {
-    return this.http.get<Results<Location>>(route('/locations'));
+    return this.http.get<Results<Location>>({ url: route('/locations') });
   }
 
-  async create(location: LocationCreate) {
-    return this.http.post<LocationCreate, Location>(route('/locations'), location);
+  async create(body: LocationCreate) {
+    return this.http.post<LocationCreate, Location>({ url: route('/locations'), body });
   }
 
   async get(id: string) {
-    return this.http.get<Location>(route(`/locations/${id}`));
+    return this.http.get<Location>({ url: route(`/locations/${id}`) });
   }
   async delete(id: string) {
-    return this.http.delete<void>(route(`/locations/${id}`));
+    return this.http.delete<void>({ url: route(`/locations/${id}`) });
   }
 
-  async update(id: string, location: LocationUpdate) {
-    return this.http.put<LocationUpdate, Location>(route(`/locations/${id}`), location);
+  async update(id: string, body: LocationUpdate) {
+    return this.http.put<LocationUpdate, Location>({ url: route(`/locations/${id}`), body });
   }
 }

frontend/lib/api/public.ts

@@ -28,17 +28,20 @@ export type StatusResult = {
 
 export class PublicApi extends BaseAPI {
   public status() {
-    return this.http.get<StatusResult>(route('/status'));
+    return this.http.get<StatusResult>({ url: route('/status') });
   }
 
   public login(username: string, password: string) {
-    return this.http.post<LoginPayload, LoginResult>(route('/users/login'), {
-      username,
-      password,
+    return this.http.post<LoginPayload, LoginResult>({
+      url: route('/users/login'),
+      body: {
+        username,
+        password,
+      },
     });
   }
 
-  public register(payload: RegisterPayload) {
-    return this.http.post<RegisterPayload, LoginResult>(route('/users/register'), payload);
+  public register(body: RegisterPayload) {
+    return this.http.post<RegisterPayload, LoginResult>({ url: route('/users/register'), body });
   }
 }

frontend/lib/api/user.ts

@@ -30,14 +30,14 @@ export class UserApi extends BaseAPI {
   }
 
   public self() {
-    return this.http.get<Result<User>>(route('/users/self'));
+    return this.http.get<Result<User>>({ url: route('/users/self') });
   }
 
   public logout() {
-    return this.http.post<object, void>(route('/users/logout'), {});
+    return this.http.post<object, void>({ url: route('/users/logout') });
   }
 
   public deleteAccount() {
-    return this.http.delete<void>(route('/users/self'));
+    return this.http.delete<void>({ url: route('/users/self') });
   }
 }

frontend/lib/requests/requests.ts

@@ -15,6 +15,13 @@ export interface TResponse<T> {
   response: Response;
 }
 
+export type RequestArgs<T> = {
+  url: string;
+  body?: T;
+  data?: FormData;
+  headers?: Record<string, string>;
+};
+
 export class Requests {
   private baseUrl: string;
   private token: () => string;
@@ -39,45 +46,49 @@ export class Requests {
     this.headers = headers;
   }
 
-  public get<T>(url: string): Promise<TResponse<T>> {
-    return this.do<T>(Method.GET, url);
+  public get<T>(args: RequestArgs<T>): Promise<TResponse<T>> {
+    return this.do<T>(Method.GET, args);
   }
 
-  public post<T, U>(url: string, payload: T): Promise<TResponse<U>> {
-    return this.do<U>(Method.POST, url, payload);
+  public post<T, U>(args: RequestArgs<T>): Promise<TResponse<U>> {
+    return this.do<U>(Method.POST, args);
   }
 
-  public put<T, U>(url: string, payload: T): Promise<TResponse<U>> {
-    return this.do<U>(Method.PUT, url, payload);
+  public put<T, U>(args: RequestArgs<T>): Promise<TResponse<U>> {
+    return this.do<U>(Method.PUT, args);
   }
 
-  public delete<T>(url: string): Promise<TResponse<T>> {
-    return this.do<T>(Method.DELETE, url);
+  public delete<T>(args: RequestArgs<T>): Promise<TResponse<T>> {
+    return this.do<T>(Method.DELETE, args);
   }
 
   private methodSupportsBody(method: Method): boolean {
     return method === Method.POST || method === Method.PUT;
   }
 
-  private async do<T>(method: Method, url: string, payload: Object = {}): Promise<TResponse<T>> {
-    const args: RequestInit = {
+  private async do<T>(method: Method, rargs: RequestArgs<unknown>): Promise<TResponse<T>> {
+    const payload: RequestInit = {
       method,
       headers: {
-        'Content-Type': 'application/json',
+        ...rargs.headers,
         ...this.headers,
       },
     };
 
     const token = this.token();
-    if (token !== '' && args.headers !== undefined) {
-      args.headers['Authorization'] = token;
+    if (token !== '' && payload.headers !== undefined) {
+      payload.headers['Authorization'] = token;
     }
 
     if (this.methodSupportsBody(method)) {
-      args.body = JSON.stringify(payload);
+      if (rargs.data) {
+        payload.body = rargs.data;
+      } else {
+        payload.body = JSON.stringify(rargs.body);
+      }
     }
 
-    const response = await fetch(this.url(url), args);
+    const response = await fetch(this.url(rargs.url), payload);
     this.callResponseInterceptors(response);
 
     const data: T = await (async () => {