@htlkg/data 0.0.19 → 0.0.21

package/src/hooks/createDataHook.test.ts

@@ -0,0 +1,534 @@
+/**
+ * createDataHook Tests
+ *
+ * Tests for the proxy-based data hook factory that creates
+ * Vue composables for fetching data from GraphQL models.
+ */
+
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { ref, computed, nextTick } from "vue";
+import {
+	createDataHook,
+	resetClientInstance,
+	type BaseHookOptions,
+	type CreateDataHookOptions,
+} from "./createDataHook";
+
+// Mock Vue's onMounted to execute immediately for testing
+vi.mock("vue", async () => {
+	const actual = await vi.importActual("vue");
+	return {
+		...actual,
+		onMounted: vi.fn((callback: () => void) => callback()),
+	};
+});
+
+// Mock the proxy module
+vi.mock("../client/proxy", () => ({
+	query: vi.fn(),
+	hasErrors: vi.fn((response: any) => !!(response.errors && response.errors.length > 0)),
+	getErrorMessage: vi.fn((response: any) => response.errors?.[0]?.message || null),
+}));
+
+// Import the mocked functions for assertions
+import { query } from "../client/proxy";
+
+interface MockItem {
+	id: string;
+	name: string;
+	status: "active" | "inactive";
+	accountId?: string;
+}
+
+describe("createDataHook", () => {
+	const mockItems: MockItem[] = [
+		{ id: "1", name: "Item 1", status: "active", accountId: "acc-1" },
+		{ id: "2", name: "Item 2", status: "inactive", accountId: "acc-1" },
+		{ id: "3", name: "Item 3", status: "active", accountId: "acc-2" },
+	];
+
+	beforeEach(() => {
+		vi.clearAllMocks();
+		// Default successful response
+		(query as any).mockResolvedValue({
+			data: mockItems,
+			errors: null,
+		});
+	});
+
+	describe("basic functionality", () => {
+		it("should create a hook function", () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			expect(typeof useItems).toBe("function");
+		});
+
+		it("should return reactive state refs", () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+
+			expect(result.data).toBeDefined();
+			expect(result.loading).toBeDefined();
+			expect(result.error).toBeDefined();
+			expect(result.refetch).toBeDefined();
+			expect(typeof result.refetch).toBe("function");
+		});
+
+		it("should auto-fetch data on mount by default", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			useItems();
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {});
+		});
+
+		it("should not auto-fetch when autoFetch is false", () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			useItems({ autoFetch: false });
+
+			expect(query).not.toHaveBeenCalled();
+		});
+
+		it("should populate data on successful fetch", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+
+			// Wait for async operation
+			await nextTick();
+
+			expect(result.data.value).toEqual(mockItems);
+			expect(result.loading.value).toBe(false);
+			expect(result.error.value).toBeNull();
+		});
+
+		it("should set error on fetch failure", async () => {
+			(query as any).mockResolvedValue({
+				data: null,
+				errors: [{ message: "Query failed" }],
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.error.value).toBeInstanceOf(Error);
+			expect(result.error.value?.message).toBe("Query failed");
+			expect(result.data.value).toEqual([]);
+		});
+
+		it("should handle network errors", async () => {
+			(query as any).mockRejectedValue(new Error("Network error"));
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.error.value).toBeInstanceOf(Error);
+			expect(result.error.value?.message).toBe("Network error");
+		});
+	});
+
+	describe("query options", () => {
+		it("should pass limit to query", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				defaultLimit: 50,
+			});
+
+			useItems({ limit: 100 });
+
+			expect(query).toHaveBeenCalledWith("Item", "list", { limit: 100 });
+		});
+
+		it("should use default limit when not specified", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				defaultLimit: 50,
+			});
+
+			useItems();
+
+			expect(query).toHaveBeenCalledWith("Item", "list", { limit: 50 });
+		});
+
+		it("should pass filter to query", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const filter = { status: { eq: "active" } };
+			useItems({ filter });
+
+			expect(query).toHaveBeenCalledWith("Item", "list", { filter });
+		});
+
+		it("should pass selectionSet to query", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				selectionSet: ["id", "name", "status"],
+			});
+
+			useItems();
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {
+				selectionSet: ["id", "name", "status"],
+			});
+		});
+
+		it("should combine all query options", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				defaultLimit: 50,
+				selectionSet: ["id", "name"],
+			});
+
+			const filter = { status: { eq: "active" } };
+			useItems({ filter, limit: 25 });
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {
+				filter,
+				limit: 25,
+				selectionSet: ["id", "name"],
+			});
+		});
+	});
+
+	describe("custom filter builder", () => {
+		interface UseItemsOptions extends BaseHookOptions {
+			accountId?: string;
+			activeOnly?: boolean;
+		}
+
+		it("should use buildFilter to construct filters", async () => {
+			const useItems = createDataHook<MockItem, UseItemsOptions>({
+				model: "Item",
+				buildFilter: (options) => {
+					const filter: any = {};
+					if (options.accountId) {
+						filter.accountId = { eq: options.accountId };
+					}
+					if (options.activeOnly) {
+						filter.status = { eq: "active" };
+					}
+					return Object.keys(filter).length > 0 ? filter : undefined;
+				},
+			});
+
+			useItems({ accountId: "acc-123", activeOnly: true });
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {
+				filter: {
+					accountId: { eq: "acc-123" },
+					status: { eq: "active" },
+				},
+			});
+		});
+
+		it("should return undefined filter when buildFilter returns empty", async () => {
+			const useItems = createDataHook<MockItem, UseItemsOptions>({
+				model: "Item",
+				buildFilter: () => undefined,
+			});
+
+			useItems({});
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {});
+		});
+	});
+
+	describe("data transformation", () => {
+		it("should apply transform function to fetched items", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				transform: (item) => ({
+					...item,
+					name: item.name.toUpperCase(),
+				}),
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.data.value[0].name).toBe("ITEM 1");
+			expect(result.data.value[1].name).toBe("ITEM 2");
+		});
+
+		it("should handle transform errors gracefully", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				transform: () => {
+					throw new Error("Transform error");
+				},
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.error.value).toBeInstanceOf(Error);
+			expect(result.error.value?.message).toBe("Transform error");
+		});
+	});
+
+	describe("computed properties", () => {
+		it("should create computed properties from config", async () => {
+			const useItems = createDataHook<MockItem, BaseHookOptions, { activeItems: MockItem[] }>({
+				model: "Item",
+				computedProperties: {
+					activeItems: (items) => items.filter((item) => item.status === "active"),
+				},
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.computed.activeItems.value).toHaveLength(2);
+			expect(result.computed.activeItems.value.every((i) => i.status === "active")).toBe(true);
+		});
+
+		it("should expose computed properties at top level for backwards compatibility", async () => {
+			const useItems = createDataHook<MockItem, BaseHookOptions, { activeItems: MockItem[] }>({
+				model: "Item",
+				computedProperties: {
+					activeItems: (items) => items.filter((item) => item.status === "active"),
+				},
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			// Should be accessible at top level
+			expect(result.activeItems).toBeDefined();
+			expect(result.activeItems.value).toHaveLength(2);
+		});
+
+		it("should support multiple computed properties", async () => {
+			const useItems = createDataHook<
+				MockItem,
+				BaseHookOptions,
+				{ activeItems: MockItem[]; inactiveItems: MockItem[]; totalCount: number }
+			>({
+				model: "Item",
+				computedProperties: {
+					activeItems: (items) => items.filter((item) => item.status === "active"),
+					inactiveItems: (items) => items.filter((item) => item.status === "inactive"),
+					totalCount: (items) => items.length,
+				},
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.computed.activeItems.value).toHaveLength(2);
+			expect(result.computed.inactiveItems.value).toHaveLength(1);
+			expect(result.computed.totalCount.value).toBe(3);
+		});
+	});
+
+	describe("custom data property name", () => {
+		it("should expose data with custom property name", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+				dataPropertyName: "items",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.items).toBeDefined();
+			expect(result.items.value).toEqual(mockItems);
+			// Original data property should still exist
+			expect(result.data.value).toEqual(mockItems);
+		});
+	});
+
+	describe("refetch functionality", () => {
+		it("should refetch data when refetch is called", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(query).toHaveBeenCalledTimes(1);
+
+			await result.refetch();
+
+			expect(query).toHaveBeenCalledTimes(2);
+		});
+
+		it("should update data after refetch", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			const newItems = [{ id: "4", name: "New Item", status: "active" as const }];
+			(query as any).mockResolvedValue({
+				data: newItems,
+				errors: null,
+			});
+
+			await result.refetch();
+
+			expect(result.data.value).toEqual(newItems);
+		});
+
+		it("should clear previous error on successful refetch", async () => {
+			(query as any).mockResolvedValueOnce({
+				data: null,
+				errors: [{ message: "First error" }],
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.error.value).not.toBeNull();
+
+			(query as any).mockResolvedValue({
+				data: mockItems,
+				errors: null,
+			});
+
+			await result.refetch();
+
+			expect(result.error.value).toBeNull();
+			expect(result.data.value).toEqual(mockItems);
+		});
+
+		it("should set loading state during refetch", async () => {
+			let resolveQuery: (value: any) => void;
+			(query as any).mockReturnValue(
+				new Promise((resolve) => {
+					resolveQuery = resolve;
+				}),
+			);
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems({ autoFetch: false });
+
+			expect(result.loading.value).toBe(false);
+
+			const refetchPromise = result.refetch();
+
+			expect(result.loading.value).toBe(true);
+
+			resolveQuery!({ data: mockItems, errors: null });
+			await refetchPromise;
+
+			expect(result.loading.value).toBe(false);
+		});
+	});
+
+	describe("resetClientInstance", () => {
+		it("should be a no-op function (proxy-based approach)", () => {
+			// Should not throw
+			expect(() => resetClientInstance()).not.toThrow();
+		});
+	});
+
+	describe("edge cases", () => {
+		it("should handle empty data response", async () => {
+			(query as any).mockResolvedValue({
+				data: [],
+				errors: null,
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.data.value).toEqual([]);
+			expect(result.error.value).toBeNull();
+		});
+
+		it("should handle null data response", async () => {
+			(query as any).mockResolvedValue({
+				data: null,
+				errors: null,
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.data.value).toEqual([]);
+		});
+
+		it("should handle undefined data response", async () => {
+			(query as any).mockResolvedValue({
+				data: undefined,
+				errors: null,
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.data.value).toEqual([]);
+		});
+
+		it("should not pass empty filter object", async () => {
+			const useItems = createDataHook<MockItem>({
+				model: "Item",
+			});
+
+			useItems({ filter: {} });
+
+			expect(query).toHaveBeenCalledWith("Item", "list", {});
+		});
+
+		it("should generate default error message when getErrorMessage returns null", async () => {
+			(query as any).mockResolvedValue({
+				data: null,
+				errors: [{}], // Error without message
+			});
+
+			const useItems = createDataHook<MockItem>({
+				model: "TestModel",
+			});
+
+			const result = useItems();
+			await nextTick();
+
+			expect(result.error.value?.message).toBe("Failed to fetch TestModel");
+		});
+	});
+});

package/src/hooks/createDataHook.ts

@@ -6,7 +6,7 @@
  */
 
 import { ref, computed, onMounted, type Ref, type ComputedRef } from "vue";
-import { getSharedClient, resetSharedClient } from "../client";
+import { query, hasErrors, getErrorMessage } from "../client/proxy";
 
 /**
  * Configuration options for creating a data hook
@@ -56,8 +56,10 @@ export interface DataHookReturn<T, TComputed extends Record<string, any> = Recor
 	computed: { [K in keyof TComputed]: ComputedRef<TComputed[K]> };
 }
 
-// Re-export resetSharedClient for testing convenience
-export { resetSharedClient as resetClientInstance };
+// Reset function for testing convenience (no-op with proxy-based approach)
+export function resetClientInstance(): void {
+	// No-op: proxy-based approach doesn't need client reset
+}
 
 /**
  * Creates a reusable data hook for a specific model
@@ -132,29 +134,34 @@ export function createDataHook<
 			return baseFilter && Object.keys(baseFilter).length > 0 ? baseFilter : undefined;
 		};
 
-		// Fetch function
+		// Fetch function using server proxy
 		async function fetch() {
 			loading.value = true;
 			error.value = null;
 
 			try {
-				const client = getSharedClient();
-				const queryOptions: any = {
-					filter: getFilter(),
-					limit,
-				};
+				const queryOptions: Record<string, any> = {};
+
+				const filter = getFilter();
+				if (filter) {
+					queryOptions.filter = filter;
+				}
+
+				if (limit) {
+					queryOptions.limit = limit;
+				}
 
 				if (selectionSet) {
 					queryOptions.selectionSet = selectionSet;
 				}
 
-				const { data: responseData, errors } = await (client as any).models[model].list(queryOptions);
+				const response = await query(model, "list", queryOptions);
 
-				if (errors) {
-					throw new Error(errors[0]?.message || `Failed to fetch ${model}`);
+				if (hasErrors(response)) {
+					throw new Error(getErrorMessage(response) || `Failed to fetch ${model}`);
 				}
 
-				const items = responseData || [];
+				const items = response.data || [];
 				data.value = transform ? items.map(transform) : items;
 			} catch (e) {
 				error.value = e as Error;

package/src/hooks/index.ts

@@ -20,3 +20,5 @@ export { useAccounts, type UseAccountsOptions, type UseAccountsReturn } from "./
 export { useUsers, type UseUsersOptions, type UseUsersReturn } from "./useUsers";
 export { useProducts, type UseProductsOptions, type UseProductsReturn } from "./useProducts";
 export { useProductInstances, type UseProductInstancesOptions, type UseProductInstancesReturn } from "./useProductInstances";
+export { useReservations, type UseReservationsOptions, type UseReservationsReturn } from "./useReservations";
+export { useContacts, type UseContactsOptions, type UseContactsReturn } from "./useContacts";