@izumisy-tailor/tailor-data-viewer 0.2.14 → 0.2.16

package/src/component/data-table/use-data-table.test.ts

@@ -51,7 +51,12 @@ const testData: CollectionResult<TestRow> = {
     { node: { id: "2", name: "Bob", status: "INACTIVE", amount: 200 } },
     { node: { id: "3", name: "Charlie", status: "ACTIVE", amount: 300 } },
   ],
-  pageInfo: { hasNextPage: true, endCursor: "cursor-3" },
+  pageInfo: {
+    hasNextPage: true,
+    endCursor: "cursor-3",
+    hasPreviousPage: false,
+    startCursor: "cursor-1",
+  },
 };
 
 describe("useDataTable", () => {
@@ -95,6 +100,8 @@ describe("useDataTable", () => {
       expect(result.current.pageInfo).toEqual({
         hasNextPage: true,
         endCursor: "cursor-3",
+        hasPreviousPage: false,
+        startCursor: "cursor-1",
       });
     });
   });

package/src/component/data-table/use-data-table.ts

@@ -59,9 +59,23 @@ export function useDataTable<TRow extends Record<string, unknown>>(
   }, [sourceRows]);
 
   const pageInfo = useMemo<PageInfo>(() => {
-    return data?.pageInfo ?? { hasNextPage: false, endCursor: null };
+    return (
+      data?.pageInfo ?? {
+        hasNextPage: false,
+        endCursor: null,
+        hasPreviousPage: false,
+        startCursor: null,
+      }
+    );
   }, [data]);
 
+  // Sync pageInfo to collection so hasPrevPage/hasNextPage are up-to-date
+  useMemo(() => {
+    if (data?.pageInfo) {
+      collection?.setPageInfo(data.pageInfo);
+    }
+  }, [data?.pageInfo, collection]);
+
   // ---------------------------------------------------------------------------
   // Column visibility management
   // ---------------------------------------------------------------------------
@@ -111,11 +125,15 @@ export function useDataTable<TRow extends Record<string, unknown>>(
     [collection],
   );
 
-  const prevPage = useCallback(() => {
-    collection?.prevPage();
-  }, [collection]);
+  const prevPage = useCallback(
+    (startCursor: string) => {
+      collection?.prevPage(startCursor);
+    },
+    [collection],
+  );
 
   const hasPrevPage = collection?.hasPrevPage ?? false;
+  const hasNextPage = collection?.hasNextPage ?? false;
 
   // ---------------------------------------------------------------------------
   // Row Operations (Optimistic Updates)
