@umituz/react-native-settings 4.21.16 → 4.21.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.21.16",
+  "version": "4.21.18",
   "description": "Complete settings hub for React Native apps - consolidated package with settings, about, legal, appearance, feedback, FAQs, rating, and gamification",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -35,11 +35,9 @@
     "url": "https://github.com/umituz/react-native-settings"
   },
   "dependencies": {
-    "@umituz/react-native-auth": "latest",
-    "@umituz/react-native-design-system": "latest",
-    "@umituz/react-native-localization": "latest",
-    "@umituz/react-native-storage": "latest",
-    "@umituz/react-native-tanstack": "latest",
+    "@umituz/react-native-auth": "*",
+    "@umituz/react-native-design-system": "*",
+    "@umituz/react-native-localization": "*",
     "firebase": "^12.7.0"
   },
   "peerDependencies": {

package/src/domains/appearance/infrastructure/repositories/AppearanceRepository.ts

@@ -1,4 +1,4 @@
-import { storageRepository, unwrap } from "@umituz/react-native-storage";
+import { storageRepository, unwrap } from "@umituz/react-native-design-system";
 import { IAppearanceRepository } from "../../application/ports/IAppearanceRepository";
 import { AppearanceSettings } from "../../types";
 

package/src/domains/appearance/presentation/screens/AppearanceScreen.tsx

@@ -6,7 +6,13 @@
  */
 
 import React, { useMemo, useCallback } from "react";
-import { ScreenLayout, useAppDesignTokens } from "@umituz/react-native-design-system";
+// @ts-ignore - Optional peer dependency
+import { useNavigation } from "@react-navigation/native";
+import { 
+  ScreenLayout, 
+  useAppDesignTokens,
+  NavigationHeader
+} from "@umituz/react-native-design-system";
 import { useLocalization } from "@umituz/react-native-localization";
 import { useAppearance, useAppearanceActions } from "../../hooks";
 import {
@@ -33,6 +39,7 @@ export const AppearanceScreen: React.FC<AppearanceScreenProps> = ({
   showColorsSection = true,
   showPreviewSection = true,
 }) => {
+  const navigation = useNavigation();
   const tokens = useAppDesignTokens();
   const { t } = useLocalization();
   const { themeMode } = useAppearance();
@@ -152,7 +159,15 @@ export const AppearanceScreen: React.FC<AppearanceScreenProps> = ({
   ]);
 
   return (
-    <ScreenLayout hideScrollIndicator>
+    <ScreenLayout 
+      hideScrollIndicator
+      header={
+        <NavigationHeader 
+          title={t("settings.appearance.title")} 
+          onBackPress={() => navigation.goBack()} 
+        />
+      }
+    >
       {headerComponentMemo}
       {themeSectionMemo}
       {colorsSectionMemo}

package/src/domains/dev/presentation/components/DevSettingsSection.tsx

@@ -9,8 +9,7 @@
 
 import React from "react";
 import { Alert } from "react-native";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
-import { storageRepository } from "@umituz/react-native-storage";
+import { useAppDesignTokens, storageRepository } from "@umituz/react-native-design-system";
 import { SettingsSection } from "../../../../presentation/components/SettingsSection";
 import { SettingsItemCard } from "../../../../presentation/components/SettingsItemCard";
 

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

@@ -3,7 +3,7 @@
  * Zustand store with persist middleware
  */
 
-import { createStore } from "@umituz/react-native-storage";
+import { createStore } from "@umituz/react-native-design-system";
 import type {
   GamificationState,
   GamificationActions,

package/src/domains/notifications/infrastructure/hooks/useNotificationSettings.ts

@@ -2,7 +2,7 @@
  * Simple notification settings hook
  */
 
-import { createStore } from '@umituz/react-native-storage';
+import { createStore } from '@umituz/react-native-design-system';
 
 interface NotificationSettingsState {
   notificationsEnabled: boolean;

package/src/domains/notifications/infrastructure/storage/NotificationsStore.ts

@@ -4,7 +4,7 @@
  * NO backend, NO user IDs, NO notification history
  */
 
-import { createStore } from '@umituz/react-native-storage';
+import { createStore } from '@umituz/react-native-design-system';
 
 interface NotificationsState {
   hasPermissions: boolean;

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

@@ -5,7 +5,16 @@
 
 import React from 'react';
 import { View } from 'react-native';
-import { AtomicCard, ScreenLayout, AtomicSpinner } from '@umituz/react-native-design-system';
+// @ts-ignore - Optional peer dependency
+import { useNavigation } from '@react-navigation/native';
+import { 
+  AtomicCard, 
+  ScreenLayout, 
+  AtomicSpinner,
+  NavigationHeader,
+  useAppDesignTokens
+} from '@umituz/react-native-design-system';
+import { useLocalization } from '@umituz/react-native-localization';
 import { QuietHoursCard } from '../../quietHours/presentation/components/QuietHoursCard';
 import { SettingRow } from '../components/SettingRow';
 import { RemindersNavRow } from '../components/RemindersNavRow';
@@ -15,7 +24,6 @@ import { useReminders } from '../../reminders/infrastructure/storage/RemindersSt
 import { useQuietHoursActions } from '../../quietHours/infrastructure/hooks/useQuietHoursActions';
 import type { NotificationSettingsTranslations, QuietHoursTranslations } from '../../infrastructure/services/types';
 import { createStyles } from './NotificationSettingsScreen.styles';
-import { useAppDesignTokens } from '@umituz/react-native-design-system';
 // @ts-ignore - Optional peer dependency
 import DateTimePicker from '@react-native-community/datetimepicker';
 
@@ -30,7 +38,9 @@ export const NotificationSettingsScreen: React.FC<NotificationSettingsScreenProp
   quietHoursTranslations,
   onHapticFeedback,
 }) => {
+  const navigation = useNavigation();
   const tokens = useAppDesignTokens();
+  const { t } = useLocalization();
   const styles = createStyles(tokens);
   const reminders = useReminders();
   const { setStartTime, setEndTime } = useQuietHoursActions();
@@ -55,16 +65,33 @@ export const NotificationSettingsScreen: React.FC<NotificationSettingsScreenProp
     // Navigate to reminders screen when implemented
   };
 
+  const headerTitle = translations.screenTitle || t("settings.notifications.title");
+
   if (isLoading) {
     return (
-      <ScreenLayout>
+      <ScreenLayout
+        header={
+          <NavigationHeader 
+            title={headerTitle} 
+            onBackPress={() => navigation.goBack()} 
+          />
+        }
+      >
         <AtomicSpinner size="lg" color="primary" fullContainer />
       </ScreenLayout>
     );
   }
 
   return (
-    <ScreenLayout hideScrollIndicator>
+    <ScreenLayout 
+      hideScrollIndicator
+      header={
+        <NavigationHeader 
+          title={headerTitle} 
+          onBackPress={() => navigation.goBack()} 
+        />
+      }
+    >
       <View style={styles.container}>
         <AtomicCard style={styles.card}>
           <SettingRow

package/src/domains/notifications/reminders/infrastructure/storage/RemindersStore.ts

@@ -3,7 +3,7 @@
  * Manages reminder state with AsyncStorage persistence
  */
 
-import { createStore } from '@umituz/react-native-storage';
+import { createStore } from '@umituz/react-native-design-system';
 import type { Reminder, QuietHoursConfig, NotificationPreferences } from '../../../infrastructure/services/types';
 
 // ============================================================================

package/src/infrastructure/repositories/SettingsRepository.ts

@@ -1,10 +1,10 @@
 /**
  * Settings Repository Implementation
  *
- * Handles data access for user settings using @umituz/react-native-storage
+ * Handles data access for user settings using @umituz/react-native-design-system
  */
 
-import { storageRepository, StorageKey, createUserKey } from '@umituz/react-native-storage';
+import { storageRepository, StorageKey, createUserKey } from '@umituz/react-native-design-system';
 import type { ISettingsRepository, UserSettings, SettingsResult } from '../../application/ports/ISettingsRepository';
 
 export class SettingsRepository implements ISettingsRepository {

package/src/presentation/navigation/SettingsStackNavigator.tsx

@@ -99,7 +99,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
       <Stack.Screen
         name="Appearance"
         component={AppearanceScreen}
-        options={{ headerTitle: t("settings.appearance.title") }}
+        options={{ headerShown: false }}
       />
 
       <Stack.Screen name="About" options={{ headerTitle: t("settings.about.title") }}>
@@ -112,7 +112,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
 
       <Stack.Screen
         name="Notifications"
-        options={{ headerTitle: t("settings.notifications.title") }}
+        options={{ headerShown: false }}
       >
         {() => (
           <NotificationSettingsScreen
@@ -166,10 +166,11 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
 
       <Stack.Screen
         name="LanguageSelection"
-        options={{ headerTitle: t("settings.language.title") }}
+        options={{ headerShown: false }}
       >
         {() => (
           <LanguageSelectionScreen
+            headerTitle={t("settings.language.title")}
             searchPlaceholder={t("settings.languageSelection.searchPlaceholder")}
           />
         )}