@umituz/react-native-ai-creations 1.2.12 → 1.2.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-ai-creations",
-  "version": "1.2.12",
+  "version": "1.2.13",
   "description": "AI-generated creations gallery with filtering, sharing, and management for React Native apps",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

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

@@ -20,6 +20,8 @@ export interface CreationsTranslations {
   readonly deleteMessage: string;
   readonly photoCount: string;
   readonly filterAll: string;
+  readonly filterLabel: string;
+  readonly filterTitle: string;
 }
 
 /**
@@ -61,6 +63,8 @@ export const DEFAULT_TRANSLATIONS: CreationsTranslations = {
   deleteMessage: "creations.deleteMessage",
   photoCount: "creations.photoCount",
   filterAll: "creations.filterAll",
+  filterLabel: "common.filter",
+  filterTitle: "common.filter",
 };
 
 export const DEFAULT_CONFIG: CreationsConfig = {

package/src/presentation/components/GalleryHeader.tsx

@@ -8,6 +8,8 @@ interface GalleryHeaderProps {
     readonly countLabel: string;
     readonly isFiltered: boolean;
     readonly onFilterPress: () => void;
+    readonly filterLabel?: string;
+    readonly filterIcon?: any;
     readonly style?: any;
 }
 
@@ -17,6 +19,8 @@ export const GalleryHeader: React.FC<GalleryHeaderProps> = ({
     countLabel,
     isFiltered,
     onFilterPress,
+    filterLabel = 'Filter',
+    filterIcon = 'filter-outline',
     style,
 }) => {
     const tokens = useAppDesignTokens();
@@ -33,14 +37,15 @@ export const GalleryHeader: React.FC<GalleryHeaderProps> = ({
             <TouchableOpacity
                 onPress={onFilterPress}
                 style={[styles.filterButton, isFiltered && styles.filterButtonActive]}
+                activeOpacity={0.7}
             >
                 <AtomicIcon
-                    name="ListFilter"
+                    name={filterIcon}
                     size="sm"
                     color={isFiltered ? "primary" : "secondary"}
                 />
                 <AtomicText style={[styles.filterText, { color: isFiltered ? tokens.colors.primary : tokens.colors.textSecondary }]}>
-                    Filter
+                    {filterLabel}
                 </AtomicText>
                 {isFiltered && (
                     <View style={styles.badge} />

package/src/presentation/screens/CreationsGalleryScreen.tsx

@@ -73,12 +73,12 @@ export function CreationsGalleryScreen({
     if (config.types.length > 0) {
       categories.push({
         id: 'type',
-        title: t('creations.category') || 'Category',
+        title: t(config.translations.filterTitle) || t('creations.category') || 'Category',
         multiSelect: false,
-        options: config.types.map(t => ({
-          id: t.id,
-          label: t.labelKey,
-          icon: 'Image',
+        options: config.types.map(type => ({
+          id: type.id,
+          label: t(type.labelKey),
+          icon: type.icon || 'Image',
         }))
       });
     }
@@ -218,6 +218,7 @@ export function CreationsGalleryScreen({
         count={filtered.length}
         countLabel={t(config.translations.photoCount) || 'photos'}
         isFiltered={isFiltered}
+        filterLabel={t(config.translations.filterLabel) || 'Filter'}
         onFilterPress={() => filterSheetRef.current?.present()}
         style={{ paddingTop: insets.top }}
       />
@@ -256,7 +257,7 @@ export function CreationsGalleryScreen({
           toggleFilter(id, category?.multiSelect);
         }}
         onClearFilters={clearFilters}
-        title={t("common.filter")}
+        title={t(config.translations.filterTitle) || t("common.filter")}
       />
     </View>
   );