@umituz/react-native-settings 5.2.34 → 5.2.36

package/src/domains/gamification/components/GamificationScreen/GamificationScreenWithConfig.tsx

@@ -38,40 +38,40 @@ export const GamificationScreenWithConfig: React.FC<GamificationConfigProps> = (
     type: a.type
   }));
 
-  const translations = config.translations || {};
+  const t = config.translations ?? {};
   const screenProps: GamificationScreenProps = {
-    title: translations.title || 'Gamification',
-    statsTitle: translations.statsTitle || 'Stats',
-    achievementsTitle: translations.achievementsTitle || 'Achievements',
-    streakTitle: translations.streakTitle || 'Streak',
+    title: t.title ?? 'Gamification',
+    statsTitle: t.statsTitle ?? 'Stats',
+    achievementsTitle: t.achievementsTitle ?? 'Achievements',
+    streakTitle: t.streakTitle ?? 'Streak',
     levelProps: {
       level: level.currentLevel,
       points: level.currentPoints,
       pointsToNext: level.pointsToNext,
       progress: level.progress,
-      levelTitle: translations.levelTitle || 'Level',
+      levelTitle: t.levelTitle ?? 'Level',
       showPoints: true,
     },
     streakProps: {
       current: streak.current,
       longest: streak.longest,
-      bestLabel: translations.bestStreak || 'Best',
-      daysLabel: translations.days || 'days',
+      bestLabel: t.bestStreak ?? 'Best',
+      daysLabel: t.days ?? 'days',
     },
     stats: [
       {
-        label: translations.pointsLabel || 'Points',
+        label: t.pointsLabel ?? 'Points',
         value: points,
         icon: "⭐",
       },
       {
-        label: translations.totalCompletedLabel || 'Completed',
+        label: t.totalCompletedLabel ?? 'Completed',
         value: totalTasksCompleted,
         icon: "✅",
       },
     ],
     achievements: achievementItems,
-    emptyAchievementsText: translations.emptyAchievements || 'No achievements yet',
+    emptyAchievementsText: t.emptyAchievements ?? 'No achievements yet',
   };
 
   return <GamificationScreenInner {...screenProps} />;

package/src/domains/localization/infrastructure/components/LanguageSwitcher.tsx

@@ -83,5 +83,3 @@ export const LanguageSwitcher: React.FC<LanguageSwitcherProps> = ({
   );
 };
 
-export default LanguageSwitcher;
-

package/src/domains/localization/infrastructure/storage/localizationStoreUtils.ts

@@ -8,7 +8,7 @@ import { LanguageSwitcher } from "./LanguageSwitcher";
 import { languageRepository } from "../repository/LanguageRepository";
 import { isDev } from "../../../../utils/devUtils";
 
