[Customer Portal][Web] Rename Filters Hook to Reflect Project-Wide Scope and update filters response types

apps/customer-portal/webapp/src/api/__tests__/useGetCasesFilters.test.tsx → apps/customer-portal/webapp/src/api/__tests__/useGetProjectFilters.test.tsx

@@ -17,7 +17,7 @@
 import { renderHook, waitFor } from "@testing-library/react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 
 const mockFiltersResponse = {
   statuses: [{ id: "1", label: "Open" }],
@@ -55,7 +55,7 @@ const wrapper = ({ children }: { children: React.ReactNode }) => (
   <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
 );
 
-describe("useGetCasesFilters", () => {
+describe("useGetProjectFilters", () => {
   beforeEach(() => {
     queryClient.clear();
     vi.clearAllMocks();
@@ -69,7 +69,7 @@ describe("useGetCasesFilters", () => {
   });
 
   it("should return filters from API", async () => {
-    const { result } = renderHook(() => useGetCasesFilters("123"), { wrapper });
+    const { result } = renderHook(() => useGetProjectFilters("123"), { wrapper });
 
     await waitFor(() => expect(result.current.isSuccess).toBe(true));
 
@@ -82,7 +82,7 @@ describe("useGetCasesFilters", () => {
       statusText: "Internal Server Error",
     });
 
-    const { result } = renderHook(() => useGetCasesFilters("123"), { wrapper });
+    const { result } = renderHook(() => useGetProjectFilters("123"), { wrapper });
 
     await waitFor(() => expect(result.current.isError).toBe(true));
     expect(result.current.error?.message).toContain("Internal Server Error");

apps/customer-portal/webapp/src/api/useGetCasesFilters.ts → apps/customer-portal/webapp/src/api/useGetProjectFilters.ts

@@ -22,12 +22,12 @@ import { useAuthApiClient } from "@context/AuthApiContext";
 import type { CaseMetadataResponse } from "@models/responses";
 
 /**
- * Custom hook to fetch case filters for a specific project.
+ * Custom hook to fetch all filters (cases, conversations, change requests, etc.) for a specific project.
  *
  * @param {string} projectId - The ID of the project to fetch filters for.
- * @returns {UseQueryResult<CaseMetadataResponse, Error>} The query result object.
+ * @returns {UseQueryResult<CaseMetadataResponse, Error>} The query result object containing all filter metadata.
  */
-export default function useGetCasesFilters(
+export default function useGetProjectFilters(
   projectId: string,
 ): UseQueryResult<CaseMetadataResponse, Error> {
   const logger = useLogger();
@@ -37,7 +37,7 @@ export default function useGetCasesFilters(
   return useQuery<CaseMetadataResponse, Error>({
     queryKey: [ApiQueryKeys.PROJECT_CASES, "filters", projectId],
     queryFn: async (): Promise<CaseMetadataResponse> => {
-      logger.debug(`Fetching case filters for project: ${projectId}`);
+      logger.debug(`Fetching project filters for project: ${projectId}`);
 
       try {
         const baseUrl = window.config?.CUSTOMER_PORTAL_BACKEND_BASE_URL;
@@ -52,15 +52,15 @@ export default function useGetCasesFilters(
 
         if (!response.ok) {
           throw new Error(
-            `Error fetching case filters: ${response.statusText}`,
+            `Error fetching project filters: ${response.statusText}`,
           );
         }
 
         const data: CaseMetadataResponse = await response.json();
-        logger.debug("[useGetCasesFilters] Data received:", data);
+        logger.debug("[useGetProjectFilters] Data received:", data);
         return data;
       } catch (error) {
-        logger.error("[useGetCasesFilters] Error:", error);
+        logger.error("[useGetProjectFilters] Error:", error);
         throw error;
       }
     },

apps/customer-portal/webapp/src/components/dashboard/cases-table/CasesTable.tsx

@@ -20,7 +20,7 @@ import { useNavigate } from "react-router";
 import { useAsgardeo } from "@asgardeo/react";
 import { getNoveraChatEnabled } from "@utils/settingsStorage";
 import { useGetProjectCasesPage } from "@api/useGetProjectCasesPage";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import FilterPopover, {
   type FilterField,
 } from "@components/common/filter-panel/FilterPopover";
@@ -46,7 +46,7 @@ const CasesTable = ({ projectId }: CasesTableProps): JSX.Element => {
     data: filtersMetadata,
     isFetching: isFetchingFilters,
     isError: isErrorFilters,
-  } = useGetCasesFilters(projectId);
+  } = useGetProjectFilters(projectId);
 
   const dynamicFilterFields: FilterField[] = [
     {

apps/customer-portal/webapp/src/components/dashboard/cases-table/__tests__/CasesTable.test.tsx

@@ -18,7 +18,7 @@ import { render, screen, waitFor, fireEvent } from "@testing-library/react";
 import { describe, expect, it, vi, beforeEach } from "vitest";
 import CasesTable from "@components/dashboard/cases-table/CasesTable";
 import { useGetProjectCasesPage } from "@api/useGetProjectCasesPage";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import { ThemeProvider, createTheme } from "@wso2/oxygen-ui";
 
 const mockNavigate = vi.fn();
@@ -29,7 +29,7 @@ vi.mock("react-router", () => ({
 }));
 
 vi.mock("@api/useGetProjectCasesPage");
-vi.mock("@api/useGetCasesFilters");
+vi.mock("@api/useGetProjectFilters");
 
 vi.mock("@asgardeo/react", () => ({
   useAsgardeo: () => ({
@@ -128,7 +128,7 @@ describe("CasesTable", () => {
   const theme = createTheme();
   const mockProjectId = "proj-123";
   const mockUseGetProjectCasesPage = vi.mocked(useGetProjectCasesPage);
-  const mockUseGetCasesFilters = vi.mocked(useGetCasesFilters);
+  const mockUseGetCasesFilters = vi.mocked(useGetProjectFilters);
 
   beforeEach(() => {
     vi.clearAllMocks();
@@ -141,7 +141,7 @@ describe("CasesTable", () => {
       data: undefined,
       isFetching: false,
       isError: false,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
   });
 
   it("should render correctly", () => {
@@ -326,7 +326,7 @@ describe("CasesTable", () => {
     mockUseGetCasesFilters.mockReturnValue({
       isFetching: true,
       isError: true,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(
       <ThemeProvider theme={theme}>

apps/customer-portal/webapp/src/components/project-details/deployments/AddDeploymentModal.tsx

@@ -41,7 +41,7 @@ import {
 } from "react";
 import type { SelectChangeEvent } from "@wso2/oxygen-ui";
 import { usePostCreateDeployment } from "@api/usePostCreateDeployment";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import ErrorIndicator from "@components/common/error-indicator/ErrorIndicator";
 import ErrorBanner from "@components/common/error-banner/ErrorBanner";
 
@@ -78,7 +78,7 @@ export default function AddDeploymentModal({
     data: filtersData,
     isLoading: isFiltersLoading,
     isError: isFiltersError,
-  } = useGetCasesFilters(projectId);
+  } = useGetProjectFilters(projectId);
 
   const deploymentTypes = filtersData?.deploymentTypes ?? [];
 

apps/customer-portal/webapp/src/components/project-details/deployments/EditDeploymentModal.tsx

@@ -37,7 +37,7 @@ import {
   type ChangeEvent,
   type JSX,
 } from "react";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import { usePatchDeployment } from "@api/usePatchDeployment";
 
 export interface EditDeploymentModalProps {
@@ -57,7 +57,7 @@ const INITIAL_FORM = {
 
 /**
  * Modal for editing a deployment (name, type, description). Always sends active: true.
- * Deployment type options come from useGetCasesFilters.
+ * Deployment type options come from useGetProjectFilters.
  *
  * @param {EditDeploymentModalProps} props - open, deployment, projectId, onClose, optional onSuccess/onError.
  * @returns {JSX.Element} The edit deployment modal.
@@ -71,7 +71,7 @@ export default function EditDeploymentModal({
   onError,
 }: EditDeploymentModalProps): JSX.Element {
   const { data: filtersData, isLoading: isFiltersLoading } =
-    useGetCasesFilters(projectId);
+    useGetProjectFilters(projectId);
   const patchDeployment = usePatchDeployment();
 
   const deploymentTypes = filtersData?.deploymentTypes ?? [];

apps/customer-portal/webapp/src/components/project-details/deployments/__tests__/AddDeploymentModal.test.tsx

@@ -18,10 +18,10 @@ import { render, screen, fireEvent } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import AddDeploymentModal from "@components/project-details/deployments/AddDeploymentModal";
 import { usePostCreateDeployment } from "@api/usePostCreateDeployment";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 
 vi.mock("@api/usePostCreateDeployment");
-vi.mock("@api/useGetCasesFilters");
+vi.mock("@api/useGetProjectFilters");
 
 let mockMutate: any;
 let defaultModalProps: any;
@@ -62,11 +62,11 @@ describe("AddDeploymentModal", () => {
       isPending: false,
     } as unknown as ReturnType<typeof usePostCreateDeployment>);
 
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: mockFiltersData,
       isLoading: false,
       isError: false,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
   });
 
   it("should render the modal with title and description", () => {
@@ -92,11 +92,11 @@ describe("AddDeploymentModal", () => {
   });
 
   it("should show skeleton while deployment types are loading", () => {
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: undefined,
       isLoading: true,
       isError: false,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(<AddDeploymentModal {...defaultModalProps} />);
 
@@ -105,23 +105,23 @@ describe("AddDeploymentModal", () => {
   });
 
   it("should show ErrorIndicator inside modal when deployment types fail to load", () => {
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: undefined,
       isLoading: false,
       isError: true,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(<AddDeploymentModal {...defaultModalProps} />);
 
     expect(screen.getByTestId("error-indicator")).toBeInTheDocument();
   });
 
   it("should show ErrorBanner outside modal when deployment types fail to load", () => {
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: undefined,
       isLoading: false,
       isError: true,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(<AddDeploymentModal {...defaultModalProps} />);
 
@@ -134,11 +134,11 @@ describe("AddDeploymentModal", () => {
   });
 
   it("should dismiss ErrorBanner when dismiss button is clicked", () => {
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: undefined,
       isLoading: false,
       isError: true,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(<AddDeploymentModal {...defaultModalProps} />);
 
@@ -157,11 +157,11 @@ describe("AddDeploymentModal", () => {
   });
 
   it("should disable Add Deployment button when filters failed to load", () => {
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: undefined,
       isLoading: false,
       isError: true,
-    } as unknown as ReturnType<typeof useGetCasesFilters>);
+    } as unknown as ReturnType<typeof useGetProjectFilters>);
 
     render(<AddDeploymentModal {...defaultModalProps} />);
 

apps/customer-portal/webapp/src/components/project-details/deployments/__tests__/EditDeploymentModal.test.tsx

@@ -17,11 +17,11 @@
 import { act, fireEvent, render, screen } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import EditDeploymentModal from "@components/project-details/deployments/EditDeploymentModal";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import { usePatchDeployment } from "@api/usePatchDeployment";
 import type { ProjectDeploymentItem } from "@models/responses";
 
-vi.mock("@api/useGetCasesFilters");
+vi.mock("@api/useGetProjectFilters");
 vi.mock("@api/usePatchDeployment");
 
 const mockDeployment: ProjectDeploymentItem = {
@@ -56,11 +56,11 @@ const defaultProps = {
 describe("EditDeploymentModal", () => {
   beforeEach(() => {
     vi.clearAllMocks();
-    vi.mocked(useGetCasesFilters).mockReturnValue({
+    vi.mocked(useGetProjectFilters).mockReturnValue({
       data: mockFiltersData,
       isLoading: false,
       isError: false,
-    } as ReturnType<typeof useGetCasesFilters>);
+    } as ReturnType<typeof useGetProjectFilters>);
     vi.mocked(usePatchDeployment).mockReturnValue({
       mutateAsync: vi.fn().mockResolvedValue(undefined),
       isPending: false,

apps/customer-portal/webapp/src/components/security/SecurityReportAnalysis.tsx

@@ -55,7 +55,7 @@ import {
 import { useNavigate, useParams } from "react-router";
 import { CaseType } from "@constants/supportConstants";
 import useGetProjectCases from "@api/useGetProjectCases";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import useGetUserDetails from "@api/useGetUserDetails";
 import type { AllCasesFilterValues, CaseListItem } from "@models/responses";
 import SecurityReportAnalysisSkeleton from "@components/security/SecurityReportAnalysisSkeleton";
@@ -90,7 +90,7 @@ const SecurityReportAnalysis = (): JSX.Element => {
   const { data: currentUser } = useGetUserDetails();
 
   // Fetch filter metadata
-  const { data: filterMetadata } = useGetCasesFilters(projectId || "");
+  const { data: filterMetadata } = useGetProjectFilters(projectId || "");
 
   // Build case search request for security report analysis cases
   const caseSearchRequest = useMemo(

apps/customer-portal/webapp/src/components/support/case-details/details-tab/__tests__/CaseDetailsContent.test.tsx

@@ -50,7 +50,7 @@ const mockCaseDetails = {
   findingsTotal: null,
 };
 
-vi.mock("@api/useGetCasesFilters", () => ({
+vi.mock("@api/useGetProjectFilters", () => ({
   default: () => ({
     data: { caseStates: [{ id: "3", label: "Closed" }] },
   }),

apps/customer-portal/webapp/src/components/support/case-details/header/CaseDetailsActionRow.tsx

@@ -34,7 +34,7 @@ import {
   CASE_STATUS_ACTIONS,
   type CaseStatusPaletteIntent,
 } from "@constants/supportConstants";
-import useGetCasesFilters from "@api/useGetCasesFilters";
+import useGetProjectFilters from "@api/useGetProjectFilters";
 import { usePatchCase } from "@api/usePatchCase";
 import { useErrorBanner } from "@context/error-banner/ErrorBannerContext";
 import { useSuccessBanner } from "@context/success-banner/SuccessBannerContext";
@@ -79,7 +79,7 @@ export interface CaseDetailsActionRowProps {
   /** When case is closed, used to hide "Open Related Case" after 2 months. */
   closedOn?: string | null;
   onOpenRelatedCase?: () => void;
-  /** Project ID for useGetCasesFilters and usePatchCase. */
+  /** Project ID for useGetProjectFilters and usePatchCase. */
   projectId?: string;
   /** Case ID for PATCH case state. */
   caseId?: string;
@@ -95,7 +95,7 @@ export interface CaseDetailsActionRowProps {
 /**
  * Resolves stateKey for an action by looking up caseState in caseStates.
  * @param actionLabel - Action label (e.g. "Closed", "Accept Solution").
- * @param caseStates - caseStates from useGetCasesFilters.
+ * @param caseStates - caseStates from useGetProjectFilters.
  * @returns stateKey as number, or undefined if not found.
  */
 function getStateKeyForAction(
@@ -126,7 +126,7 @@ export default function CaseDetailsActionRow({
   const theme = useTheme();
   const hasEngineer = !!getAssignedEngineerLabel(assignedEngineer);
 
-  const { data: filterMetadata } = useGetCasesFilters(projectId);
+  const { data: filterMetadata } = useGetProjectFilters(projectId);
   const caseStates = filterMetadata?.caseStates;
 
   const { showSuccess } = useSuccessBanner();

apps/customer-portal/webapp/src/components/support/case-details/header/__tests__/CaseDetailsActionRow.test.tsx

@@ -19,7 +19,7 @@ import { describe, expect, it, vi } from "vitest";
 import CaseDetailsActionRow from "@case-details/CaseDetailsActionRow";
 import { ThemeProvider, createTheme } from "@wso2/oxygen-ui";
 
-vi.mock("@api/useGetCasesFilters", () => ({
+vi.mock("@api/useGetProjectFilters", () => ({
   default: () => ({
     data: {
       caseStates: [

apps/customer-portal/webapp/src/constants/supportConstants.ts

@@ -451,7 +451,7 @@ export const ALL_CONVERSATIONS_FILTER_DEFINITIONS: AllConversationsFilterDefinit
 
 /**
  * Configuration for the all cases filters.
- * Uses caseStates, caseTypes, severities, issueTypes, deploymentTypes from useGetCasesFilters.
+ * Uses caseStates, caseTypes, severities, issueTypes, deploymentTypes from useGetProjectFilters.
  */
 export const ALL_CASES_FILTER_DEFINITIONS: AllCasesFilterDefinition[] = [
   {