@@ -240,6 +258,7 @@ export function useDataTable<TRow extends Record<string, unknown>>(
     nextPage,
     prevPage,
     hasPrevPage,
+    hasNextPage,
 
     // Column management
     columns: allColumns,

package/src/component/field-helpers.test.ts

@@ -2,7 +2,7 @@ import { describe, it, expect, expectTypeOf } from "vitest";
 import { createColumnHelper, inferColumnHelper } from "./field-helpers";
 import type { TableMetadataMap } from "../generator/metadata-generator";
 import { fieldTypeToSortConfig, fieldTypeToFilterConfig } from "./types";
-import type { NodeType } from "./types";
+import type { NodeType, TableFieldName } from "./types";
 
 describe("NodeType", () => {
   it("extracts node type from a collection result", () => {
@@ -167,10 +167,7 @@ describe("inferColumnHelper()", () => {
   } as const satisfies TableMetadataMap;
 
   it("creates a column with auto-detected sort/filter", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
 
     const titleCol = column("title");
     expect(titleCol.kind).toBe("field");
@@ -180,10 +177,7 @@ describe("inferColumnHelper()", () => {
   });
 
   it("auto-detects enum options", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const statusCol = column("status");
     expect(statusCol.filter).toEqual({
       type: "enum",
@@ -198,60 +192,42 @@ describe("inferColumnHelper()", () => {
   });
 
   it("auto-detects date type", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const dateCol = column("dueDate");
     expect(dateCol.sort).toEqual({ type: "date" });
     expect(dateCol.filter).toEqual({ type: "date" });
   });
 
   it("disables sort with sort: false", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const col = column("title", { sort: false });
     expect(col.sort).toBeUndefined();
     expect(col.filter).toEqual({ type: "string" });
   });
 
   it("disables filter with filter: false", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const col = column("title", { filter: false });
     expect(col.sort).toEqual({ type: "string" });
     expect(col.filter).toBeUndefined();
   });
 
   it("uuid has no sort, has uuid filter", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const col = column("id");
     expect(col.sort).toBeUndefined();
     expect(col.filter).toEqual({ type: "uuid" });
   });
 
   it("array type has no sort/filter", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     const col = column("tags");
     expect(col.sort).toBeUndefined();
     expect(col.filter).toBeUndefined();
   });
 
   it("columns() creates multiple columns at once", () => {
-    const { columns } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { columns } = inferColumnHelper(testMetadata.task);
     const cols = columns(["title", "status", "dueDate"]);
     expect(cols).toHaveLength(3);
     expect(cols[0].dataKey).toBe("title");
@@ -260,10 +236,7 @@ describe("inferColumnHelper()", () => {
   });
 
   it("columns() applies overrides", () => {
-    const { columns } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { columns } = inferColumnHelper(testMetadata.task);
     const cols = columns(["title", "status"], {
       overrides: {
         title: { label: "Custom Title", width: 300 },
@@ -274,10 +247,7 @@ describe("inferColumnHelper()", () => {
   });
 
   it("columns() applies global sort/filter options", () => {
-    const { columns } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { columns } = inferColumnHelper(testMetadata.task);
     const cols = columns(["title", "status"], { sort: false });
     expect(cols[0].sort).toBeUndefined();
     expect(cols[1].sort).toBeUndefined();
@@ -286,13 +256,17 @@ describe("inferColumnHelper()", () => {
   });
 
   it("throws for non-existent field", () => {
-    const { column } = inferColumnHelper({
-      metadata: testMetadata,
-      tableName: "task",
-    });
+    const { column } = inferColumnHelper(testMetadata.task);
     // @ts-expect-error - intentionally testing invalid field name
     expect(() => column("nonExistent")).toThrow(
       'Field "nonExistent" not found in table "task" metadata',
     );
   });
+
+  it("infers TableFieldName type correctly", () => {
+    type TaskFieldNames = TableFieldName<(typeof testMetadata)["task"]>;
+    expectTypeOf<TaskFieldNames>().toEqualTypeOf<
+      "id" | "title" | "status" | "dueDate" | "count" | "isActive" | "tags"
+    >();
+  });
 });

package/src/component/field-helpers.ts

@@ -1,11 +1,11 @@
-import type { TableMetadataMap } from "../generator/metadata-generator";
+import type { TableMetadata } from "../generator/metadata-generator";
 import type {
   CellRenderer,
   DisplayColumn,
   DisplayColumnOptions,
   FieldColumn,
   FieldColumnOptions,
-  FieldName,
+  TableFieldName,
   FilterConfig,
   MetadataFieldOptions,
   MetadataFieldsOptions,
@@ -130,16 +130,13 @@ export function createColumnHelper<TRow extends Record<string, unknown>>(): {
  * Automatically infers sort/filter configuration from field types,
  * including enum options.
  *
- * @param options - Object containing `metadata` (the generated map) and `tableName`.
+ * @param tableMetadata - A single table metadata object from the generated map.
  *
  * @example
  * ```tsx
  * import { tableMetadata } from "./generated/data-viewer-metadata.generated";
  *
- * const { column, columns } = inferColumnHelper({
- *   metadata: tableMetadata,
- *   tableName: "task",
- * });
+ * const { column, columns } = inferColumnHelper(tableMetadata.task);
  *
  * const taskColumns = [
  *   column("title"),           // sort/filter auto-detected
@@ -149,35 +146,29 @@ export function createColumnHelper<TRow extends Record<string, unknown>>(): {
  * ];
  * ```
  */
-export function inferColumnHelper<
-  const TMetadata extends TableMetadataMap,
-  TTableName extends string & keyof TMetadata,
->(options: {
-  metadata: TMetadata;
-  tableName: TTableName;
-}): {
+export function inferColumnHelper<const TTable extends TableMetadata>(
+  tableMetadata: TTable,
+): {
   column: (
-    dataKey: FieldName<TMetadata, TTableName>,
+    dataKey: TableFieldName<TTable>,
     options?: MetadataFieldOptions,
   ) => FieldColumn<Record<string, unknown>>;
 
   columns: (
-    dataKeys: FieldName<TMetadata, TTableName>[],
+    dataKeys: TableFieldName<TTable>[],
     options?: MetadataFieldsOptions,
   ) => FieldColumn<Record<string, unknown>>[];
 } {
-  const { metadata, tableName } = options;
-  const tableMeta = metadata[tableName];
-  const fields = tableMeta.fields;
+  const fields = tableMetadata.fields;
 
   const column = (
-    dataKey: FieldName<TMetadata, TTableName>,
+    dataKey: TableFieldName<TTable>,
     columnOptions?: MetadataFieldOptions,
   ): FieldColumn<Record<string, unknown>> => {
     const fieldMeta = fields.find((f) => f.name === dataKey);
     if (!fieldMeta) {
       throw new Error(
-        `Field "${String(dataKey)}" not found in table "${String(tableName)}" metadata`,
+        `Field "${String(dataKey)}" not found in table "${tableMetadata.name}" metadata`,
       );
     }
 
@@ -213,7 +204,7 @@ export function inferColumnHelper<
   };
 
   const columnsHelper = (
-    dataKeys: FieldName<TMetadata, TTableName>[],
+    dataKeys: TableFieldName<TTable>[],
     options?: MetadataFieldsOptions,
   ): FieldColumn<Record<string, unknown>>[] => {
     return dataKeys.map((dataKey) => {

package/src/component/index.ts

@@ -5,7 +5,6 @@ export type {
   SelectOption,
   FilterOperator,
   Filter,
-  MetadataFilter,
   SortState,
   PageInfo,
   QueryVariables,
@@ -28,7 +27,9 @@ export type {
   DataTableRowProps,
   DataTableCellProps,
   FieldName,
+  TableFieldName,
   OrderableFieldName,
+  TableOrderableFieldName,
   ExtractOrderField,
   ExtractQueryVariables,
   ExtractQueryInputKeys,
@@ -37,6 +38,8 @@ export type {
   MatchingTableName,
   MetadataFieldOptions,
   MetadataFieldsOptions,
+  MetadataFilter,
+  TableMetadataFilter,
   ColumnSelectorProps,
   CsvButtonProps,
   SearchFilterFormProps,

package/src/component/pagination.tsx

@@ -15,13 +15,18 @@ export function Pagination({
   nextPage,
   prevPage,
   hasPrevPage,
+  hasNextPage,
 }: PaginationProps) {
   return (
     <div className="flex items-center justify-end gap-2 py-2">
       <button
         type="button"
         className="inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50"
-        onClick={prevPage}
+        onClick={() => {
+          if (pageInfo.startCursor) {
+            prevPage(pageInfo.startCursor);
+          }
+        }}
         disabled={!hasPrevPage}
       >
         Previous
@@ -34,7 +39,7 @@ export function Pagination({
             nextPage(pageInfo.endCursor);
           }
         }}
-        disabled={!pageInfo.hasNextPage}
+        disabled={!hasNextPage}
       >
         Next
       </button>