@umituz/react-native-ai-generation-content 1.12.3 → 1.12.5

package/src/domains/creations/domain/value-objects/CreationsConfig.ts

@@ -0,0 +1,76 @@
+/**
+ * Creations Configuration Value Object
+ * Defines the configuration for creations feature
+ */
+
+import type { Creation, CreationDocument } from "../entities/Creation";
+
+export interface CreationType {
+  readonly id: string;
+  readonly labelKey: string;
+  readonly icon: string;
+}
+
+export interface CreationsTranslations {
+  readonly title: string;
+  readonly subtitle: string;
+  readonly empty: string;
+  readonly emptyDescription: string;
+  readonly deleteTitle: string;
+  readonly deleteMessage: string;
+  readonly photoCount: string;
+  readonly filterAll: string;
+  readonly filterLabel: string;
+  readonly filterTitle: string;
+}
+
+/**
+ * Path builder function type
+ * Allows apps to define custom Firestore path structures
+ * @example
+ * // Default: users/{userId}/creations
+ * pathBuilder: (userId) => ["users", userId, "creations"]
+ * // Alternative: creations/{userId}/items
+ * pathBuilder: (userId) => ["creations", userId, "items"]
+ */
+export type PathBuilder = (userId: string) => string[];
+
+/**
+ * Document mapper function type
+ * Allows apps to map their specific document structure to Creation
+ */
+export type DocumentMapper = (id: string, data: CreationDocument) => Creation;
+
+import type { FilterCategory } from "@umituz/react-native-bottom-sheet";
+
+export interface CreationsConfig {
+  readonly collectionName: string;
+  readonly types: readonly CreationType[];
+  readonly filterCategories?: readonly FilterCategory[];
+  readonly translations: CreationsTranslations;
+  readonly maxThumbnails?: number;
+  readonly gridColumns?: number;
+  readonly pathBuilder?: PathBuilder;
+  readonly documentMapper?: DocumentMapper;
+}
+
+export const DEFAULT_TRANSLATIONS: CreationsTranslations = {
+  title: "creations.title",
+  subtitle: "creations.subtitle",
+  empty: "creations.empty",
+  emptyDescription: "creations.emptyDescription",
+  deleteTitle: "creations.deleteTitle",
+  deleteMessage: "creations.deleteMessage",
+  photoCount: "creations.photoCount",
+  filterAll: "creations.filterAll",
+  filterLabel: "common.filter",
+  filterTitle: "common.filter",
+};
+
+export const DEFAULT_CONFIG: CreationsConfig = {
+  collectionName: "creations",
+  types: [],
+  translations: DEFAULT_TRANSLATIONS,
+  maxThumbnails: 4,
+  gridColumns: 2,
+};

package/src/domains/creations/domain/value-objects/index.ts

@@ -0,0 +1,12 @@
+/**
+ * Domain Value Objects
+ */
+
+export type {
+  CreationType,
+  CreationsTranslations,
+  CreationsConfig,
+  PathBuilder,
+  DocumentMapper,
+} from "./CreationsConfig";
+export { DEFAULT_TRANSLATIONS, DEFAULT_CONFIG } from "./CreationsConfig";

package/src/domains/creations/index.ts

