fix: stabilize companies and form6k page data handling

Author: danielsobrado

frontend/src/app/api/client.ts

@@ -39,23 +39,23 @@ class ApiClient {
   }
 
   async get<T>(url: string, config?: AxiosRequestConfig): Promise<T> {
-    const response = await this.client.get<ApiResponse<T>>(url, config);
-    return response.data.data;
+    const response = await this.client.get<ApiResponse<T> | T>(url, config);
+    return this.unwrapResponse<T>(response.data);
   }
 
   async post<T>(url: string, data?: unknown, config?: AxiosRequestConfig): Promise<T> {
-    const response = await this.client.post<ApiResponse<T>>(url, data, config);
-    return response.data.data;
+    const response = await this.client.post<ApiResponse<T> | T>(url, data, config);
+    return this.unwrapResponse<T>(response.data);
   }
 
   async put<T>(url: string, data?: unknown, config?: AxiosRequestConfig): Promise<T> {
-    const response = await this.client.put<ApiResponse<T>>(url, data, config);
-    return response.data.data;
+    const response = await this.client.put<ApiResponse<T> | T>(url, data, config);
+    return this.unwrapResponse<T>(response.data);
   }
 
   async delete<T>(url: string, config?: AxiosRequestConfig): Promise<T> {
-    const response = await this.client.delete<ApiResponse<T>>(url, config);
-    return response.data.data;
+    const response = await this.client.delete<ApiResponse<T> | T>(url, config);
+    return this.unwrapResponse<T>(response.data);
   }
 
   async downloadFile(url: string, data?: unknown): Promise<Blob> {
@@ -68,6 +68,18 @@ class ApiClient {
   getBaseUrl(): string {
     return API_BASE_URL;
   }
+
+  private unwrapResponse<T>(payload: ApiResponse<T> | T): T {
+    if (
+      payload !== null &&
+      typeof payload === 'object' &&
+      'success' in payload &&
+      'data' in payload
+    ) {
+      return (payload as ApiResponse<T>).data;
+    }
+    return payload as T;
+  }
 }
 
 export const apiClient = new ApiClient();

frontend/src/app/hooks/useCompanies.ts

@@ -1,20 +1,33 @@
 import { useState, useEffect, useCallback } from 'react';
-import { companiesApi, Company, CompanyListItem, CompanySearchRequest, Filing, PaginatedResponse } from '../api';
+import { companiesApi, Company, CompanyListItem, CompanySearchRequest, Filing } from '../api';
 
 export function useCompanies(initialParams: CompanySearchRequest = {}) {
-  const [companies, setCompanies] = useState<PaginatedResponse<CompanyListItem> | null>(null);
+  const [companies, setCompanies] = useState<CompanyListItem[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
-  const [params, setParams] = useState<CompanySearchRequest>(initialParams);
+  const [totalElements, setTotalElements] = useState(0);
+  const [totalPages, setTotalPages] = useState(0);
+  const [params, setParams] = useState<CompanySearchRequest>({
+    page: 0,
+    size: 20,
+    sortBy: 'name',
+    sortDir: 'asc',
+    ...initialParams,
+  });
 
   const fetchCompanies = useCallback(async (searchParams: CompanySearchRequest) => {
     setLoading(true);
     setError(null);
     try {
       const data = await companiesApi.getCompanies(searchParams);
-      setCompanies(data);
+      setCompanies(data?.content ?? []);
+      setTotalElements(data?.totalElements ?? 0);
+      setTotalPages(data?.totalPages ?? 0);
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Failed to load companies');
+      setCompanies([]);
+      setTotalElements(0);
+      setTotalPages(0);
     } finally {
       setLoading(false);
     }
@@ -24,8 +37,13 @@ export function useCompanies(initialParams: CompanySearchRequest = {}) {
     fetchCompanies(params);
   }, [params, fetchCompanies]);
 
-  const search = useCallback((searchTerm: string) => {
-    setParams(prev => ({ ...prev, searchTerm, page: 0 }));
+  const search = useCallback((searchInput: CompanySearchRequest & { name?: string }) => {
+    setParams(prev => ({
+      ...prev,
+      ...searchInput,
+      searchTerm: searchInput.searchTerm ?? searchInput.name ?? prev.searchTerm,
+      page: searchInput.page ?? 0,
+    }));
   }, []);
 
   const setPage = useCallback((page: number) => {
@@ -44,6 +62,8 @@ export function useCompanies(initialParams: CompanySearchRequest = {}) {
     companies,
     loading,
     error,
+    totalElements,
+    totalPages,
     params,
     search,
     setPage,
@@ -95,23 +115,29 @@ export function useCompanyByCik(cik: string | undefined) {
   return { company, loading, error };
 }
 
-export function useCompanyFilings(companyId: string | undefined, page: number = 0, size: number = 10) {
-  const [filings, setFilings] = useState<PaginatedResponse<Filing> | null>(null);
-  const [loading, setLoading] = useState(true);
+export function useCompanyFilings() {
+  const [filings, setFilings] = useState<Filing[]>([]);
+  const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
-  useEffect(() => {
-    if (!companyId) {
-      setLoading(false);
+  const fetchByCompany = useCallback(async (cik: string, page: number = 0, size: number = 10) => {
+    if (!cik) {
+      setFilings([]);
       return;
     }
 
     setLoading(true);
-    companiesApi.getCompanyFilings(companyId, page, size)
-      .then(setFilings)
-      .catch(err => setError(err.message))
-      .finally(() => setLoading(false));
-  }, [companyId, page, size]);
+    setError(null);
+    try {
+      const data = await companiesApi.getCompanyFilingsByCik(cik, page, size);
+      setFilings(data?.content ?? []);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to load company filings');
+      setFilings([]);
+    } finally {
+      setLoading(false);
+    }
+  }, []);
 
-  return { filings, loading, error };
+  return { filings, loading, error, fetchByCompany };
 }

frontend/src/app/hooks/useForm6K.ts

@@ -118,9 +118,9 @@ export function useForm6KSearch() {
     setError(null);
     try {
       const data = await form6kApi.getByCik(cik, page, size);
-      setFilings(data.content);
-      setTotalElements(data.totalElements);
-      setTotalPages(data.totalPages);
+      setFilings(data?.content ?? []);
+      setTotalElements(data?.totalElements ?? 0);
+      setTotalPages(data?.totalPages ?? 0);
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Failed to search filings');
     } finally {
@@ -133,9 +133,9 @@ export function useForm6KSearch() {
     setError(null);
     try {
       const data = await form6kApi.getBySymbol(symbol, page, size);
-      setFilings(data.content);
-      setTotalElements(data.totalElements);
-      setTotalPages(data.totalPages);
+      setFilings(data?.content ?? []);
+      setTotalElements(data?.totalElements ?? 0);
+      setTotalPages(data?.totalPages ?? 0);
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Failed to search filings');
     } finally {
@@ -148,9 +148,9 @@ export function useForm6KSearch() {
     setError(null);
     try {
       const data = await form6kApi.getByDateRange(startDate, endDate, page, size);
-      setFilings(data.content);
-      setTotalElements(data.totalElements);
-      setTotalPages(data.totalPages);
+      setFilings(data?.content ?? []);
+      setTotalElements(data?.totalElements ?? 0);
+      setTotalPages(data?.totalPages ?? 0);
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Failed to search filings');
     } finally {

frontend/src/app/pages/Form6K.tsx

@@ -226,7 +226,9 @@ export function Form6KPage() {
 
   const loading = recentLoading || searchLoading;
   const error = recentError || searchError;
-  const displayFilings = hasSearched ? searchResults : recentFilings;
+  const displayFilings = hasSearched
+    ? (Array.isArray(searchResults) ? searchResults : [])
+    : (Array.isArray(recentFilings) ? recentFilings : []);
 
   return (
     <div className="space-y-6">