-export const LANGUAGE_SWITCH_DEBOUNCE_MS = 300;
+const LANGUAGE_SWITCH_DEBOUNCE_MS = 300;
 
 /**
  * Manages localization initialization state

package/src/domains/localization/presentation/screens/LanguageSelectionScreen.tsx

@@ -12,13 +12,78 @@ import {
   NavigationHeader,
   useAppNavigation,
 } from '@umituz/react-native-design-system';
-import { isDev } from '../../../../utils/devUtils';
 import { useLanguageSelection } from '../../infrastructure/hooks/useLanguageSelection';
 import { LanguageItem } from '../components/LanguageItem';
 import type { Language } from '../../infrastructure/storage/types/Language';
 import type { LanguageSelectionScreenProps } from './LanguageSelectionScreen.types';
 import { styles } from './LanguageSelectionScreen.styles';
 
+interface LanguageListItemProps {
+  item: Language;
+  selectedCode: string;
+  onSelect: (code: string) => void;
+  renderLanguageItem?: LanguageSelectionScreenProps['renderLanguageItem'];
+  customStyles?: LanguageSelectionScreenProps['styles'];
+}
+
+const LanguageListItem: React.FC<LanguageListItemProps> = ({
+  item,
+  selectedCode,
+  onSelect,
+  renderLanguageItem,
+  customStyles,
+}) => {
+  const isSelected = selectedCode === item.code;
+
+  if (renderLanguageItem) {
+    return <>{renderLanguageItem(item, isSelected, onSelect)}</>;
+  }
+
+  return (
+    <LanguageItem
+      item={item}
+      isSelected={isSelected}
+      onSelect={onSelect}
+      customStyles={customStyles}
+    />
+  );
+};
+
+interface LanguageSearchComponentProps {
+  searchQuery: string;
+  setSearchQuery: (query: string) => void;
+  searchPlaceholder?: string;
+  renderSearchInput?: LanguageSelectionScreenProps['renderSearchInput'];
+  customStyles?: LanguageSelectionScreenProps['styles'];
+}
+
+const LanguageSearchComponent: React.FC<LanguageSearchComponentProps> = ({
+  searchQuery,
+  setSearchQuery,
+  searchPlaceholder,
+  renderSearchInput,
+  customStyles,
+}) => {
+  const tokens = useAppDesignTokens();
+
+  if (renderSearchInput) {
+    return renderSearchInput(searchQuery, setSearchQuery, searchPlaceholder || '');
+  }
+
+  return (
+    <SearchBar
+      value={searchQuery}
+      onChangeText={setSearchQuery}
+      placeholder={searchPlaceholder}
+      containerStyle={[
+        { marginBottom: tokens.spacing.md },
+        customStyles?.searchContainer
+      ]}
+      inputStyle={customStyles?.searchInput}
+    />
+  );
+};
+
 export const LanguageSelectionScreen: React.FC<LanguageSelectionScreenProps> = ({
   renderLanguageItem,
   renderSearchInput,
@@ -39,52 +104,20 @@ export const LanguageSelectionScreen: React.FC<LanguageSelectionScreenProps> = (
   } = useLanguageSelection();
 
   const onSelect = async (code: string) => {
-    if (isDev()) {
-    }
     await handleLanguageSelect(code, () => {
-      if (isDev()) {
-      }
       navigation.goBack();
     });
-    if (isDev()) {
-    }
-  };
-
-  const renderItem = ({ item }: { item: Language }) => {
-    const isSelected = selectedCode === item.code;
-
-    if (renderLanguageItem) {
-      return <>{renderLanguageItem(item, isSelected, onSelect)}</>;
-    }
-
-    return (
-      <LanguageItem
-        item={item}
-        isSelected={isSelected}
-        onSelect={onSelect}
-        customStyles={customStyles}
-      />
-    );
   };
 
-  const renderSearchComponent = () => {
-    if (renderSearchInput) {
-      return renderSearchInput(searchQuery, setSearchQuery, searchPlaceholder || '');
-    }
-
-    return (
-      <SearchBar
-        value={searchQuery}
-        onChangeText={setSearchQuery}
-        placeholder={searchPlaceholder}
-        containerStyle={[
-          { marginBottom: tokens.spacing.md },
-          customStyles?.searchContainer
-        ]}
-        inputStyle={customStyles?.searchInput}
-      />
-    );
-  };
+  const renderItem = ({ item }: { item: Language }) => (
+    <LanguageListItem
+      item={item}
+      selectedCode={selectedCode}
+      onSelect={onSelect}
+      renderLanguageItem={renderLanguageItem}
+      customStyles={customStyles}
+    />
+  );
 
   const handleBack = () => {
     if (onBackPress) {
@@ -101,14 +134,20 @@ export const LanguageSelectionScreen: React.FC<LanguageSelectionScreenProps> = (
       edges={['top', 'bottom', 'left', 'right']}
       backgroundColor={tokens.colors.backgroundPrimary}
       header={
-        <NavigationHeader 
-          title={headerTitle || ""} 
-          onBackPress={handleBack} 
+        <NavigationHeader
+          title={headerTitle || ""}
+          onBackPress={handleBack}
         />
       }
       containerStyle={customStyles?.container}
     >
-      {renderSearchComponent()}
+      <LanguageSearchComponent
+        searchQuery={searchQuery}
+        setSearchQuery={setSearchQuery}
+        searchPlaceholder={searchPlaceholder}
+        renderSearchInput={renderSearchInput}
+        customStyles={customStyles}
+      />
       <FlatList
         data={filteredLanguages}
         renderItem={renderItem}
@@ -134,5 +173,3 @@ export const LanguageSelectionScreen: React.FC<LanguageSelectionScreenProps> = (
   );
 };
 
-export default LanguageSelectionScreen;
-

package/src/domains/localization/presentation/screens/__tests__/LanguageSelectionScreen.test.tsx

@@ -121,21 +121,6 @@ describe('LanguageSelectionScreen', () => {
     );
   });
 
-  it('should use custom container when provided', () => {
-    const CustomContainer = ({ children }: { children: React.ReactNode }) => (
-      <div testID="custom-container">{children}</div>
-    );
-
-    const { getByTestId } = render(
-      <LanguageSelectionScreen
-        searchPlaceholder="Search languages..."
-        containerComponent={CustomContainer}
-      />
-    );
-
-    expect(getByTestId('custom-container')).toBeTruthy();
-  });
-
   it('should apply custom styles', () => {
     const customStyles = {
       container: { backgroundColor: 'red' },

package/src/domains/notifications/presentation/screens/NotificationsScreen.tsx

@@ -129,6 +129,4 @@ const getStyles = (tokens: DesignTokens) => StyleSheet.create({
     flex: 1,
     marginRight: BASE_TOKENS.spacing.md,
   },
-});
-
-export default NotificationsScreen;
+});

package/src/domains/notifications/reminders/presentation/components/ReminderForm.constants.ts

@@ -6,10 +6,6 @@ export const DEFAULT_WEEKDAY = 2; // Tuesday
 export const MAX_TITLE_LENGTH = 100;
 export const MAX_BODY_LENGTH = 500;
 
-export const VALID_HOUR_RANGE = { min: 0, max: 23 } as const;
-export const VALID_MINUTE_RANGE = { min: 0, max: 59 } as const;
-export const VALID_WEEKDAY_RANGE = { min: 0, max: 6 } as const;
-
 export interface ReminderFormTranslations {
   titleLabel: string;
   titlePlaceholder: string;

package/src/domains/notifications/reminders/presentation/components/ReminderForm.tsx

@@ -3,7 +3,7 @@
  * Form for creating and editing reminders
  */
 