@@ -0,0 +1,84 @@
+/**
+ * @umituz/react-native-ai-creations
+ *
+ * AI-generated creations gallery with filtering, sharing, and management
+ *
+ * Architecture:
+ * - Extends BaseRepository from @umituz/react-native-firestore
+ * - Fully dynamic path structure (configurable per app)
+ * - Fully dynamic document mapping (configurable per app)
+ * - App-agnostic: Works with any app, no app-specific code
+ *
+ * This package is designed to be used across hundreds of apps.
+ *
+ * Usage:
+ *   import {
+ *     CreationsGalleryScreen,
+ *     CreationsHomeCard,
+ *     useCreations,
+ *     createCreationsRepository,
+ *   } from '@umituz/react-native-ai-creations';
+ */
+
+// =============================================================================
+// DOMAIN LAYER - Entities
+// =============================================================================
+
+export type { Creation, CreationDocument } from "./domain/entities";
+export { mapDocumentToCreation } from "./domain/entities";
+
+// =============================================================================
+// DOMAIN LAYER - Value Objects
+// =============================================================================
+
+export type {
+  CreationType,
+  CreationsTranslations,
+  CreationsConfig,
+  PathBuilder,
+  DocumentMapper,
+} from "./domain/value-objects";
+export { DEFAULT_TRANSLATIONS, DEFAULT_CONFIG } from "./domain/value-objects";
+
+// =============================================================================
+// DOMAIN LAYER - Repository Interface
+// =============================================================================
+
+export type { ICreationsRepository } from "./domain/repositories";
+
+// =============================================================================
+// INFRASTRUCTURE LAYER
+// =============================================================================
+
+export {
+  CreationsRepository,
+  type RepositoryOptions,
+} from "./infrastructure/repositories";
+export { CreationsStorageService } from "./infrastructure/services/CreationsStorageService";
+export { createCreationsRepository } from "./infrastructure/adapters";
+export { CreationsService } from "./application/services/CreationsService";
+export type { ICreationsStorageService } from "./domain/services/ICreationsStorageService";
+
+// =============================================================================
+// PRESENTATION LAYER - Hooks
+// =============================================================================
+
+export { useCreations } from "./presentation/hooks/useCreations";
+export { useDeleteCreation } from "./presentation/hooks/useDeleteCreation";
+export { useCreationsFilter } from "./presentation/hooks/useCreationsFilter";
+
+// =============================================================================
+// PRESENTATION LAYER - Components
+// =============================================================================
+
+export { CreationThumbnail } from "./presentation/components/CreationThumbnail";
+export { CreationCard } from "./presentation/components/CreationCard";
+export { CreationsHomeCard } from "./presentation/components/CreationsHomeCard";
+export { FilterChips } from "./presentation/components/FilterChips";
+export { EmptyState } from "./presentation/components/EmptyState";
+
+// =============================================================================
+// PRESENTATION LAYER - Screens
+// =============================================================================
+
+export { CreationsGalleryScreen } from "./presentation/screens/CreationsGalleryScreen";

package/src/domains/creations/infrastructure/adapters/createRepository.ts

@@ -0,0 +1,54 @@
+/**
+ * Repository Factory
+ * Creates repository instance with given configuration
+ *
+ * Architecture:
+ * - Factory pattern for repository creation
+ * - Supports dynamic path structure per app
+ * - Supports custom document mapping per app
+ * - App-agnostic: No Firestore instance needed (BaseRepository handles it)
+ *
+ * This factory is designed to be used across hundreds of apps.
+ */
+
+import {
+  CreationsRepository,
+  type RepositoryOptions,
+} from "../repositories/CreationsRepository";
+import type { ICreationsRepository } from "../../domain/repositories/ICreationsRepository";
+
+/**
+ * Creates a new CreationsRepository instance
+ *
+ * @param collectionName - Firestore collection name
+ * @param options - Optional repository configuration
+ * @returns ICreationsRepository instance
+ *
+ * @example
+ * // Basic usage with default path (users/{userId}/photos)
+ * const repo = createCreationsRepository("photos");
+ *
+ * @example
+ * // Custom path structure
+ * const repo = createCreationsRepository("creations", {
+ *   pathBuilder: (userId) => ["gallery", userId, "items"],
+ * });
+ *
+ * @example
+ * // Custom document mapper
+ * const repo = createCreationsRepository("photos", {
+ *   documentMapper: (id, data) => ({
+ *     id,
+ *     uri: data.imageUrl,
+ *     type: data.category,
+ *     createdAt: data.timestamp?.toDate() || new Date(),
+ *     isShared: data.public ?? false,
+ *   }),
+ * });
+ */
+export function createCreationsRepository(
+  collectionName: string,
+  options?: RepositoryOptions,
+): ICreationsRepository {
+  return new CreationsRepository(collectionName, options);
+}

package/src/domains/creations/infrastructure/adapters/index.ts

@@ -0,0 +1,5 @@
+/**
+ * Infrastructure Adapters
+ */
+
+export { createCreationsRepository } from "./createRepository";

package/src/domains/creations/infrastructure/repositories/CreationsRepository.ts

