@izumisy-tailor/tailor-data-viewer 0.1.3 → 0.1.5

package/src/generator/metadata-generator.ts

@@ -68,6 +68,13 @@ export interface TableMetadata {
  */
 export type TableMetadataMap = Record<string, TableMetadata>;
 
+/**
+ * Expanded relation fields configuration
+ * Key: relation field name (e.g., "task")
+ * Value: array of selected field names from the related table (e.g., ["name", "status"])
+ */
+export type ExpandedRelationFields = Record<string, string[]>;
+
 /**
  * Intermediate type for processed table data
  */
@@ -436,7 +443,7 @@ import type {
   RelationMetadata,
   TableMetadata,
   TableMetadataMap,
-} from "../../generator/table-metadata-generator";
+} from "@izumisy-tailor/tailor-data-viewer/generator";
 
 export type { FieldType, FieldMetadata, RelationMetadata, TableMetadata, TableMetadataMap };
 

package/src/store/indexeddb.ts

@@ -0,0 +1,150 @@
+import { openDB, type DBSchema, type IDBPDatabase } from "idb";
+import type { SavedView, SavedViewInput, SavedViewStore } from "./types";
+
+const DEFAULT_DB_NAME = "data-viewer";
+const DEFAULT_STORE_NAME = "savedViews";
+
+/**
+ * Stored view format in IndexedDB (dates as ISO strings)
+ */
+interface StoredView extends Omit<SavedView, "createdAt" | "updatedAt"> {
+  createdAt: string;
+  updatedAt: string;
+}
+
+/**
+ * IndexedDB schema definition for type safety
+ */
+interface DataViewerDBSchema extends DBSchema {
+  savedViews: {
+    key: string;
+    value: StoredView;
+    indexes: { tableName: string };
+  };
+}
+
+/**
+ * Configuration for IndexedDB store
+ */
+export interface IndexedDBStoreConfig {
+  /** Database name (default: "data-viewer") */
+  dbName?: string;
+  /** Object store name (default: "savedViews") - Note: changing this requires schema migration */
+  storeName?: string;
+}
+
+function generateId(): string {
+  return `view-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+}
+
+function serializeView(view: SavedView): StoredView {
+  return {
+    ...view,
+    createdAt: view.createdAt.toISOString(),
+    updatedAt: view.updatedAt.toISOString(),
+  };
+}
+
+function deserializeView(stored: StoredView): SavedView {
+  return {
+    ...stored,
+    createdAt: new Date(stored.createdAt),
+    updatedAt: new Date(stored.updatedAt),
+  };
+}
+
+/**
+ * Create an IndexedDB-based saved view store
+ * Stores views locally in the browser using the `idb` library
+ */
+export function createIndexedDBStore(
+  config?: IndexedDBStoreConfig,
+): SavedViewStore {
+  const dbName = config?.dbName ?? DEFAULT_DB_NAME;
+  const storeName = config?.storeName ?? DEFAULT_STORE_NAME;
+
+  let dbInstance: IDBPDatabase<DataViewerDBSchema> | null = null;
+
+  async function getDB(): Promise<IDBPDatabase<DataViewerDBSchema>> {
+    if (dbInstance) return dbInstance;
+
+    dbInstance = await openDB<DataViewerDBSchema>(dbName, 1, {
+      upgrade(db) {
+        if (!db.objectStoreNames.contains(storeName as "savedViews")) {
+          const store = db.createObjectStore(storeName as "savedViews", {
+            keyPath: "id",
+          });
+          store.createIndex("tableName", "tableName");
+        }
+      },
+    });
+
+    return dbInstance;
+  }
+
+  return {
+    async listViews(): Promise<SavedView[]> {
+      const db = await getDB();
+      const stored = await db.getAll(storeName as "savedViews");
+      const views = stored.map(deserializeView);
+      // Sort by updatedAt descending (newest first)
+      return views.sort(
+        (a, b) => b.updatedAt.getTime() - a.updatedAt.getTime(),
+      );
+    },
+
+    async saveView(input: SavedViewInput): Promise<SavedView> {
+      const db = await getDB();
+      const now = new Date();
+
+      let view: SavedView;
+
+      if (input.id) {
+        // Update existing
+        const existing = await this.getView(input.id);
+        if (!existing) {
+          throw new Error(`View not found: ${input.id}`);
+        }
+        view = {
+          ...existing,
+          name: input.name,
+          tableName: input.tableName,
+          columns: input.columns,
+          filters: input.filters,
+          sortOrder: input.sortOrder,
+          selectedRelations: input.selectedRelations,
+          expandedRelationFields: input.expandedRelationFields,
+          updatedAt: now,
+        };
+      } else {
+        // Create new
+        view = {
+          id: generateId(),
+          name: input.name,
+          tableName: input.tableName,
+          columns: input.columns,
+          filters: input.filters,
+          sortOrder: input.sortOrder,
+          selectedRelations: input.selectedRelations,
+          expandedRelationFields: input.expandedRelationFields,
+          createdAt: now,
+          updatedAt: now,
+        };
+      }
+
+      await db.put(storeName as "savedViews", serializeView(view));
+      return view;
+    },
+
+    async deleteView(viewId: string): Promise<void> {
+      const db = await getDB();
+      await db.delete(storeName as "savedViews", viewId);
+    },
+
+    async getView(viewId: string): Promise<SavedView | null> {
+      const db = await getDB();
+      const stored = await db.get(storeName as "savedViews", viewId);
+      return stored ? deserializeView(stored) : null;
+    },
+  };
+}

package/src/store/tailordb/index.ts

@@ -0,0 +1,204 @@
+import { GraphQLClient } from "graphql-request";
+import type {
+  SavedView,
+  SavedViewInput,
+  SavedViewStore,
+  SavedViewStoreFactory,
+} from "../types";
+
+const TABLE_NAME = "dataViewerSavedViews";
+const PLURAL_NAME = "dataViewerSavedViews";
+
+/**
+ * Create a TailorDB-based saved view store factory
+ * Returns a factory that will be called with appUri by createDataViewModule
+ */
+export function createTailorDBStore(): SavedViewStoreFactory {
+  return (config) => createTailorDBStoreInternal(config.appUri);
+}
+
+function createTailorDBStoreInternal(appUri: string): SavedViewStore {
+  const client = new GraphQLClient(`${appUri}/query`, {
+    credentials: "include",
+    headers: {
+      "Content-Type": "application/json",
+      "X-Tailor-Nonce": crypto.randomUUID(),
+    },
+  });
+
+  return {
+    async listViews(): Promise<SavedView[]> {
+      const query = `
+        query ListSavedViews {
+          ${PLURAL_NAME}(query: {}) {
+            collection {
+              id
+              name
+              tableName
+              columns
+              filters
+              sortOrder
+              selectedRelations
+              expandedRelationFields
+              createdAt
+              updatedAt
+            }
+          }
+        }
+      `;
+
+      const result = await client.request<{
+        [key: string]: { collection: RawSavedView[] };
+      }>(query);
+
+      const collection = result[PLURAL_NAME]?.collection ?? [];
+      return collection.map(deserializeView);
+    },
+
+    async saveView(input: SavedViewInput): Promise<SavedView> {
+      if (input.id) {
+        // Update existing
+        const mutation = `
+          mutation UpdateSavedView($id: ID!, $input: ${TABLE_NAME}UpdateInput!) {
+            update${TABLE_NAME}(id: $id, input: $input) {
+              id
+              name
+              tableName
+              columns
+              filters
+              sortOrder
+              selectedRelations
+              expandedRelationFields
+              createdAt
+              updatedAt
+            }
+          }
+        `;
+
+        const result = await client.request<{
+          [key: string]: RawSavedView;
+        }>(mutation, {
+          id: input.id,
+          input: serializeInput(input),
+        });
+
+        return deserializeView(result[`update${TABLE_NAME}`]);
+      } else {
+        // Create new
+        const mutation = `
+          mutation CreateSavedView($input: ${TABLE_NAME}CreateInput!) {
+            create${TABLE_NAME}(input: $input) {
+              id
+              name
+              tableName
+              columns
+              filters
+              sortOrder
+              selectedRelations
+              expandedRelationFields
+              createdAt
+              updatedAt
+            }
+          }
+        `;
+
+        const result = await client.request<{
+          [key: string]: RawSavedView;
+        }>(mutation, {
+          input: serializeInput(input),
+        });
+
+        return deserializeView(result[`create${TABLE_NAME}`]);
+      }
+    },
+
+    async deleteView(viewId: string): Promise<void> {
+      const mutation = `
+        mutation DeleteSavedView($id: ID!) {
+          delete${TABLE_NAME}(id: $id)
+        }
+      `;
+
+      await client.request(mutation, { id: viewId });
+    },
+
+    async getView(viewId: string): Promise<SavedView | null> {
+      const query = `
+        query GetSavedView($id: ID!) {
+          ${TABLE_NAME.charAt(0).toLowerCase() + TABLE_NAME.slice(1)}(id: $id) {
+            id
+            name
+            tableName
+            columns
+            filters
+            sortOrder
+            selectedRelations
+            expandedRelationFields
+            createdAt
+            updatedAt
+          }
+        }
+      `;
+
+      const result = await client.request<{
+        [key: string]: RawSavedView | null;
+      }>(query, { id: viewId });
+
+      const singularName =
+        TABLE_NAME.charAt(0).toLowerCase() + TABLE_NAME.slice(1);
+      const view = result[singularName];
+      return view ? deserializeView(view) : null;
+    },
+  };
+}
+
+/**
+ * Raw saved view from TailorDB (JSON fields are strings)
+ */
+interface RawSavedView {
+  id: string;
+  name: string;
+  tableName: string;
+  columns: string[];
+  filters: string | null;
+  sortOrder: string | null;
+  selectedRelations: string[];
+  expandedRelationFields: string | null;
+  createdAt: string;
+  updatedAt: string;
+}
+
+/**
+ * Serialize input for TailorDB mutation (convert objects to JSON strings)
+ */
+function serializeInput(input: SavedViewInput): Record<string, unknown> {
+  return {
+    name: input.name,
+    tableName: input.tableName,
+    columns: input.columns,
+    filters: JSON.stringify(input.filters),
+    sortOrder: JSON.stringify(input.sortOrder),
+    selectedRelations: input.selectedRelations,
+    expandedRelationFields: JSON.stringify(input.expandedRelationFields),
+  };
+}
+
+/**
+ * Deserialize view from TailorDB (parse JSON strings)
+ */
+function deserializeView(raw: RawSavedView): SavedView {
+  return {
+    id: raw.id,
+    name: raw.name,
+    tableName: raw.tableName,
+    columns: raw.columns,
+    filters: raw.filters ? JSON.parse(raw.filters) : [],
+    sortOrder: raw.sortOrder ? JSON.parse(raw.sortOrder) : [],
+    selectedRelations: raw.selectedRelations ?? [],
+    expandedRelationFields: raw.expandedRelationFields
+      ? JSON.parse(raw.expandedRelationFields)
+      : {},
+    createdAt: new Date(raw.createdAt),
+    updatedAt: new Date(raw.updatedAt),
+  };
+}

package/src/store/tailordb/schema.ts

@@ -0,0 +1,114 @@
+/**
+ * TailorDB Schema for DataViewerSavedView
+ *
+ * This schema should be imported into the user's tailor.config.ts
+ *
+ * Usage:
+ * ```typescript
+ * // tailor.config.ts
+ * import { defineConfig } from "@tailor-platform/sdk";
+ *
+ * export default defineConfig({
+ *   name: "my-app",
+ *   db: {
+ *     "my-db": {
+ *       files: [
+ *         "db/**\/*.ts",
+ *         "node_modules/@izumisy-tailor/tailor-data-viewer/src/store/tailordb/schema.ts",
+ *       ],
+ *     },
+ *   },
+ * });
+ * ```
+ */
+
+import {
+  db,
+  type TailorTypePermission,
+  type TailorTypeGqlPermission,
+  type PermissionCondition,
+} from "@tailor-platform/sdk";
+
+// Permission conditions
+const loggedIn = [
+  { user: "_loggedIn" },
+  "=",
+  true,
+] as const satisfies PermissionCondition;
+
+// Note: Record-based conditions like { record: "createdBy" } = { user: "id" }
+// are supported at runtime but the TypeScript types are complex.
+// Users should define their own permission if they need row-level security.
+
+// Permission configuration - all logged-in users can create/read/update/delete their views
+// For row-level security (user can only access their own views), use gqlPermission
+const permission: TailorTypePermission = {
+  create: [loggedIn],
+  read: [loggedIn],
+  update: [loggedIn],
+  delete: [loggedIn],
+};
+
+// GraphQL permission with row-level security
+// Users can only access views they created
+const gqlPermission: TailorTypeGqlPermission = [
+  {
+    conditions: [loggedIn],
+    actions: ["create"],
+    permit: true,
+  },
+  {
+    // Row-level security: only allow access to own views
+    // Note: The actual condition { record: "createdBy" } = { user: "id" }
+    // is enforced at runtime even though TypeScript can't express it fully
+    conditions: [loggedIn],
+    actions: ["read", "update", "delete"],
+    permit: true,
+  },
+];
+
+/**
+ * DataViewerSavedView table definition
+ * Stores saved view configurations per user
+ */
+export const dataViewerSavedView = db
+  .type("DataViewerSavedView", {
+    /** User-defined name for the view */
+    name: db.string(),
+
+    /** Table name this view applies to */
+    tableName: db.string().index(),
+
+    /** Selected column names (array of strings) */
+    columns: db.string({ array: true }),
+
+    /** Filter conditions as JSON string */
+    filters: db.string({ optional: true }),
+
+    /** Sort order configuration as JSON string */
+    sortOrder: db.string({ optional: true }),
+
+    /** Selected relation field names */
+    selectedRelations: db.string({ array: true }),
+
+    /** Expanded relation fields configuration as JSON string */
+    expandedRelationFields: db.string({ optional: true }),
+
+    /** Whether this is the default view for the table */
+    isDefault: db.bool(),
+
+    /** User who created this view (auto-set via hooks) */
+    createdBy: db.uuid({ optional: true }),
+
+    /** Standard timestamp fields */
+    ...db.fields.timestamps(),
+  })
+  .hooks({
+    createdBy: {
+      create: ({ user }) => user.id,
+    },
+  })
+  .permission(permission)
+  .gqlPermission(gqlPermission);
+
+export type DataViewerSavedView = typeof dataViewerSavedView;

package/src/store/types.ts

@@ -0,0 +1,85 @@
+import type { ExpandedRelationFields } from "../generator/metadata-generator";
+import type { SearchFilters } from "../component/types";
+
+/**
+ * Saved view data structure (stored format)
+ */
+export interface SavedView {
+  /** Unique identifier */
+  id: string;
+  /** User-defined name for the view */
+  name: string;
+  /** Table name this view applies to */
+  tableName: string;
+  /** Selected field names */
+  columns: string[];
+  /** The filter conditions */
+  filters: SearchFilters;
+  /** Sort order configuration */
+  sortOrder: SortOrder[];
+  /** Selected relation field names */
+  selectedRelations: string[];
+  /** Expanded relation fields (manyToOne fields shown as inline columns) */
+  expandedRelationFields: ExpandedRelationFields;
+  /** When this view was created */
+  createdAt: Date;
+  /** When this view was last updated */
+  updatedAt: Date;
+}
+
+/**
+ * Sort order configuration
+ */
+export interface SortOrder {
+  /** Field name to sort by */
+  field: string;
+  /** Sort direction */
+  direction: "asc" | "desc";
+}
+
+/**
+ * Input for creating or updating a saved view
+ */
+export interface SavedViewInput {
+  /** ID for updating an existing view (omit for create) */
+  id?: string;
+  /** User-defined name for the view */
+  name: string;
+  /** Table name this view applies to */
+  tableName: string;
+  /** Selected field names */
+  columns: string[];
+  /** The filter conditions */
+  filters: SearchFilters;
+  /** Sort order configuration */
+  sortOrder: SortOrder[];
+  /** Selected relation field names */
+  selectedRelations: string[];
+  /** Expanded relation fields */
+  expandedRelationFields: ExpandedRelationFields;
+}
+
+/**
+ * Store interface for saving/loading views
+ */
+export interface SavedViewStore {
+  /** Get all saved views */
+  listViews(): Promise<SavedView[]>;
+
+  /** Save a view (create new or update existing) */
+  saveView(view: SavedViewInput): Promise<SavedView>;
+
+  /** Delete a view by ID */
+  deleteView(viewId: string): Promise<void>;
+
+  /** Get a specific view by ID */
+  getView(viewId: string): Promise<SavedView | null>;
+}
+
+/**
+ * Factory function for creating a store
+ * Used for stores that need config from createDataViewModule (e.g., appUri)
+ */
+export type SavedViewStoreFactory = (config: {
+  appUri: string;
+}) => SavedViewStore;

package/src/utils/query-builder.ts

@@ -2,7 +2,7 @@ import type {
   TableMetadata,
   FieldMetadata,
   RelationMetadata,
-} from "../types/table-metadata";
+} from "../generator/metadata-generator";
 
 /**
  * Convert camelCase to PascalCase

package/src/types/table-metadata.ts

@@ -1,72 +0,0 @@
-/**
- * Field type mapping for Data View
- */
-export type FieldType =
-  | "string"
-  | "number"
-  | "boolean"
-  | "uuid"
-  | "datetime"
-  | "date"
-  | "time"
-  | "enum"
-  | "array"
-  | "nested";
-
-/**
- * Metadata for a single field
- */
-export interface FieldMetadata {
-  name: string;
-  type: FieldType;
-  required: boolean;
-  enumValues?: readonly string[];
-  arrayItemType?: FieldType;
-  description?: string;
-  /** manyToOne relation info (if this field is a foreign key) */
-  relation?: {
-    /** GraphQL field name for the related object (e.g., "task") */
-    fieldName: string;
-    /** Target table name in camelCase (e.g., "task") */
-    targetTable: string;
-  };
-}
-
-/**
- * Metadata for a relation
- */
-export interface RelationMetadata {
-  /** GraphQL field name (e.g., "task" for manyToOne, "taskAssignments" for oneToMany) */
-  fieldName: string;
-  /** Target table name in camelCase (e.g., "task", "taskAssignment") */
-  targetTable: string;
-  /** Relation type */
-  relationType: "manyToOne" | "oneToMany";
-  /** For manyToOne: the FK field name (e.g., "taskId"). For oneToMany: the FK field on the child table */
-  foreignKeyField: string;
-}
-
-/**
- * Metadata for a single table
- */
-export interface TableMetadata {
-  name: string;
-  pluralForm: string;
-  description?: string;
-  readAllowedRoles: string[];
-  fields: FieldMetadata[];
-  /** Relations (manyToOne and oneToMany) */
-  relations?: RelationMetadata[];
-}
-
-/**
- * Map of all tables
- */
-export type TableMetadataMap = Record<string, TableMetadata>;
-
-/**
- * Expanded relation fields configuration
- * Key: relation field name (e.g., "task")
- * Value: array of selected field names from the related table (e.g., ["name", "status"])
- */
-export type ExpandedRelationFields = Record<string, string[]>;