-import React, { useState, useMemo, useCallback } from 'react';
+import React, { useReducer, useMemo, useCallback } from 'react';
 import { View, TextInput, ScrollView } from 'react-native';
 import { AtomicText } from '@umituz/react-native-design-system';
 import { useAppDesignTokens } from '@umituz/react-native-design-system';
@@ -24,6 +24,53 @@ import { createReminderFormStyles as createStyles } from './ReminderForm.styles'
 import { DEFAULT_TIME_PRESETS, FREQUENCY_OPTIONS } from '../../infrastructure/config/reminderPresets';
 import type { ReminderFrequency, TimePreset } from '../../../infrastructure/services/types';
 
+interface ReminderFormState {
+  title: string;
+  body: string;
+  frequency: ReminderFrequency;
+  selectedPresetId: string | undefined;
+  hour: number;
+  minute: number;
+  weekday: number;
+  isCustomTime: boolean;
+  error: string | null;
+}
+
+type ReminderFormAction =
+  | { type: 'SET_TITLE'; payload: string }
+  | { type: 'SET_BODY'; payload: string }
+  | { type: 'SET_FREQUENCY'; payload: ReminderFrequency }
+  | { type: 'SET_WEEKDAY'; payload: number }
+  | { type: 'SELECT_PRESET'; payload: TimePreset }
+  | { type: 'SELECT_CUSTOM' }
+  | { type: 'SET_ERROR'; payload: string | null };
+
+function reminderFormReducer(state: ReminderFormState, action: ReminderFormAction): ReminderFormState {
+  switch (action.type) {
+    case 'SET_TITLE':
+      return { ...state, title: action.payload, error: null };
+    case 'SET_BODY':
+      return { ...state, body: action.payload, error: null };
+    case 'SET_FREQUENCY':
+      return { ...state, frequency: action.payload };
+    case 'SET_WEEKDAY':
+      return { ...state, weekday: action.payload };
+    case 'SELECT_PRESET':
+      return {
+        ...state,
+        selectedPresetId: action.payload.id,
+        hour: action.payload.hour,
+        minute: action.payload.minute,
+        isCustomTime: false,
+        error: null,
+      };
+    case 'SELECT_CUSTOM':
+      return { ...state, selectedPresetId: undefined, isCustomTime: true };
+    case 'SET_ERROR':
+      return { ...state, error: action.payload };
+  }
+}
+
 export const ReminderForm: React.FC<ReminderFormProps> = ({
   initialData,
   translations,
@@ -34,36 +81,32 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
   const tokens = useAppDesignTokens();
   const styles = useMemo(() => createStyles(tokens), [tokens]);
 
-  const [title, setTitle] = useState(initialData?.title || '');
-  const [body, setBody] = useState(initialData?.body || '');
-  const [frequency, setFrequency] = useState<ReminderFrequency>(initialData?.frequency || 'daily');
-  const [selectedPresetId, setSelectedPresetId] = useState<string | undefined>(initialData?.timePresetId);
-  const [hour, setHour] = useState(initialData?.hour ?? DEFAULT_HOUR);
-  const [minute, setMinute] = useState(initialData?.minute ?? DEFAULT_MINUTE);
-  const [weekday, setWeekday] = useState(initialData?.weekday ?? DEFAULT_WEEKDAY);
-  const [isCustomTime, setIsCustomTime] = useState(!initialData?.timePresetId);
-  // FIXED: Add error state for user feedback
-  const [error, setError] = useState<string | null>(null);
+  const [state, dispatch] = useReducer(reminderFormReducer, {
+    title: initialData?.title || '',
+    body: initialData?.body || '',
+    frequency: initialData?.frequency || 'daily',
+    selectedPresetId: initialData?.timePresetId,
+    hour: initialData?.hour ?? DEFAULT_HOUR,
+    minute: initialData?.minute ?? DEFAULT_MINUTE,
+    weekday: initialData?.weekday ?? DEFAULT_WEEKDAY,
+    isCustomTime: !initialData?.timePresetId,
+    error: null,
+  });
+
+  const { title, body, frequency, selectedPresetId, hour, minute, weekday, isCustomTime, error } = state;
 
   const handlePresetSelect = useCallback((preset: TimePreset) => {
-    setSelectedPresetId(preset.id);
-    setHour(preset.hour);
-    setMinute(preset.minute);
-    setIsCustomTime(false);
-    // Clear error when user changes something
-    setError(null);
+    dispatch({ type: 'SELECT_PRESET', payload: preset });
   }, []);
 
   const handleCustomSelect = useCallback(() => {
-    setSelectedPresetId(undefined);
-    setIsCustomTime(true);
+    dispatch({ type: 'SELECT_CUSTOM' });
   }, []);
 
   const handleSave = useCallback(() => {
     const trimmedTitle = title.trim();
     const trimmedBody = body.trim();
 
-    // Validate using centralized validation
     const validationResult = validateReminderForm({
       title: trimmedTitle,
       body: trimmedBody,
@@ -76,15 +119,12 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
     });
 
     if (!validationResult.isValid) {
-      // FIXED: Show error to user
-      setError(validationResult.error || "Validation failed");
+      dispatch({ type: 'SET_ERROR', payload: validationResult.error || "Validation failed" });
       return;
     }
 
-    // Clear error and proceed
-    setError(null);
+    dispatch({ type: 'SET_ERROR', payload: null });
 
-    // Sanitize input (React Native handles XSS, but we trim extra whitespace)
     const sanitizedTitle = trimmedTitle.replace(/\s+/g, ' ').trim();
     const sanitizedBody = trimmedBody.replace(/\s+/g, ' ').trim();
 
@@ -108,8 +148,7 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
           style={styles.input}
           value={title}
           onChangeText={(text) => {
-            setTitle(text);
-            setError(null); // Clear error on input
+            dispatch({ type: 'SET_TITLE', payload: text });
           }}
           placeholder={translations.titlePlaceholder}
           placeholderTextColor={tokens.colors.textSecondary}
@@ -122,8 +161,7 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
           style={[styles.input, styles.multilineInput]}
           value={body}
           onChangeText={(text) => {
-            setBody(text);
-            setError(null); // Clear error on input
+            dispatch({ type: 'SET_BODY', payload: text });
           }}
           placeholder={translations.bodyPlaceholder}
           placeholderTextColor={tokens.colors.textSecondary}
@@ -137,7 +175,7 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
         <FrequencySelector
           options={FREQUENCY_OPTIONS}
           selectedFrequency={frequency}
-          onSelect={setFrequency}
+          onSelect={(freq: ReminderFrequency) => dispatch({ type: 'SET_FREQUENCY', payload: freq })}
           getLabel={translations.getFrequencyLabel}
         />
       </View>
@@ -159,7 +197,7 @@ export const ReminderForm: React.FC<ReminderFormProps> = ({
       {frequency === 'weekly' && (
         <View style={styles.section}>
           <AtomicText type="bodyMedium" style={styles.label}>{translations.weekdayLabel}</AtomicText>
-          <WeekdaySelector selectedWeekday={weekday} onSelect={setWeekday} getLabel={translations.getWeekdayLabel} />
+          <WeekdaySelector selectedWeekday={weekday} onSelect={(day: number) => dispatch({ type: 'SET_WEEKDAY', payload: day })} getLabel={translations.getWeekdayLabel} />
         </View>
       )}
 

package/src/domains/rating/presentation/components/StarRating.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import React, { useState } from "react";
 import { View, StyleSheet, TouchableOpacity, ViewStyle } from "react-native";
 import { useAppDesignTokens, AtomicIcon } from "@umituz/react-native-design-system";
 
@@ -25,23 +25,17 @@ export const StarRating: React.FC<StarRatingProps> = ({
 }) => {
     const tokens = useAppDesignTokens();
     const styles = getStyles(tokens);
-    const [internalRating, setInternalRating] = useState(rating);
+    const [selectedRating, setSelectedRating] = useState<number | null>(null);
 
-    // Sync internal state with rating prop changes
-    useEffect(() => {
-        setInternalRating(rating);
-    }, [rating]);
+    const displayRating = selectedRating ?? rating;
 
     const filledColor = activeColor || tokens.colors.warning;
     const emptyColor = inactiveColor || tokens.colors.borderLight;
-    
-    // Scale the size
-    const responsiveSize = size;
 
     const handlePress = (index: number) => {
         if (disabled) return;
         const newRating = index + 1;
-        setInternalRating(newRating);
+        setSelectedRating(newRating);
         onRatingChange?.(newRating);
     };
 
@@ -56,9 +50,9 @@ export const StarRating: React.FC<StarRatingProps> = ({
                     style={styles.starContainer}
                 >
                     <AtomicIcon
-                        name={index < (onRatingChange ? internalRating : rating) ? "star" : "star-outline"}
-                        customSize={responsiveSize}
-                        customColor={index < (onRatingChange ? internalRating : rating) ? filledColor : emptyColor}
+                        name={index < (onRatingChange ? displayRating : rating) ? "star" : "star-outline"}
+                        customSize={size}
+                        customColor={index < (onRatingChange ? displayRating : rating) ? filledColor : emptyColor}
                     />
                 </TouchableOpacity>
             ))}

package/src/infrastructure/utils/configFactory.ts

@@ -62,29 +62,3 @@ export const createConfigWithExtensions = <T extends BaseConfigType>(
   return { ...baseConfig, ...extensions };
 };
 
-/**
- * Create a disabled configuration
- */
-export const createDisabledConfig = <T extends BaseConfigType>(
-  params: Omit<ConfigCreatorParams, "routeOrOnPress" | "defaultRoute">
-): T => {
-  const baseConfig = createBaseConfig<T>(params);
-  return { ...baseConfig, enabled: false } as T;
-};
-
-/**
- * Batch create configurations
- */
-export const createBatchConfigs = <T extends BaseConfigType>(
-  items: Array<{
-    icon: string;
-    routeOrOnPress?: string | (() => void);
-  }>
-): T[] => {
-  return items.map((item) =>
-    createBaseConfig<T>({
-      icon: item.icon,
-      routeOrOnPress: item.routeOrOnPress,
-    })
-  );
-};

package/src/infrastructure/utils/constants/textLimits.ts

@@ -19,5 +19,3 @@ export const TEXT_LENGTH_LIMITS = {
   /** User ID maximum length (128 characters) */
   USER_ID: 128,
 } as const;
-
-export type TextLengthLimit = typeof TEXT_LENGTH_LIMITS[keyof typeof TEXT_LENGTH_LIMITS];

package/src/infrastructure/utils/sanitizers.ts

@@ -6,10 +6,7 @@
 
 import { TEXT_LENGTH_LIMITS } from './constants/textLimits';
 
-/**
- * Sanitize string by trimming and limiting length
- */
-export function sanitizeString(str: string | undefined, maxLength: number): string {
+function sanitizeString(str: string | undefined, maxLength: number): string {
   if (!str) return "";
   return str.trim().slice(0, maxLength);
 }
@@ -28,24 +25,3 @@ export function sanitizeDescription(description: string | undefined): string | u
   return sanitizeString(description || "", TEXT_LENGTH_LIMITS.DESCRIPTION);
 }
 
-/**
- * Truncate text with ellipsis
- */
-export function truncateText(text: string, maxLength: number): string {
-  if (text.length <= maxLength) return text;
-  return text.slice(0, maxLength - 3) + "...";
-}
-
-/**
- * Escape HTML entities (for security)
- */
-export function escapeHtml(text: string): string {
-  const htmlEntities: Record<string, string> = {
-    "&": "&amp;",
-    "<": "&lt;",
-    ">": "&gt;",
-    '"': "&quot;",
-    "'": "&#39;",
-  };
-  return text.replace(/[&<>"']/g, (char) => htmlEntities[char] || char);
-}

package/src/infrastructure/utils/validation/core.ts

@@ -3,40 +3,7 @@
  * Base validation interfaces and types
  */
 
-/**
- * Validation result interface
- */
 export interface ValidationResult {
   isValid: boolean;
   error?: string;
 }
-
-/**
- * Text validation options
- */
-export interface TextValidationOptions {
-  minLength?: number;
-  maxLength?: number;
-  required?: boolean;
-  pattern?: RegExp;
-  customValidator?: (value: string) => string | null;
-}
-
-/**
- * Email validation options
- */
-export interface EmailValidationOptions {
-  required?: boolean;
-  allowEmpty?: boolean;
-}
-
-/**
- * Password validation options
- */
-export interface PasswordValidationOptions {
-  minLength?: number;
-  requireUppercase?: boolean;
-  requireLowercase?: boolean;
-  requireNumber?: boolean;
-  requireSpecialChar?: boolean;
-}

package/src/infrastructure/utils/validation/formValidators.ts

@@ -4,9 +4,15 @@
  */
 
 import type { ValidationResult } from "./core";
-import { validateRating } from "./numericValidators";
 import { TEXT_LENGTH_LIMITS } from "../constants/textLimits";
 
+const validateRating = (rating: number): ValidationResult => {
+  if (rating < 1 || rating > 5) {
+    return { isValid: false, error: "Rating must be between 1 and 5" };
+  }
+  return { isValid: true };
+};
+
 /**
  * Feedback form validation
  */

package/src/infrastructure/utils/validation/index.ts

@@ -1,37 +1,6 @@
 /**
  * Validation Utilities
- * Barrel export for all validation modules
  */
 
-export * from "./core";
-export * from "./textValidators";
-export * from "./passwordValidator";
-export * from "./numericValidators";
-export * from "./formValidators";
-
-import type { ValidationResult } from "./core";
-
-/**
- * Form field validator factory
- * Creates a validator function for a specific field
- */
-export const createFieldValidator = <T>(
-  validator: (value: T) => ValidationResult
-) => {
-  return (value: T): ValidationResult => validator(value);
-};
-
-/**
- * Multi-field validator
- * Validates multiple fields and returns the first error
- */
-export const validateMultipleFields = (
-  fields: Record<string, ValidationResult>
-): ValidationResult => {
-  for (const result of Object.values(fields)) {
-    if (!result.isValid) {
-      return result;
-    }
-  }
-  return { isValid: true };
-};
+export type { ValidationResult } from "./core";
+export { validateFeedbackForm, validateReminderForm } from "./formValidators";