@umituz/react-native-settings 5.3.81 → 5.4.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "5.3.81",
+  "version": "5.4.1",
   "description": "Complete settings hub for React Native apps - consolidated package with settings, localization, about, legal, appearance, feedback, FAQs, rating, and gamification - expo-store-review and expo-device now lazy loaded",
   "main": "./src/index.ts",
   "types": "./dist/index.d.ts",
@@ -76,11 +76,6 @@
       "react-native": "./src/domains/video-tutorials/index.ts",
       "default": "./src/domains/video-tutorials/index.ts"
     },
-    "./account": {
-      "types": "./dist/account.d.ts",
-      "react-native": "./src/account.ts",
-      "default": "./src/account.ts"
-    },
     "./package.json": "./package.json"
   },
   "scripts": {
@@ -118,8 +113,9 @@
     "url": "https://github.com/umituz/react-native-settings"
   },
   "optionalDependencies": {
-    "expo-store-review": "~6.0.0",
-    "expo-device": "~8.0.0"
+    "expo-constants": "~55.0.0",
+    "expo-device": "~8.0.0",
+    "expo-store-review": "~6.0.0"
   },
   "peerDependencies": {
     "@expo/vector-icons": ">=14.0.0",
@@ -128,6 +124,7 @@
     "@tanstack/react-query": ">=5.0.0",
     "@umituz/react-native-design-system": "*",
     "expo": ">=54.0.0",
+    "expo-constants": ">=55.0.0",
     "expo-device": ">=6.0.0",
     "expo-haptics": ">=15.0.0",
     "expo-localization": ">=16.0.0",
@@ -165,7 +162,7 @@
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
     "@umituz/react-native-auth": "^4.3.39",
-    "@umituz/react-native-design-system": "latest",
+    "@umituz/react-native-design-system": "^4.27.0",
     "@umituz/react-native-firebase": "^2.4.55",
     "@umituz/react-native-sentry": "latest",
     "eslint": "^8.57.0",
@@ -174,6 +171,7 @@
     "eslint-plugin-react-native": "^5.0.0",
     "expo-apple-authentication": "^8.0.8",
     "expo-clipboard": "^8.0.8",
+    "expo-constants": "~55.0.0",
     "expo-crypto": "^15.0.8",
     "expo-device": "~7.0.0",
     "expo-file-system": "^19.0.21",

package/src/domains/about/presentation/components/AboutSection.tsx

@@ -3,6 +3,7 @@ import { ViewStyle } from 'react-native';
 import { AboutConfig } from '../../domain/entities/AppInfo';
 import { SettingsItemCard } from '../../../../presentation/components/SettingsItemCard';
 import { useSettingsNavigation } from '../../../../presentation/navigation/hooks/useSettingsNavigation';
+import { createRouteOrPressHandler } from '../../../../presentation/navigation/utils/navigationHelpers';
 
 export interface AboutSectionProps {
     config?: AboutConfig;
@@ -29,20 +30,14 @@ export const AboutSection: React.FC<AboutSectionProps> = ({
 
     const navigation = useSettingsNavigation();
 
-    const route = config?.route || config?.defaultRoute || 'About';
     const title = propsTitle || config?.title;
     const description = propsDescription || config?.description;
     const sectionTitle = propsSectionTitle;
 
-    const handlePress = () => {
-        if (onPress) {
-            onPress();
-        } else if (config?.onPress) {
-            config.onPress();
-        } else {
-            navigation.navigate(route as 'About');
-        }
-    };
+    const handlePress = createRouteOrPressHandler(navigation.navigate, {
+        route: config?.route || config?.defaultRoute || 'About',
+        onPress: onPress || config?.onPress,
+    });
 
     if (!title) return null;
 

package/src/domains/appearance/presentation/components/AppearanceSection.tsx

@@ -3,6 +3,7 @@ import { ViewStyle } from 'react-native';
 import { AppearanceSectionConfig } from '../../types';
 import { SettingsItemCard } from '../../../../presentation/components/SettingsItemCard';
 import { useSettingsNavigation } from '../../../../presentation/navigation/hooks/useSettingsNavigation';
+import { createRouteOrPressHandler } from '../../../../presentation/navigation/utils/navigationHelpers';
 
 export interface AppearanceSectionProps {
     config?: AppearanceSectionConfig;
@@ -31,19 +32,13 @@ export const AppearanceSection: React.FC<AppearanceSectionProps> = ({
 
     const navigation = useSettingsNavigation();
 
-    const route = config?.route || config?.defaultRoute || 'Appearance';
     const title = titleProp || config?.title;
     const description = descriptionProp || config?.description;
 
-    const handlePress = () => {
-        if (onPress) {
-            onPress();
-        } else if (config?.onPress) {
-            config.onPress();
-        } else {
-            navigation.navigate(route as 'Appearance');
-        }
-    };
+    const handlePress = createRouteOrPressHandler(navigation.navigate, {
+        route: config?.route || config?.defaultRoute || 'Appearance',
+        onPress: onPress || config?.onPress,
+    });
 
     if (!title) return null;
 

package/src/domains/faqs/presentation/components/FAQCategory.tsx

@@ -24,6 +24,29 @@ export interface FAQCategoryProps {
     styles?: FAQCategoryStyles;
 }
 
+// Memoized FAQ items list to prevent unnecessary re-renders when other categories update
+const FAQItemsList: React.FC<{
+    items: FAQCategoryType['items'];
+    isExpanded: (itemId: string) => boolean;
+    onToggleItem: (itemId: string) => void;
+    customStyles?: FAQCategoryStyles;
+}> = React.memo(({ items, isExpanded, onToggleItem, customStyles }) => (
+    <>
+        {items.map((item, index) => (
+            <FAQItemComponent
+                key={item.id}
+                item={item}
+                isExpanded={isExpanded(item.id)}
+                onToggle={() => onToggleItem(item.id)}
+                isLast={index === items.length - 1}
+                styles={customStyles?.itemStyles}
+            />
+        ))}
+    </>
+));
+
+FAQItemsList.displayName = "FAQItemsList";
+
 export const FAQCategoryComponent: React.FC<FAQCategoryProps> = ({
     category,
     isExpanded,
@@ -66,16 +89,12 @@ export const FAQCategoryComponent: React.FC<FAQCategoryProps> = ({
                 </AtomicText>
                 <View style={styles.titleLine} />
             </View>
-            {category.items.map((item, index) => (
-                <FAQItemComponent
-                    key={item.id}
-                    item={item}
-                    isExpanded={isExpanded(item.id)}
-                    onToggle={() => onToggleItem(item.id)}
-                    isLast={index === category.items.length - 1}
-                    styles={customStyles?.itemStyles}
-                />
-            ))}
+            <FAQItemsList
+                items={category.items}
+                isExpanded={isExpanded}
+                onToggleItem={onToggleItem}
+                customStyles={customStyles}
+            />
         </View>
     );
 };

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

@@ -54,13 +54,16 @@ export const AchievementsList: React.FC<AchievementsListProps> = ({
     );
   }, [achievements]);
 
+  // Memoize empty state check to avoid recalculation
+  const showEmptyState = achievements.length === 0 && emptyAchievementsText;
+
   return (
     <View style={styles.section}>
       <AtomicText style={[styles.sectionTitle, { color: textColor }, sectionTitleStyle]}>
         {achievementsTitle}
       </AtomicText>
 
-      {achievements.length === 0 && emptyAchievementsText ? (
+      {showEmptyState ? (
         <AtomicText style={[styles.emptyText, { color: subtextColor }]}>
           {emptyAchievementsText}
         </AtomicText>

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

@@ -9,6 +9,30 @@ import { StatsCard } from "../StatsCard";
 import { styles } from "./styles";
 import type { StatsCardProps } from "../StatsCard";
 
+// Memoized stats list to prevent unnecessary re-renders when parent updates
+const StatsList: React.FC<{
+  stats: StatsGridProps['stats'];
+  accentColor: string;
+  cardBackgroundColor: string;
+  textColor: string;
+  subtextColor: string;
+}> = React.memo(({ stats, accentColor, cardBackgroundColor, textColor, subtextColor }) => (
+  <>
+    {stats.map((stat) => (
+      <StatsCard
+        key={`${stat.label}-${stat.value}`}
+        {...stat}
+        accentColor={accentColor}
+        backgroundColor={cardBackgroundColor}
+        textColor={textColor}
+        subtextColor={subtextColor}
+      />
+    ))}
+  </>
+));
+
+StatsList.displayName = "StatsList";
+
 export interface StatsGridProps {
   statsTitle: string;
   stats: Array<Omit<StatsCardProps, "accentColor" | "backgroundColor" | "textColor" | "subtextColor">>;
@@ -36,16 +60,13 @@ export const StatsGrid: React.FC<StatsGridProps> = ({
         {statsTitle}
       </AtomicText>
       <View style={styles.statsGrid}>
-        {stats.map((stat) => (
-          <StatsCard
-            key={`${stat.label}-${stat.value}`}
-            {...stat}
-            accentColor={accentColor}
-            backgroundColor={cardBackgroundColor}
-            textColor={textColor}
-            subtextColor={subtextColor}
-          />
-        ))}
+        <StatsList
+          stats={stats}
+          accentColor={accentColor}
+          cardBackgroundColor={cardBackgroundColor}
+          textColor={textColor}
+          subtextColor={subtextColor}
+        />
       </View>
     </View>
   );

package/src/domains/gamification/hooks/useGamification.ts

@@ -5,7 +5,7 @@
 
 import { useCallback, useEffect, useMemo } from "react";
 import { useGamificationStore } from "../store/gamificationStore";
-import { calculateLevel } from "../utils/calculations";
+import { calculateLevel, DEFAULT_POINTS_PER_LEVEL, MAX_PROGRESS } from "../utils/calculations";
 import type { GamificationConfig, LevelState, Achievement } from "../types";
 
 export interface UseGamificationReturn {
@@ -33,9 +33,13 @@ export const useGamification = (
   // Auto-initialize if config provided
   useEffect(() => {
     if (config && !store.isInitialized) {
-      store.initialize(config);
+      store.initialize(config).catch((error) => {
+        // Log error but don't crash - initialization is not critical
+        console.error('[useGamification] Failed to initialize:', error);
+      });
     }
-  }, [config, store.isInitialized, store.initialize]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [config, store.isInitialized]);
 
   // Calculate level from config
   const level = useMemo((): LevelState => {
@@ -43,8 +47,8 @@ export const useGamification = (
       return {
         currentLevel: 1,
         currentPoints: store.points,
-        pointsToNext: 50,
-        progress: Math.min(100, (store.points / 50) * 100),
+        pointsToNext: DEFAULT_POINTS_PER_LEVEL,
+        progress: Math.min(MAX_PROGRESS, (store.points / DEFAULT_POINTS_PER_LEVEL) * MAX_PROGRESS),
       };
     }
     return calculateLevel(store.points, config.levels);

package/src/domains/gamification/store/gamificationStore.ts

@@ -30,8 +30,6 @@ const DEFAULT_STATE: GamificationState = {
   isInitialized: false,
 };
 
-let currentConfig: GamificationConfig | null = null;
-
 export const useGamificationStore = createStore<GamificationState, GamificationActions>({
   name: "gamification-storage",
   initialState: DEFAULT_STATE,
@@ -45,12 +43,15 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
     streak: state.streak,
     isLoading: false,
     isInitialized: false,
+    // Don't persist _config - it's runtime only
   }),
   actions: (set, get) => ({
     initialize: async (config: GamificationConfig) => {
-      currentConfig = config;
       const state = get();
 
+      // Store config in state (not module-level)
+      set({ _config: config, isInitialized: true });
+
       // Initialize achievements from config
       const achievements: Achievement[] = config.achievements.map((def) => ({
         ...def,
@@ -67,7 +68,7 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
         return ach;
       });
 
-      set({ achievements: mergedAchievements, isInitialized: true });
+      set({ achievements: mergedAchievements });
     },
 
     addPoints: (amount: number) => {
@@ -77,7 +78,7 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
 
     completeTask: () => {
       const state = get();
-      const pointsToAdd = currentConfig?.pointsPerAction ?? 15;
+      const pointsToAdd = state._config?.pointsPerAction ?? 15;
 
       const newTotalTasks = state.totalTasksCompleted + 1;
 
@@ -86,9 +87,63 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
         points: state.points + pointsToAdd,
       });
 
-      const actions = get() as GamificationActions;
-      actions.updateStreak();
-      actions.checkAchievements();
+      // Update streak
+      const currentStreak = state.streak.lastActivityDate
+        ? new Date(state.streak.lastActivityDate)
+        : null;
+      const now = new Date();
+
+      let newStreak = state.streak.current;
+
+      if (!currentStreak || !isSameDay(currentStreak, now)) {
+        if (isStreakActive(state.streak.lastActivityDate)) {
+          newStreak = state.streak.current + 1;
+        } else {
+          newStreak = 1;
+        }
+      }
+
+      set({
+        streak: {
+          current: newStreak,
+          longest: Math.max(state.streak.longest, newStreak),
+          lastActivityDate: now.toISOString(),
+        },
+      });
+
+      // Check achievements
+      if (!state.achievements || state.achievements.length === 0) {
+        return;
+      }
+
+      const updatedAchievements = state.achievements.map((ach: Achievement) => {
+        if (ach.isUnlocked) return ach;
+
+        const progress = updateAchievementProgress(
+          ach,
+          newTotalTasks,
+          newStreak
+        );
+
+        const shouldUnlock = checkAchievementUnlock(
+          ach,
+          newTotalTasks,
+          newStreak
+        );
+
+        if (shouldUnlock) {
+          return {
+            ...ach,
+            isUnlocked: true,
+            unlockedAt: new Date().toISOString(),
+            progress: 100,
+          };
+        }
+
+        return { ...ach, progress };
+      });
+
+      set({ achievements: updatedAchievements });
     },
 
     updateStreak: () => {
@@ -118,8 +173,6 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
     },
 
     checkAchievements: (): Achievement[] => {
-      if (!currentConfig) return [];
-
       const state = get();
 
       if (!state.achievements || state.achievements.length === 0) {
@@ -143,7 +196,7 @@ export const useGamificationStore = createStore<GamificationState, GamificationA
           state.streak.current
         );
 
-        if (shouldUnlock && !ach.isUnlocked) {
+        if (shouldUnlock) {
           const unlocked = {
             ...ach,
             isUnlocked: true,

package/src/domains/gamification/types/index.ts

@@ -78,6 +78,8 @@ export interface GamificationState {
   streak: StreakState;
   isLoading: boolean;
   isInitialized: boolean;
+  // Internal config storage (not persisted, kept in memory)
+  _config?: GamificationConfig;
 }
 
 // Store Actions

package/src/domains/gamification/utils/calculations.ts

@@ -5,6 +5,11 @@
 
 import type { LevelDefinition, LevelState, AchievementDefinition } from "../types";
 
+// Constants for gamification calculations
+export const DEFAULT_LEVEL_RANGE = 100;
+export const DEFAULT_POINTS_PER_LEVEL = 50;
+export const MAX_PROGRESS = 100;
+
 export const calculateLevel = (
   points: number,
   levels: LevelDefinition[]
@@ -16,7 +21,7 @@ export const calculateLevel = (
     return {
       currentLevel: 1,
       currentPoints: points,
-      pointsToNext: 0,
+      pointsToNext: DEFAULT_POINTS_PER_LEVEL,
       progress: 0,
     };
   }
@@ -34,8 +39,8 @@ export const calculateLevel = (
   const pointsInLevel = points - currentLevelDef.minPoints;
   const levelRange = nextLevelDef
     ? nextLevelDef.minPoints - currentLevelDef.minPoints
-    : 100;
-  const progress = Math.min(100, (pointsInLevel / levelRange) * 100);
+    : DEFAULT_LEVEL_RANGE;
+  const progress = Math.min(MAX_PROGRESS, (pointsInLevel / levelRange) * MAX_PROGRESS);
   const pointsToNext = nextLevelDef
     ? nextLevelDef.minPoints - points
     : 0;
@@ -70,7 +75,7 @@ export const updateAchievementProgress = (
   currentStreak: number
 ): number => {
   const value = definition.type === "streak" ? currentStreak : tasksCompleted;
-  return Math.min(100, (value / definition.threshold) * 100);
+  return Math.min(MAX_PROGRESS, (value / definition.threshold) * MAX_PROGRESS);
 };
 
 /**

package/src/domains/legal/presentation/components/LegalSection.tsx

@@ -3,6 +3,7 @@ import { ViewStyle } from 'react-native';
 import { LegalConfig } from '../../domain/entities/LegalConfig';
 import { SettingsItemCard } from '../../../../presentation/components/SettingsItemCard';
 import { useSettingsNavigation } from '../../../../presentation/navigation/hooks/useSettingsNavigation';
+import { createRouteOrPressHandler } from '../../../../presentation/navigation/utils/navigationHelpers';
 
 export interface LegalSectionProps {
     config?: LegalConfig;
@@ -29,20 +30,14 @@ export const LegalSection: React.FC<LegalSectionProps> = ({
 
     const navigation = useSettingsNavigation();
 
-    const route = config?.route || config?.defaultRoute || 'Legal';
     const title = propsTitle || config?.title;
     const description = propsDescription || config?.description;
     const sectionTitle = propsSectionTitle;
 
-    const handlePress = () => {
-        if (onPress) {
-            onPress();
-        } else if (config?.onPress) {
-            config.onPress();
-        } else {
-            navigation.navigate(route as 'Legal');
-        }
-    };
+    const handlePress = createRouteOrPressHandler(navigation.navigate, {
+        route: config?.route || config?.defaultRoute || 'Legal',
+        onPress: onPress || config?.onPress,
+    });
 
     if (!title) return null;
 

package/src/domains/localization/index.ts

@@ -19,7 +19,7 @@ export { LanguageSection } from './presentation/components/LanguageSection';
 export type { LanguageSectionProps, LanguageSectionConfig } from './presentation/components/LanguageSection';
 
 // Configuration
-export { default as i18n } from './infrastructure/config/i18n';
+export { i18n } from './infrastructure/config/i18n';
 export { I18nInitializer } from './infrastructure/config/I18nInitializer';
 export {
   DEFAULT_LANGUAGE,

package/src/domains/localization/infrastructure/components/useLanguageNavigation.ts

@@ -1,6 +1,7 @@
 import { useLocalization } from '../hooks/useLocalization';
 import { languageRepository } from '../repository/LanguageRepository';
 import { useSettingsNavigation } from '../../../../presentation/navigation/hooks/useSettingsNavigation';
+import { createRouteOrPressHandler } from '../../../../presentation/navigation/utils/navigationHelpers';
 
 
 export const useLanguageNavigation = (navigationScreen: string) => {
@@ -8,11 +9,9 @@ export const useLanguageNavigation = (navigationScreen: string) => {
   const { currentLanguage } = useLocalization();
   const currentLang = languageRepository.getLanguageByCode(currentLanguage) || languageRepository.getDefaultLanguage();
 
-  const navigateToLanguageSelection = () => {
-    if (navigation && navigationScreen) {
-      navigation.navigate(navigationScreen as 'LanguageSelection');
-    }
-  };
+  const navigateToLanguageSelection = createRouteOrPressHandler(navigation.navigate, {
+    route: navigationScreen,
+  });
 
   return { currentLang, navigateToLanguageSelection };
 };

package/src/domains/localization/infrastructure/config/NamespaceResolver.ts

@@ -32,7 +32,7 @@ export class NamespaceResolver {
         appNamespaces = Object.keys(langTranslations);
       }
     } else {
-      // If structured by namespace (legacy/simple), keys are namespaces
+      // If structured by namespace, keys are namespaces
       appNamespaces = Object.keys(appTranslations);
     }
 

package/src/domains/localization/infrastructure/config/i18n.ts

@@ -6,4 +6,4 @@
 
 import i18n from 'i18next';
 
-export default i18n;
+export { i18n };

package/src/domains/localization/infrastructure/hooks/useTranslation.ts

@@ -8,7 +8,7 @@
 
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import i18n from '../config/i18n';
+import { i18n } from '../config/i18n';
 import { devWarn } from '../../../../utils/devUtils';
 
 export interface TranslationOptions {

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

@@ -8,7 +8,7 @@
  */
 
 import { storageRepository } from '@umituz/react-native-design-system/storage';
-import i18n from '../config/i18n';
+import { i18n } from '../config/i18n';
 import { languageRepository } from '../repository/LanguageRepository';
 import { getDeviceLocale } from '../config/languages';
 

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

@@ -7,7 +7,7 @@
  */
 
 import { storageRepository } from '@umituz/react-native-design-system/storage';
-import i18n from '../config/i18n';
+import { i18n } from '../config/i18n';
 import { languageRepository } from '../repository/LanguageRepository';
 import { isDev } from '../../../../utils/devUtils';
 

package/src/domains/notifications/infrastructure/services/NotificationScheduler.ts

@@ -7,36 +7,43 @@ export class NotificationScheduler {
     try {
       const { title, body, data = {}, trigger, sound = true, badge, categoryIdentifier } = options;
 
-      let notificationTrigger: Notifications.NotificationTriggerInput = null;
+      let notificationTrigger: Notifications.NotificationTriggerInput;
 
-      if (trigger.type === 'date') {
-        notificationTrigger = {
-          date: trigger.date,
-          channelId: categoryIdentifier || 'default',
-        };
-      } else if (trigger.type === 'daily') {
-        notificationTrigger = {
-          hour: trigger.hour,
-          minute: trigger.minute,
-          repeats: true,
-          channelId: categoryIdentifier || 'reminders',
-        };
-      } else if (trigger.type === 'weekly') {
-        notificationTrigger = {
-          weekday: trigger.weekday,
-          hour: trigger.hour,
-          minute: trigger.minute,
-          repeats: true,
-          channelId: categoryIdentifier || 'reminders',
-        };
-      } else if (trigger.type === 'monthly') {
-        notificationTrigger = {
-          day: trigger.day,
-          hour: trigger.hour,
-          minute: trigger.minute,
-          repeats: true,
-          channelId: categoryIdentifier || 'reminders',
-        };
+      switch (trigger.type) {
+        case 'date':
+          notificationTrigger = {
+            date: trigger.date,
+            channelId: categoryIdentifier || 'default',
+          };
+          break;
+        case 'daily':
+          notificationTrigger = {
+            hour: trigger.hour,
+            minute: trigger.minute,
+            repeats: true,
+            channelId: categoryIdentifier || 'reminders',
+          };
+          break;
+        case 'weekly':
+          notificationTrigger = {
+            weekday: trigger.weekday,
+            hour: trigger.hour,
+            minute: trigger.minute,
+            repeats: true,
+            channelId: categoryIdentifier || 'reminders',
+          };
+          break;
+        case 'monthly':
+          notificationTrigger = {
+            day: trigger.day,
+            hour: trigger.hour,
+            minute: trigger.minute,
+            repeats: true,
+            channelId: categoryIdentifier || 'reminders',
+          };
+          break;
+        default:
+          throw new Error(`Unsupported trigger type: ${(trigger as { type: string }).type}`);
       }
 
       const notificationId = await Notifications.scheduleNotificationAsync({

package/src/domains/notifications/presentation/components/NotificationsSection.tsx

@@ -1,7 +1,8 @@
-import React, { useCallback } from 'react';
+import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 import { SettingsItemCard } from '../../../../presentation/components/SettingsItemCard';
 import { useSettingsNavigation } from '../../../../presentation/navigation/hooks/useSettingsNavigation';
+import { createRouteOrPressHandler } from '../../../../presentation/navigation/utils/navigationHelpers';
 
 export interface NotificationsSectionConfig {
   route?: string;
@@ -26,14 +27,10 @@ export const NotificationsSection: React.FC<NotificationsSectionProps> = ({
 }) => {
   const navigation = useSettingsNavigation();
 
-  const handlePress = useCallback(() => {
-    if (config?.onPress) {
-      config.onPress();
-    } else {
-      const route = config?.route || 'Notifications';
-      navigation.navigate(route as 'Notifications');
-    }
-  }, [config?.route, config?.onPress, navigation]);
+  const handlePress = createRouteOrPressHandler(navigation.navigate, {
+    route: config?.route || ('Notifications' as const),
+    onPress: config?.onPress,
+  });
 
   const title = config?.title || "";
   const description = config?.description || "";

package/src/domains/notifications/presentation/hooks/useTimePicker.ts

@@ -62,13 +62,18 @@ export const useTimePicker = ({
   }, [onStartTimeChange, onEndTimeChange]);
 
   const getPickerDate = useCallback((): Date => {
-    const date = new Date();
     if (pickerMode === 'start') {
-      date.setHours(quietHours.startHour, quietHours.startMinute);
-    } else if (pickerMode === 'end') {
-      date.setHours(quietHours.endHour, quietHours.endMinute);
+      // Don't mutate - create new Date with hours/minutes
+      return new Date(
+        new Date().setHours(quietHours.startHour, quietHours.startMinute, 0, 0)
+      );
     }
-    return date;
+    if (pickerMode === 'end') {
+      return new Date(
+        new Date().setHours(quietHours.endHour, quietHours.endMinute, 0, 0)
+      );
+    }
+    return new Date();
   }, [pickerMode, quietHours]);
 
   return {

package/src/domains/notifications/quietHours/infrastructure/hooks/useQuietHoursActions.ts

@@ -11,26 +11,26 @@ export const useQuietHoursActions = () => {
   const quietHours = useQuietHours();
   const { updateQuietHours } = useNotificationStore();
 
-  const setQuietHoursEnabled = useCallback(async (enabled: boolean): Promise<void> => {
+  const setQuietHoursEnabled = useCallback((enabled: boolean): void => {
     // Use getState() to avoid stale closure and race conditions
     const currentQuietHours = useNotificationStore.getState().preferences.quietHours;
-    await updateQuietHours({ ...currentQuietHours, enabled });
+    updateQuietHours({ ...currentQuietHours, enabled });
   }, [updateQuietHours]);
 
-  const setStartTime = useCallback(async (hour: number, minute: number): Promise<void> => {
+  const setStartTime = useCallback((hour: number, minute: number): void => {
     // Use getState() to avoid stale closure and race conditions
     const currentQuietHours = useNotificationStore.getState().preferences.quietHours;
-    await updateQuietHours({ ...currentQuietHours, startHour: hour, startMinute: minute });
+    updateQuietHours({ ...currentQuietHours, startHour: hour, startMinute: minute });
   }, [updateQuietHours]);
 
-  const setEndTime = useCallback(async (hour: number, minute: number): Promise<void> => {
+  const setEndTime = useCallback((hour: number, minute: number): void => {
     // Use getState() to avoid stale closure and race conditions
     const currentQuietHours = useNotificationStore.getState().preferences.quietHours;
-    await updateQuietHours({ ...currentQuietHours, endHour: hour, endMinute: minute });
+    updateQuietHours({ ...currentQuietHours, endHour: hour, endMinute: minute });
   }, [updateQuietHours]);
 
-  const setQuietHours = useCallback(async (config: QuietHoursConfig): Promise<void> => {
-    await updateQuietHours(config);
+  const setQuietHours = useCallback((config: QuietHoursConfig): void => {
+    updateQuietHours(config);
   }, [updateQuietHours]);
 
   const isInQuietHours = useCallback((): boolean => {

package/src/presentation/navigation/SettingsStackNavigator.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from "react";
-import { useNavigation } from "@react-navigation/native";
+import { useAppNavigation } from "@umituz/react-native-design-system/molecules";
 import { StackNavigator, type StackNavigatorConfig } from "@umituz/react-native-design-system/molecules";
 import { useNavigationHandlers, useSettingsScreens } from "./hooks";
 import {
@@ -43,7 +43,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = (pr
   );
 
   // Get navigation for custom sections
-  const navigation = useNavigation();
+  const navigation = useAppNavigation();
 
   const screens = useSettingsScreens({
     ...props,
@@ -51,7 +51,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = (pr
     legalProps: legalScreenProps,
     notificationTranslations,
     quietHoursTranslations,
-    navigation,
+    navigation: navigation as unknown as Record<string, unknown>,
   });
 
   const navigatorConfig: StackNavigatorConfig<SettingsStackParamList> = {

package/src/presentation/navigation/hooks/useSettingsNavigation.ts

@@ -1,28 +1,32 @@
 /**
- * Typed Settings Navigation Hook
+ * Settings Navigation Hook
  *
- * Provides type-safe navigation for Settings stack screens.
- * Replaces unsafe `as never` casts throughout the codebase.
+ * Provides standardized navigation for Settings stack screens.
+ * Uses useAppNavigation from design system for consistency.
+ *
+ * @example
+ * ```typescript
+ * import { useSettingsNavigation } from '@umituz/react-native-settings/presentation/navigation';
+ *
+ * function LanguageSelectionScreen() {
+ *   const navigation = useSettingsNavigation();
+ *   navigation.navigate('Appearance');
+ *   navigation.goBack();
+ * }
+ * ```
  */
 
-import { useNavigation } from '@react-navigation/native';
-import type { StackNavigationProp } from '@react-navigation/stack';
-import type { SettingsStackParamList } from '../types';
+import { useAppNavigation } from '@umituz/react-native-design-system/molecules';
 
 /**
- * Type for Settings navigation prop
+ * Navigation result type inferred from useAppNavigation
  */
-export type SettingsNavigationProp = StackNavigationProp<SettingsStackParamList>;
+type SettingsNavigation = ReturnType<typeof useAppNavigation>;
 
 /**
- * Hook to get typed navigation for Settings screens
- *
- * @example
- * ```typescript
- * const navigation = useSettingsNavigation();
- * navigation.navigate('LanguageSelection'); // Fully typed!
- * ```
+ * Hook to get navigation for Settings screens
+ * Delegates to useAppNavigation for consistent API
  */
-export const useSettingsNavigation = () => {
-  return useNavigation<SettingsNavigationProp>();
+export const useSettingsNavigation = (): SettingsNavigation => {
+  return useAppNavigation();
 };

package/src/presentation/navigation/utils/navigationHelpers.ts

@@ -11,7 +11,7 @@ type NavigateFunction = <RouteName extends keyof SettingsStackParamList>(
 ) => void;
 
 interface RouteOrPressConfig<T extends keyof SettingsStackParamList = keyof SettingsStackParamList> {
-  route?: T;
+  route?: T | string;
   onPress?: () => void;
   fallback?: T;
 }
@@ -26,7 +26,7 @@ export const createRouteOrPressHandler = <T extends keyof SettingsStackParamList
     } else {
       const targetRoute = config.route || config.fallback;
       if (targetRoute) {
-        navigate(targetRoute);
+        navigate(targetRoute as T);
       }
     }
   };

package/src/presentation/screens/components/sections/CustomSettingsList.tsx

@@ -10,6 +10,26 @@ interface CustomSettingsListProps {
 
 const EMPTY_SECTIONS: CustomSettingsSection[] = [];
 
+// Extract to separate memoized component to prevent unnecessary re-renders when other sections change
+const SettingsItemsList: React.FC<{ items: CustomSettingsSection['items'] }> = React.memo(({ items }) => (
+    <>
+        {items?.map((item, itemIndex) => (
+            <SettingsItemCard
+                key={item.id || `item-${itemIndex}`}
+                title={item.title}
+                description={item.subtitle}
+                icon={item.icon}
+                onPress={item.onPress}
+                rightIcon={item.rightIcon}
+                iconBgColor={item.iconBgColor}
+                iconColor={item.iconColor}
+            />
+        ))}
+    </>
+));
+
+SettingsItemsList.displayName = "SettingsItemsList";
+
 export const CustomSettingsList: React.FC<CustomSettingsListProps> = ({ customSections = EMPTY_SECTIONS }) => {
     const sortedSections = useMemo(() => {
         return Array.from(customSections)
@@ -26,18 +46,9 @@ export const CustomSettingsList: React.FC<CustomSettingsListProps> = ({ customSe
                     title={section.title}
                 >
                     {section.content}
-                    {!section.content && section.items && section.items.length > 0 && section.items.map((item, itemIndex) => (
-                        <SettingsItemCard
-                            key={item.id || `item-${itemIndex}`}
-                            title={item.title}
-                            description={item.subtitle}
-                            icon={item.icon}
-                            onPress={item.onPress}
-                            rightIcon={item.rightIcon}
-                            iconBgColor={item.iconBgColor}
-                            iconColor={item.iconColor}
-                        />
-                    ))}
+                    {!section.content && section.items && section.items.length > 0 && (
+                        <SettingsItemsList items={section.items} />
+                    )}
                 </SettingsSection>
             ))}
         </>

package/src/presentation/screens/components/sections/FeatureSettingsSection.tsx

@@ -6,6 +6,7 @@ import { SettingsItemCard } from "../../../components/SettingsItemCard";
 import type { NormalizedConfig } from "../../utils/normalizeConfig";
 import { SettingsSection } from "../../../components/SettingsSection";
 import { useSettingsNavigation } from "../../../navigation/hooks/useSettingsNavigation";
+import { createRouteOrPressHandler } from "../../../navigation/utils/navigationHelpers";
 
 interface FeatureSettingsSectionProps {
   normalizedConfig: NormalizedConfig;
@@ -25,14 +26,10 @@ export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
   const translations = normalizedConfig.translations;
   const navigation = useSettingsNavigation();
 
-  const handleLanguagePress = React.useCallback(() => {
-    if (normalizedConfig.language.config?.onPress) {
-      normalizedConfig.language.config.onPress();
-    } else {
-      const route = normalizedConfig.language.config?.route || "LanguageSelection";
-      navigation.navigate(route as 'LanguageSelection');
-    }
-  }, [navigation, normalizedConfig.language.config]);
+  const handleLanguagePress = createRouteOrPressHandler(navigation.navigate, {
+    route: normalizedConfig.language.config?.route || "LanguageSelection",
+    onPress: normalizedConfig.language.config?.onPress,
+  });
 
   const langCode = currentLanguage || "en-US";
   const currentLanguageData = React.useMemo(() => getLanguageByCode(langCode), [langCode]);

package/src/account.ts

@@ -1,45 +0,0 @@
-/**
- * @umituz/react-native-settings/account
- *
- * NOTE: Auth has been removed from this application.
- * This file provides empty exports for compatibility.
- *
- * Apps that use @umituz/react-native-auth should import directly from that package:
- *   import { AccountScreen, ProfileSection } from '@umituz/react-native-auth';
- */
-
-// Empty exports
-export const AccountScreen: React.ComponentType<Record<string, never>> | null = null;
-export const ProfileSection: React.ComponentType<Record<string, never>> | null = null;
-
-// Stub hooks that return default values
-export const useAuth = () => ({
-  user: null,
-  loading: false,
-  isAuthReady: true,
-  isAnonymous: true,
-});
-
-export const useUserProfile = () => null;
-
-export const useAuthHandlers = () => ({
-  handleRatePress: async () => {},
-  handleSignOut: async () => {},
-  handleDeleteAccount: async () => {},
-  handleSignIn: async () => {},
-});
-
-// Empty types
-export type AccountScreenConfig = Record<string, never>;
-
-// Base hook (no auth version)
-export { useSettingsScreenConfig } from './presentation/hooks/useSettingsScreenConfig';
-
-// Re-export types
-export type {
-  UseSettingsScreenConfigParams,
-  SettingsScreenConfigResult,
-  SettingsFeatures,
-} from './presentation/hooks/useSettingsScreenConfig';
-
-export type { AccountConfig } from './presentation/navigation/types';