@umituz/react-native-settings 4.21.6 → 4.21.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.21.6",
+  "version": "4.21.8",
   "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",

package/src/presentation/navigation/SettingsStackNavigator.tsx

@@ -32,6 +32,7 @@ import {
   createLanguageSelectionScreenOptions,
   createGamificationScreenOptions,
   createAccountScreenOptions,
+  createSettingsMainScreenOptions,
 } from "./utils";
 import type { SettingsStackParamList, SettingsStackNavigatorProps } from "./types";
 import { GamificationScreenWrapper } from "../../domains/gamification";
@@ -57,7 +58,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
   const { handlePrivacyPress, handleTermsPress, handleEulaPress, aboutConfig } =
     useNavigationHandlers(appInfo, legalUrls);
 
-  const screenOptions = React.useMemo(() => createScreenOptions(tokens), [tokens]);
+  const screenOptions = React.useMemo(() => createScreenOptions(tokens, t), [tokens, t]);
   const notificationTranslations = React.useMemo(() => createNotificationTranslations(t), [t]);
   const quietHoursTranslations = React.useMemo(() => createQuietHoursTranslations(t), [t]);
   const legalScreenProps = React.useMemo(
@@ -69,7 +70,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
     <Stack.Navigator screenOptions={screenOptions}>
       <Stack.Screen
         name="SettingsMain"
-        options={{ headerShown: false }}
+        options={showHeader ? createSettingsMainScreenOptions(t) : { headerShown: false }}
       >
         {() => (
           <SettingsScreenWrapper

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

@@ -5,7 +5,9 @@
 
 import type { DesignTokens } from "@umituz/react-native-design-system";
 
-export const createScreenOptions = (tokens: DesignTokens) => ({
+type TranslationFunction = (key: string) => string;
+
+export const createScreenOptions = (tokens: DesignTokens, t: TranslationFunction) => ({
   headerStyle: {
     backgroundColor: tokens.colors.surface,
     borderBottomColor: tokens.colors.borderLight,
@@ -17,6 +19,11 @@ export const createScreenOptions = (tokens: DesignTokens) => ({
     color: tokens.colors.textPrimary,
   },
   headerTintColor: tokens.colors.textPrimary,
+  headerBackTitle: t("settings.title"),
+  headerBackTitleStyle: {
+    fontSize: 16,
+    color: tokens.colors.textPrimary,
+  },
 });
 
 export const createAppearanceScreenOptions = (t: any) => ({
@@ -67,3 +74,9 @@ export const createAccountScreenOptions = (t: any) => ({
   headerTitleAlign: "center" as const,
 });
 
+export const createSettingsMainScreenOptions = (t: any) => ({
+  headerShown: true,
+  headerTitle: t("settings.title"),
+  headerTitleAlign: "center" as const,
+});
+

package/src/presentation/utils/configCreators.ts

@@ -51,6 +51,7 @@ export const createNotificationsConfig = (t: TranslationFunction): Notifications
   route: "Notifications",
   title: t("settings.notifications.title"),
   description: t("settings.notifications.description"),
+  sectionTitle: t("settings.notifications.sectionTitle"),
   icon: "notifications-outline",
 });