feat(ui): add files api

Signed-off-by: Petr Bulánek <[email protected]>

Author: PetrBulanek

apps/agentstack-sdk-ts/src/client/api/files/api.ts

@@ -5,18 +5,32 @@
 
 import type { CallApi } from '../../client/types';
 import { ApiMethod } from '../../client/types';
-import { createFileResponseSchema, readFileResponseSchema } from './schemas';
-import type { CreateFileRequest, ReadFileRequest } from './types';
+import {
+  createFileResponseSchema,
+  deleteFileResponseSchema,
+  readFileContentResponseSchema,
+  readFileResponseSchema,
+} from './schemas';
+import type { CreateFileRequest, DeleteFileRequest, ReadFileContentRequest, ReadFileRequest } from './types';
 
 export function createFilesApi(callApi: CallApi) {
-  const createFile = ({ context_id, ...body }: CreateFileRequest) =>
-    callApi({
+  const createFile = ({ context_id, file }: CreateFileRequest) => {
+    const body = new FormData();
+
+    if (file instanceof File) {
+      body.append('file', file);
+    } else {
+      body.append('file', file.blob, file.filename);
+    }
+
+    return callApi({
       method: ApiMethod.Post,
       path: '/api/v1/files',
       schema: createFileResponseSchema,
       query: { context_id },
       body,
     });
+  };
 
   const readFile = ({ context_id, file_id }: ReadFileRequest) =>
     callApi({
@@ -26,8 +40,26 @@ export function createFilesApi(callApi: CallApi) {
       query: { context_id },
     });
 
+  const deleteFile = ({ context_id, file_id }: DeleteFileRequest) =>
+    callApi({
+      method: ApiMethod.Delete,
+      path: `/api/v1/files/${file_id}`,
+      schema: deleteFileResponseSchema,
+      query: { context_id },
+    });
+
+  const readFileContent = ({ context_id, file_id }: ReadFileContentRequest) =>
+    callApi({
+      method: ApiMethod.Get,
+      path: `/api/v1/files/${file_id}/content`,
+      schema: readFileContentResponseSchema,
+      query: { context_id },
+    });
+
   return {
     createFile,
     readFile,
+    deleteFile,
+    readFileContent,
   };
 }

apps/agentstack-sdk-ts/src/client/api/files/schemas.ts

@@ -23,7 +23,13 @@ export const fileSchema = z.object({
 
 export const createFileRequestSchema = z.object({
   context_id: z.string().nullable(),
-  file: z.string(),
+  file: z.union([
+    z.file(),
+    z.object({
+      blob: z.instanceof(Blob),
+      filename: z.string(),
+    }),
+  ]),
 });
 
 export const createFileResponseSchema = fileSchema;
@@ -34,3 +40,17 @@ export const readFileRequestSchema = z.object({
 });
 
 export const readFileResponseSchema = fileSchema;
+
+export const deleteFileRequestSchema = z.object({
+  context_id: z.string().nullable(),
+  file_id: z.string(),
+});
+
+export const deleteFileResponseSchema = z.null();
+
+export const readFileContentRequestSchema = z.object({
+  context_id: z.string().nullable(),
+  file_id: z.string(),
+});
+
+export const readFileContentResponseSchema = z.unknown();

apps/agentstack-sdk-ts/src/client/api/files/types.ts

@@ -8,7 +8,11 @@ import type z from 'zod';
 import type {
   createFileRequestSchema,
   createFileResponseSchema,
+  deleteFileRequestSchema,
+  deleteFileResponseSchema,
   fileSchema,
+  readFileContentRequestSchema,
+  readFileContentResponseSchema,
   readFileRequestSchema,
   readFileResponseSchema,
 } from './schemas';
@@ -25,3 +29,9 @@ export type CreateFileResponse = z.infer<typeof createFileResponseSchema>;
 
 export type ReadFileRequest = z.infer<typeof readFileRequestSchema>;
 export type ReadFileResponse = z.infer<typeof readFileResponseSchema>;
+
+export type DeleteFileRequest = z.infer<typeof deleteFileRequestSchema>;
+export type DeleteFileResponse = z.infer<typeof deleteFileResponseSchema>;
+
+export type ReadFileContentRequest = z.infer<typeof readFileContentRequestSchema>;
+export type ReadFileContentResponse = z.infer<typeof readFileContentResponseSchema>;

apps/agentstack-sdk-ts/src/client/client/index.ts

@@ -31,7 +31,7 @@ function createCallApi({ baseUrl, fetch: fetchFn }: { baseUrl: string; fetch: ty
       const rawResponse = await fetchFn(requestUrl, requestInit);
       const bodyText = await safeReadText(rawResponse);
 
-      const { ok, status, statusText } = rawResponse;
+      const { ok, status, statusText, headers } = rawResponse;
       const response = { status, statusText, bodyText };
 
       if (!ok) {
@@ -46,7 +46,7 @@ function createCallApi({ baseUrl, fetch: fetchFn }: { baseUrl: string; fetch: ty
         } satisfies ApiFailure;
       }
 
-      const { data: parsedBody, error: parseError } = parseBodyText(bodyText);
+      const { data: parsedBody, error: parseError } = parseBodyText(bodyText, headers);
 
       if (parseError) {
         return {

apps/agentstack-sdk-ts/src/client/client/types.ts

@@ -17,7 +17,7 @@ export enum ApiMethod {
 }
 
 export type ApiQueryParams = Record<string, unknown>;
-export type ApiRequestBody = Record<string, unknown>;
+export type ApiRequestBody = Record<string, unknown> | FormData;
 
 export interface ApiParams<T> {
   method: ApiMethod;

apps/agentstack-sdk-ts/src/client/client/utils.ts

@@ -3,8 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type { ApiQueryParams, ApiRequestBody } from './types';
-import type { ApiMethod } from './types';
+import type { ApiMethod, ApiQueryParams, ApiRequestBody } from './types';
 
 export function buildRequestUrl({ baseUrl, path, query }: { baseUrl: string; path: string; query?: ApiQueryParams }) {
   const url = `${baseUrl.replace(/\/+$/, '')}${path}`;
@@ -27,21 +26,24 @@ export function buildRequestUrl({ baseUrl, path, query }: { baseUrl: string; pat
 }
 
 export function buildRequestInit({ method, body }: { method: ApiMethod; body?: ApiRequestBody }) {
-  const headers = new Headers({ Accept: 'application/json' });
+  const headers = new Headers();
+
+  let requestBody: FormData | string | undefined;
 
   if (body) {
-    headers.set('Content-Type', 'application/json');
+    if (body instanceof FormData) {
+      requestBody = body;
+    } else {
+      headers.set('Content-Type', 'application/json');
 
-    return {
-      method,
-      headers,
-      body: JSON.stringify(body),
-    };
+      requestBody = JSON.stringify(body);
+    }
   }
 
   return {
     method,
     headers,
+    body: requestBody,
   };
 }
 
@@ -53,7 +55,10 @@ export async function safeReadText(response: Response) {
   }
 }
 
-export function parseBodyText(bodyText: string | null): {
+export function parseBodyText(
+  bodyText: string | null,
+  headers: Headers,
+): {
   data: unknown;
   error?: Error;
 } {
@@ -63,14 +68,23 @@ export function parseBodyText(bodyText: string | null): {
     };
   }
 
-  try {
-    return {
-      data: JSON.parse(bodyText),
-    };
-  } catch (error) {
-    return {
-      data: null,
-      error: error instanceof Error ? error : new Error('Failed to parse body text.'),
-    };
+  const contentType = headers.get('content-type') ?? '';
+  const isJsonResponse = contentType.includes('application/json');
+
+  if (isJsonResponse) {
+    try {
+      return {
+        data: JSON.parse(bodyText),
+      };
+    } catch (error) {
+      return {
+        data: null,
+        error: error instanceof Error ? error : new Error('Failed to parse body text.'),
+      };
+    }
   }
+
+  return {
+    data: bodyText,
+  };
 }

apps/agentstack-ui/src/modules/files/api/index.ts

@@ -3,31 +3,23 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { api } from '#api/index.ts';
-import { ensureData } from '#api/utils.ts';
+import type { DeleteFileRequest } from 'agentstack-sdk';
+import { unwrapResult } from 'agentstack-sdk';
 
-import type { DeleteFileParams, UploadFileParams, UploadFileRequest } from './types';
+import { agentStackClient } from '#api/agentstack-client.ts';
 
-export async function uploadFile({ context_id, file }: UploadFileParams) {
-  const response = await api.POST('/api/v1/files', {
-    params: { query: { context_id } },
-    body: { file: file.originalFile } as unknown as UploadFileRequest,
-    bodySerializer: (body) => {
-      const formData = new FormData();
+import type { UploadFileParams } from './types';
 
-      formData.append('file', body.file);
+export async function uploadFile({ file, ...request }: UploadFileParams) {
+  const response = await agentStackClient.createFile({ ...request, file: file.originalFile });
+  const result = unwrapResult(response);
 
-      return formData;
-    },
-  });
-
-  return ensureData(response);
+  return result;
 }
 
-export async function deleteFile({ file_id, context_id }: DeleteFileParams) {
-  const response = await api.DELETE('/api/v1/files/{file_id}', {
-    params: { path: { file_id }, query: { context_id } },
-  });
+export async function deleteFile(request: DeleteFileRequest) {
+  const response = await agentStackClient.deleteFile(request);
+  const result = unwrapResult(response);
 
-  return ensureData(response);
+  return result;
 }

apps/agentstack-ui/src/modules/files/api/mutations/useUploadFile.ts

@@ -4,13 +4,14 @@
  */
 
 import { useMutation } from '@tanstack/react-query';
+import type { CreateFileResponse } from 'agentstack-sdk';
 
 import { uploadFile } from '..';
-import type { UploadFileParams, UploadFileResponse } from '../types';
+import type { UploadFileParams } from '../types';
 
 interface Props {
   onMutate?: (variables: UploadFileParams) => void;
-  onSuccess?: (data: UploadFileResponse | undefined, variables: UploadFileParams) => void;
+  onSuccess?: (data: CreateFileResponse, variables: UploadFileParams) => void;
   onError?: (error: Error, variables: UploadFileParams) => void;
 }
 

apps/agentstack-ui/src/modules/files/api/types.ts

@@ -3,15 +3,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type { ApiPath, ApiQuery, ApiRequest, ApiResponse } from '#@types/utils.ts';
+import type { CreateFileRequest } from 'agentstack-sdk';
 
 import type { FileEntity } from '../types';
 
-export type UploadFileQuery = ApiQuery<'/api/v1/files', 'post'>;
-export type UploadFileRequest = ApiRequest<'/api/v1/files', 'post', 'multipart/form-data'>;
-export type UploadFileParams = UploadFileQuery & Omit<UploadFileRequest, 'file'> & { file: FileEntity };
-export type UploadFileResponse = ApiResponse<'/api/v1/files', 'post', 'application/json', 201>;
-
-export type DeleteFileQuery = ApiQuery<'/api/v1/files/{file_id}', 'delete'>;
-export type DeleteFilePath = ApiPath<'/api/v1/files/{file_id}', 'delete'>;
-export type DeleteFileParams = DeleteFilePath & DeleteFileQuery;
+export type UploadFileParams = Omit<CreateFileRequest, 'file'> & { file: FileEntity };

apps/agentstack-ui/src/modules/files/types.ts

@@ -3,13 +3,13 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type { UploadFileResponse } from './api/types';
+import type { CreateFileResponse } from 'agentstack-sdk';
 
 export interface FileEntity {
   id: string;
   originalFile: File;
   status: FileStatus;
-  uploadFile?: UploadFileResponse;
+  uploadFile?: CreateFileResponse;
   error?: string;
 }