@@ -0,0 +1,233 @@
+/**
+ * Creations Repository Implementation
+ * Extends BaseRepository from @umituz/react-native-firestore
+ *
+ * Architecture:
+ * - Extends BaseRepository for centralized database access
+ * - Fully dynamic path structure (configurable per app)
+ * - Fully dynamic document mapping (configurable per app)
+ * - App-agnostic: Works with any app, no app-specific code
+ *
+ * This class is designed to be used across hundreds of apps.
+ */
+
+declare const __DEV__: boolean;
+
+import {
+  collection,
+  doc,
+  getDocs,
+  getDoc,
+  deleteDoc,
+  updateDoc,
+  query,
+  orderBy,
+  setDoc,
+} from "firebase/firestore";
+import { BaseRepository } from "@umituz/react-native-firebase";
+import type { ICreationsRepository } from "../../domain/repositories/ICreationsRepository";
+import type { Creation, CreationDocument } from "../../domain/entities/Creation";
+import { mapDocumentToCreation } from "../../domain/entities/Creation";
+import type {
+  PathBuilder,
+  DocumentMapper,
+} from "../../domain/value-objects/CreationsConfig";
+
+/**
+ * Repository options for dynamic configuration
+ * Apps can customize path structure and document mapping
+ */
+export interface RepositoryOptions {
+  /**
+   * Custom path builder function
+   * @example (userId) => ["users", userId, "photos"]
+   * @example (userId) => ["creations", userId, "items"]
+   */
+  readonly pathBuilder?: PathBuilder;
+
+  /**
+   * Custom document mapper function
+   * Maps Firestore documents to Creation entity
+   */
+  readonly documentMapper?: DocumentMapper;
+}
+
+/**
+ * Default path builder: users/{userId}/{collectionName}
+ */
+const createDefaultPathBuilder =
+  (collectionName: string): PathBuilder =>
+    (userId: string) =>
+      ["users", userId, collectionName];
+
+export class CreationsRepository
+  extends BaseRepository
+  implements ICreationsRepository {
+  private readonly pathBuilder: PathBuilder;
+  private readonly documentMapper: DocumentMapper;
+
+  constructor(
+    private readonly collectionName: string,
+    options?: RepositoryOptions,
+  ) {
+    super();
+    this.pathBuilder =
+      options?.pathBuilder ?? createDefaultPathBuilder(collectionName);
+    this.documentMapper = options?.documentMapper ?? mapDocumentToCreation;
+  }
+
+  private getUserCollection(userId: string) {
+    const db = this.getDb();
+    if (!db) return null;
+    const pathSegments = this.pathBuilder(userId);
+    return collection(db, pathSegments[0], ...pathSegments.slice(1));
+  }
+
+  private getDocRef(userId: string, creationId: string) {
+    const db = this.getDb();
+    if (!db) return null;
+    const pathSegments = this.pathBuilder(userId);
+    return doc(db, pathSegments[0], ...pathSegments.slice(1), creationId);
+  }
+
+  async getAll(userId: string): Promise<Creation[]> {
+    if (__DEV__) {
+      console.log("[CreationsRepository] getAll()", { userId });
+    }
+
+    const userCollection = this.getUserCollection(userId);
+    if (!userCollection) return [];
+
+    try {
+      const q = query(userCollection, orderBy("createdAt", "desc"));
+      const snapshot = await getDocs(q);
+
+      if (__DEV__) {
+        console.log("[CreationsRepository] Fetched:", snapshot.docs.length);
+      }
+
+      return snapshot.docs.map((docSnap) => {
+        const data = docSnap.data() as CreationDocument;
+        return this.documentMapper(docSnap.id, data);
+      });
+    } catch (error) {
+      if (__DEV__) {
+        console.error("[CreationsRepository] getAll() ERROR", error);
+      }
+      return [];
+    }
+  }
+
+  async getById(userId: string, id: string): Promise<Creation | null> {
+    if (__DEV__) {
+      console.log("[CreationsRepository] getById()", { userId, id });
+    }
+
+    const docRef = this.getDocRef(userId, id);
+    if (!docRef) return null;
+
+    try {
+      const docSnap = await getDoc(docRef);
+
+      if (!docSnap.exists()) {
+        if (__DEV__) {
+          console.log("[CreationsRepository] Document not found");
+        }
+        return null;
+      }
+
+      const data = docSnap.data() as CreationDocument;
+      return this.documentMapper(docSnap.id, data);
+    } catch (error) {
+      if (__DEV__) {
+        console.error("[CreationsRepository] getById() ERROR", error);
+      }
+      return null;
+    }
+  }
+
+  async create(userId: string, creation: Creation): Promise<void> {
+    const docRef = this.getDocRef(userId, creation.id);
+    if (!docRef) throw new Error("Firestore not initialized");
+
+    const data: CreationDocument = {
+      type: creation.type,
+      prompt: creation.prompt,
+      uri: creation.uri, // Use uri
+      createdAt: creation.createdAt,
+      metadata: creation.metadata || {},
+      isShared: creation.isShared || false,
+    };
+
+    await setDoc(docRef, data);
+  }
+
+  async update(
+    userId: string,
+    id: string,
+    updates: Partial<Creation>,
+  ): Promise<boolean> {
+    if (__DEV__) {
+      console.log("[CreationsRepository] update()", { userId, id, updates });
+    }
+
+    const docRef = this.getDocRef(userId, id);
+    if (!docRef) return false;
+
+    try {
+      const updateData: Record<string, any> = {};
+
+      if (updates.metadata !== undefined) {
+        updateData.metadata = updates.metadata;
+      }
+      if (updates.isShared !== undefined) {
+        updateData.isShared = updates.isShared;
+      }
+      if (updates.uri !== undefined) {
+        updateData.uri = updates.uri;
+      }
+      if (updates.type !== undefined) {
+        updateData.type = updates.type;
+      }
+      if (updates.prompt !== undefined) {
+        updateData.prompt = updates.prompt;
+      }
+
+      await updateDoc(docRef, updateData);
+      return true;
+    } catch (error) {
+      if (__DEV__) {
+        console.error("[CreationsRepository] update() ERROR", error);
+      }
+      return false;
+    }
+  }
+
+  async delete(userId: string, creationId: string): Promise<boolean> {
+    const docRef = this.getDocRef(userId, creationId);
+    if (!docRef) return false;
+
+    try {
+      await deleteDoc(docRef);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
+  async updateShared(
+    userId: string,
+    creationId: string,
+    isShared: boolean,
+  ): Promise<boolean> {
+    const docRef = this.getDocRef(userId, creationId);
+    if (!docRef) return false;
+
+    try {
+      await updateDoc(docRef, { isShared });
+      return true;
+    } catch {
+      return false;
+    }
+  }
+}

package/src/domains/creations/infrastructure/repositories/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Infrastructure Repositories
+ */
+
+export {
+  CreationsRepository,
+  type RepositoryOptions,
+} from "./CreationsRepository";

package/src/domains/creations/infrastructure/services/CreationsStorageService.ts

@@ -0,0 +1,48 @@
+import {
+    uploadFile,
+    uploadBase64Image,
+} from "@umituz/react-native-firebase";
+import type { ICreationsStorageService } from "../../domain/services/ICreationsStorageService";
+
+declare const __DEV__: boolean;
+
+export class CreationsStorageService implements ICreationsStorageService {
+    constructor(private readonly storagePathPrefix: string = "creations") { }
+
+    private getPath(userId: string, creationId: string): string {
+        return `${this.storagePathPrefix}/${userId}/${creationId}.jpg`;
+    }
+
+    async uploadCreationImage(
+        userId: string,
+        creationId: string,
+        imageUri: string,
+        mimeType: string = "image/jpeg"
+    ): Promise<string> {
+        const path = this.getPath(userId, creationId);
+
+        try {
+            if (imageUri.startsWith("data:")) {
+                const result = await uploadBase64Image(imageUri, path, { mimeType });
+                return result.downloadUrl;
+            }
+            const result = await uploadFile(imageUri, path, { mimeType });
+            return result.downloadUrl;
+        } catch (error) {
+            if (__DEV__) {
+                console.error("[CreationsStorageService] upload failed", error);
+            }
+            throw error;
+        }
+    }
+
+    async deleteCreationImage(
+        userId: string,
+        creationId: string
+    ): Promise<boolean> {
+        // Delete logic not strictly required for saving loop, but good to have
+        // Needs storage reference delete implementation in rn-firebase first
+        // For now we skip implementing delete in this iteration as priority is saving
+        return true;
+    }
+}

package/src/domains/creations/presentation/components/CreationCard.tsx

@@ -0,0 +1,136 @@
+/**
+ * CreationCard Component
+ * Displays a creation item with actions
+ */
+
+import React, { useMemo, useCallback } from "react";
+import { View, Image, TouchableOpacity, StyleSheet } from "react-native";
+import {
+  AtomicText,
+  AtomicIcon,
+  useAppDesignTokens,
+} from "@umituz/react-native-design-system";
+import type { Creation } from "../../domain/entities/Creation";
+import type { CreationType } from "../../domain/value-objects/CreationsConfig";
+
+interface CreationCardProps {
+  readonly creation: Creation;
+  readonly types: readonly CreationType[];
+  readonly onView?: (creation: Creation) => void;
+  readonly onShare: (creation: Creation) => void;
+  readonly onDelete: (creation: Creation) => void;
+}
+
+export function CreationCard({
+  creation,
+  types,
+  onView,
+  onShare,
+  onDelete,
+}: CreationCardProps) {
+  const tokens = useAppDesignTokens();
+
+  const typeConfig = types.find((t) => t.id === creation.type);
+  const icon = typeConfig?.icon || "🎨";
+  const label = typeConfig?.labelKey || creation.type;
+
+  const handleView = useCallback(() => onView?.(creation), [creation, onView]);
+  const handleShare = useCallback(() => onShare(creation), [creation, onShare]);
+  const handleDelete = useCallback(
+    () => onDelete(creation),
+    [creation, onDelete],
+  );
+
+  const formattedDate = useMemo(() => {
+    const date =
+      creation.createdAt instanceof Date
+        ? creation.createdAt
+        : new Date(creation.createdAt);
+    return date.toLocaleDateString(undefined, {
+      day: "numeric",
+      month: "short",
+      hour: "2-digit",
+      minute: "2-digit",
+    });
+  }, [creation.createdAt]);
+
+  const styles = useMemo(
+    () =>
+      StyleSheet.create({
+        container: {
+          flexDirection: "row",
+          backgroundColor: tokens.colors.surface,
+          borderRadius: tokens.spacing.md,
+          overflow: "hidden",
+          marginBottom: tokens.spacing.md,
+        },
+        thumbnail: {
+          width: 100,
+          height: 100,
+        },
+        content: {
+          flex: 1,
+          padding: tokens.spacing.md,
+          justifyContent: "space-between",
+        },
+        typeRow: {
+          flexDirection: "row",
+          alignItems: "center",
+          gap: tokens.spacing.sm,
+        },
+        icon: {
+          fontSize: 20,
+        },
+        typeText: {
+          ...tokens.typography.bodyMedium,
+          fontWeight: "600",
+          color: tokens.colors.textPrimary,
+        },
+        dateText: {
+          ...tokens.typography.bodySmall,
+          color: tokens.colors.textSecondary,
+        },
+        actions: {
+          flexDirection: "row",
+          gap: tokens.spacing.sm,
+        },
+        actionBtn: {
+          width: 36,
+          height: 36,
+          borderRadius: 18,
+          backgroundColor: tokens.colors.backgroundSecondary,
+          justifyContent: "center",
+          alignItems: "center",
+        },
+      }),
+    [tokens],
+  );
+
+  return (
+    <View style={styles.container}>
+      <Image source={{ uri: creation.uri }} style={styles.thumbnail} />
+      <View style={styles.content}>
+        <View>
+          <View style={styles.typeRow}>
+            <AtomicText style={styles.icon}>{icon}</AtomicText>
+            <AtomicText style={styles.typeText}>{label}</AtomicText>
+          </View>
+          <AtomicText style={styles.dateText}>{formattedDate}</AtomicText>
+        </View>
+        <View style={styles.actions}>
+          {onView && (
+            <TouchableOpacity style={styles.actionBtn} onPress={handleView}>
+              <AtomicIcon name="eye" size="sm" color="primary" />
+            </TouchableOpacity>
+          )}
+          <TouchableOpacity style={styles.actionBtn} onPress={handleShare}>
+            <AtomicIcon name="share-social" size="sm" color="primary" />
+          </TouchableOpacity>
+          <TouchableOpacity style={styles.actionBtn} onPress={handleDelete}>
+            <AtomicIcon name="trash" size="sm" color="error" />
+          </TouchableOpacity>
+        </View>
+      </View>
+    </View>
+  );
+}