@umituz/react-native-settings 4.23.95 → 4.23.97

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.23.95",
+  "version": "4.23.97",
   "description": "Complete settings hub for React Native apps - consolidated package with settings, localization, about, legal, appearance, feedback, FAQs, rating, and gamification",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/presentation/screens/components/GamificationSettingsItem.tsx

@@ -10,13 +10,17 @@ import { compareGamificationProps } from "../../../infrastructure/utils/memoComp
 export interface GamificationSettingsItemProps {
   config: GamificationItemConfig;
   gamificationConfig?: GamificationSettingsConfig;
-  t: (key: string) => string;
+  t?: (key: string) => string;
+  noBackground?: boolean;
+  hideMargin?: boolean;
 }
 
 const GamificationSettingsItemComponent: React.FC<GamificationSettingsItemProps> = ({
   config,
   gamificationConfig,
-  t
+  t,
+  noBackground,
+  hideMargin,
 }) => {
   const navigation = useAppNavigation();
   const { level } = useGamification(gamificationConfig);
@@ -41,6 +45,8 @@ const GamificationSettingsItemComponent: React.FC<GamificationSettingsItemProps>
       icon={icon}
       onPress={handlePress}
       sectionTitle={config.sectionTitle}
+      noBackground={noBackground}
+      hideMargin={hideMargin}
     />
   );
 };

package/src/presentation/screens/components/SettingsContent.tsx

@@ -70,7 +70,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
   devSettings,
   gamificationConfig,
 }) => {
-  const { t } = useLocalization();
+  const translations = normalizedConfig.translations;
 
   // Optimize: Only track individual feature flags instead of entire object
   const hasAnyFeatures = useMemo(() =>
@@ -113,33 +113,40 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
       <CustomSettingsList customSections={customSections} />
 
       {features.subscription && (normalizedConfig.subscription.config?.route || normalizedConfig.subscription.config?.onPress) && (
-        <SubscriptionSettingsItem config={normalizedConfig.subscription.config} t={t} />
+        <SubscriptionSettingsItem 
+          config={normalizedConfig.subscription.config} 
+        />
       )}
 
       {features.wallet && normalizedConfig.wallet.config?.route && (
         <WalletSettingsItem
           config={normalizedConfig.wallet.config}
-          t={t}
         />
       )}
 
-      {features.gamification && (
-        <GamificationSettingsItem
-          config={normalizedConfig.gamification.config || {}}
-          gamificationConfig={gamificationConfig}
-          t={t}
-        />
-      )}
+      <FeatureSettingsSection normalizedConfig={normalizedConfig} features={features} />
 
-      {features.videoTutorial && (
-        <VideoTutorialSettingsItem
-          config={normalizedConfig.videoTutorial.config || {}}
-          t={t}
-        />
+      {(features.gamification || features.videoTutorial) && (
+        <SettingsSection title={translations?.sections?.progress || "Progress"}>
+          {features.gamification && (
+            <GamificationSettingsItem
+              config={normalizedConfig.gamification.config || {}}
+              gamificationConfig={gamificationConfig}
+              noBackground={true}
+              hideMargin={true}
+            />
+          )}
+
+          {features.videoTutorial && (
+            <VideoTutorialSettingsItem
+              config={normalizedConfig.videoTutorial.config || {}}
+              noBackground={true}
+              hideMargin={true}
+            />
+          )}
+        </SettingsSection>
       )}
 
-      <FeatureSettingsSection normalizedConfig={normalizedConfig} features={features} />
-
       <IdentitySettingsSection normalizedConfig={normalizedConfig} features={features} />
 
       <SupportSettingsSection normalizedConfig={normalizedConfig} features={features} />
@@ -148,7 +155,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
 
       {!hasAnyFeatures && (
         <View style={styles.emptyContainer}>
-          <SettingsSection title={emptyStateText || t("settings.noOptionsAvailable")}>
+          <SettingsSection title={emptyStateText || translations?.noOptionsAvailable || "No options available"}>
             <View />
           </SettingsSection>
         </View>
@@ -160,7 +167,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
         <SettingsFooter
           versionText={footerText}
           appVersion={appVersion}
-          versionLabel={t("settings.footer.version")}
+          versionLabel={translations?.footer?.version || "Version"}
         />
       )}
     </View>

package/src/presentation/screens/components/SubscriptionSettingsItem.tsx

@@ -7,7 +7,7 @@ import { compareConfigAndTranslate } from "../../../infrastructure/utils/memoCom
 
 export interface SubscriptionSettingsItemProps {
   config: SubscriptionConfig;
-  t: (key: string) => string;
+  t?: (key: string) => string;
 }
 
 const SubscriptionSettingsItemComponent: React.FC<SubscriptionSettingsItemProps> = ({ config, t }) => {

package/src/presentation/screens/components/VideoTutorialSettingsItem.tsx

@@ -7,12 +7,16 @@ import { compareConfigAndTranslate } from "../../../infrastructure/utils/memoCom
 
 export interface VideoTutorialSettingsItemProps {
   config: VideoTutorialConfig;
-  t: (key: string) => string;
+  t?: (key: string) => string;
+  noBackground?: boolean;
+  hideMargin?: boolean;
 }
 
 const VideoTutorialSettingsItemComponent: React.FC<VideoTutorialSettingsItemProps> = ({
   config,
-  t
+  t,
+  noBackground,
+  hideMargin,
 }) => {
   const navigation = useAppNavigation();
 
@@ -36,6 +40,8 @@ const VideoTutorialSettingsItemComponent: React.FC<VideoTutorialSettingsItemProp
       icon={icon}
       onPress={handlePress}
       sectionTitle={config.sectionTitle}
+      noBackground={noBackground}
+      hideMargin={hideMargin}
     />
   );
 };

package/src/presentation/screens/components/WalletSettingsItem.tsx

@@ -7,7 +7,7 @@ import { compareConfigAndTranslate } from "../../../infrastructure/utils/memoCom
 
 export interface WalletSettingsItemProps {
   config: WalletConfig;
-  t: (key: string) => string;
+  t?: (key: string) => string;
 }
 
 const WalletSettingsItemComponent: React.FC<WalletSettingsItemProps> = ({ config, t }) => {
@@ -21,8 +21,8 @@ const WalletSettingsItemComponent: React.FC<WalletSettingsItemProps> = ({ config
 
   return (
     <SettingsItemCard
-      title={config.title || t("wallet.title")}
-      description={config.description || t("wallet.description")}
+      title={config.title || (t ? t("wallet.title") : "Wallet")}
+      description={config.description || (t ? t("wallet.description") : "View your wallet")}
       icon={(config.icon || "wallet") as IconName}
       onPress={handlePress}
       sectionTitle={config.sectionTitle}

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

@@ -15,13 +15,15 @@ interface FeatureSettingsSectionProps {
     language: boolean;
     notifications: boolean;
   };
+  currentLanguage?: string;
 }
 
 export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
   normalizedConfig,
   features,
+  currentLanguage,
 }) => {
-  const { t, currentLanguage } = useLocalization();
+  const translations = normalizedConfig.translations;
   const navigation = useAppNavigation();
 
   const handleLanguagePress = React.useCallback(() => {
@@ -33,9 +35,13 @@ export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
     }
   }, [navigation, normalizedConfig.language.config]);
 
-  const currentLanguageData = React.useMemo(() => getLanguageByCode(currentLanguage), [currentLanguage]);
+  const currentLanguageData = React.useMemo(() => 
+    currentLanguage ? getLanguageByCode(currentLanguage) : null, 
+    [currentLanguage]
+  );
+  
   const languageDisplayName = React.useMemo(() => {
-    if (!currentLanguageData) return currentLanguage;
+    if (!currentLanguageData) return currentLanguage || "";
     return `${currentLanguageData.flag} ${currentLanguageData.nativeName}`;
   }, [currentLanguageData, currentLanguage]);
 
@@ -43,14 +49,14 @@ export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
 
   return (
     <SettingsSection
-      title={t("settings.sections.app.title") || t("settings.sections.app") || "App Settings"}
+      title={translations?.sections?.app || "App Settings"}
     >
       {features.appearance && (
         <AppearanceSection
           config={{
             ...normalizedConfig.appearance.config,
-            title: t("settings.appearance.title"),
-            description: t("settings.appearance.description"),
+            title: translations?.features?.appearance?.title || "Appearance",
+            description: translations?.features?.appearance?.description || "Theme settings",
           }}
           noBackground={true}
           hideMargin={true}
@@ -59,7 +65,7 @@ export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
 
       {features.language && (
         <SettingsItemCard
-          title={t("settings.languageSelection.title")}
+          title={translations?.features?.language?.title || "Language"}
           description={languageDisplayName}
           icon="globe-outline"
           onPress={handleLanguagePress}
@@ -72,8 +78,8 @@ export const FeatureSettingsSection: React.FC<FeatureSettingsSectionProps> = ({
         <NotificationsSection
           config={{
             ...normalizedConfig.notifications.config,
-            title: t("settings.notifications.title"),
-            description: t("settings.notifications.description"),
+            title: translations?.features?.notifications?.title || "Notifications",
+            description: translations?.features?.notifications?.description || "Push notification settings",
           }}
           noBackground={true}
           hideMargin={true}

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

@@ -15,18 +15,18 @@ export const IdentitySettingsSection: React.FC<IdentitySettingsSectionProps> = (
     normalizedConfig,
     features,
 }) => {
-    const { t } = useLocalization();
+    const translations = normalizedConfig.translations;
 
     if (!features.about && !features.legal) return null;
 
     return (
-        <SettingsSection title={t("settings.about.title")}>
+        <SettingsSection title={translations?.sections?.about || "About"}>
             {features.about && (
                 <AboutSection
                     config={{
                         ...normalizedConfig.about.config,
-                        title: t("settings.about.title"),
-                        description: t("settings.about.description"),
+                        title: translations?.features?.about?.title || "About",
+                        description: translations?.features?.about?.description || "About the app",
                     }}
                     noBackground={true}
                     hideMargin={true}
@@ -37,8 +37,8 @@ export const IdentitySettingsSection: React.FC<IdentitySettingsSectionProps> = (
                 <LegalSection
                     config={{
                         ...normalizedConfig.legal.config,
-                        title: t("settings.legal.title"),
-                        description: t("settings.legal.description"),
+                        title: translations?.features?.legal?.title || "Legal",
+                        description: translations?.features?.legal?.description || "Privacy Policy & Terms",
                     }}
                     noBackground={true}
                     hideMargin={true}

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

@@ -16,7 +16,7 @@ export const SupportSettingsSection: React.FC<SupportSettingsSectionProps> = ({
     features,
     normalizedConfig,
 }) => {
-    const { t } = useLocalization();
+    const translations = normalizedConfig.translations;
     const navigation = useAppNavigation();
 
     const handleFAQPress = useCallback(() => {
@@ -26,7 +26,7 @@ export const SupportSettingsSection: React.FC<SupportSettingsSectionProps> = ({
     if (!(features.feedback || features.rating || features.faqs)) return null;
 
     return (
-        <SettingsSection title={t("settings.support.title")}>
+        <SettingsSection title={translations?.sections?.support || "Support"}>
             {(features.feedback || features.rating) && (
                 <SupportSection
                     renderSection={(props: { title: string; children: React.ReactNode }) => <>{props.children}</>}
@@ -42,8 +42,8 @@ export const SupportSettingsSection: React.FC<SupportSettingsSectionProps> = ({
                     feedbackConfig={{
                         enabled: features.feedback,
                         config: {
-                            title: normalizedConfig.feedback.config?.title || t("settings.feedback.title"),
-                            description: normalizedConfig.feedback.config?.description || t("settings.feedback.description"),
+                            title: normalizedConfig.feedback.config?.title || translations?.features?.feedback?.title || "Feedback",
+                            description: normalizedConfig.feedback.config?.description || translations?.features?.feedback?.description || "Give us your feedback",
                             initialType: normalizedConfig.feedback.config?.initialType,
                             onSubmit: normalizedConfig.feedback.config?.onSubmit,
                             onPress: normalizedConfig.feedback.config?.onPress,
@@ -52,32 +52,32 @@ export const SupportSettingsSection: React.FC<SupportSettingsSectionProps> = ({
                     ratingConfig={{
                         enabled: features.rating,
                         config: {
-                            title: normalizedConfig.rating.config?.title || t("settings.rating.title"),
-                            description: normalizedConfig.rating.config?.description || t("settings.rating.description"),
+                            title: normalizedConfig.rating.config?.title || translations?.features?.rating?.title || "Rate Us",
+                            description: normalizedConfig.rating.config?.description || translations?.features?.rating?.description || "Love the app? Rate us!",
                             storeUrl: normalizedConfig.rating.config?.storeUrl,
                             onRate: normalizedConfig.rating.config?.onRate,
                         }
                     }}
                     feedbackModalTexts={{
-                        title: t("settings.feedback.modal.title"),
-                        ratingLabel: t("settings.feedback.modal.ratingLabel"),
-                        descriptionPlaceholder: t("settings.feedback.modal.descriptionPlaceholder"),
-                        submitButton: t("settings.feedback.modal.submitButton"),
-                        submittingButton: t("settings.feedback.modal.submittingButton"),
+                        title: translations?.feedbackModal?.title || "Send Feedback",
+                        ratingLabel: translations?.feedbackModal?.ratingLabel || "Rating",
+                        descriptionPlaceholder: translations?.feedbackModal?.descriptionPlaceholder || "Feedback",
+                        submitButton: translations?.feedbackModal?.submitButton || "Submit",
+                        submittingButton: translations?.feedbackModal?.submittingButton || "Submitting...",
                         feedbackTypes: [
-                            { type: 'general', label: t("settings.feedback.types.general") },
-                            { type: 'bug_report', label: t("settings.feedback.types.bugReport") },
-                            { type: 'feature_request', label: t("settings.feedback.types.featureRequest") },
-                            { type: 'improvement', label: t("settings.feedback.types.improvement") },
-                            { type: 'other', label: t("settings.feedback.types.other") },
+                            { type: 'general', label: translations?.feedbackModal?.types?.general || "General" },
+                            { type: 'bug_report', label: translations?.feedbackModal?.types?.bugReport || "Bug Report" },
+                            { type: 'feature_request', label: translations?.feedbackModal?.types?.featureRequest || "Feature Request" },
+                            { type: 'improvement', label: translations?.feedbackModal?.types?.improvement || "Improvement" },
+                            { type: 'other', label: translations?.feedbackModal?.types?.other || "Other" },
                         ],
                         defaultTitle: (type) => {
                             const titles: Record<string, string> = {
-                                general: t("settings.feedback.types.general"),
-                                bug_report: t("settings.feedback.types.bugReport"),
-                                feature_request: t("settings.feedback.types.featureRequest"),
-                                improvement: t("settings.feedback.types.improvement"),
-                                other: t("settings.feedback.types.other"),
+                                general: translations?.feedbackModal?.types?.general || "General",
+                                bug_report: translations?.feedbackModal?.types?.bugReport || "Bug Report",
+                                feature_request: translations?.feedbackModal?.types?.featureRequest || "Feature Request",
+                                improvement: translations?.feedbackModal?.types?.improvement || "Improvement",
+                                other: translations?.feedbackModal?.types?.other || "Other",
                             };
                             return titles[type] || type;
                         },
@@ -87,8 +87,8 @@ export const SupportSettingsSection: React.FC<SupportSettingsSectionProps> = ({
 
             {features.faqs && (
                 <SettingsItemCard
-                    title={normalizedConfig.faqs.config?.title || t("settings.faqs.title")}
-                    description={normalizedConfig.faqs.config?.description || t("settings.faqs.description")}
+                    title={normalizedConfig.faqs.config?.title || translations?.features?.faqs?.title || "FAQ"}
+                    description={normalizedConfig.faqs.config?.description || translations?.features?.faqs?.description || "Frequently Asked Questions"}
                     icon="help-circle-outline"
                     onPress={handleFAQPress}
                     noBackground={true}

package/src/presentation/screens/types/SettingsConfig.ts

@@ -55,7 +55,53 @@ import type {
  *   },
  * };
  */
+/**
+ * Global Settings Translations
+ */
+export interface SettingsTranslations {
+  sections?: {
+    app?: string;
+    progress?: string;
+    about?: string;
+    support?: string;
+    subscription?: string;
+  };
+  features?: {
+    appearance?: { title?: string; description?: string };
+    language?: { title?: string };
+    notifications?: { title?: string; description?: string };
+    about?: { title?: string; description?: string };
+    legal?: { title?: string; description?: string };
+    feedback?: { title?: string; description?: string };
+    rating?: { title?: string; description?: string };
+    faqs?: { title?: string; description?: string };
+  };
+  feedbackModal?: {
+    title?: string;
+    ratingLabel?: string;
+    descriptionPlaceholder?: string;
+    submitButton?: string;
+    submittingButton?: string;
+    types?: {
+      general?: string;
+      bugReport?: string;
+      featureRequest?: string;
+      improvement?: string;
+      other?: string;
+    };
+  };
+  noOptionsAvailable?: string;
+  footer?: {
+    version?: string;
+  };
+}
+
 export interface SettingsConfig {
+  /**
+   * Application-wide translations
+   */
+  translations?: SettingsTranslations;
+
   /**
    * Appearance settings (Theme customization)
    * @default 'auto'

package/src/presentation/screens/types/index.ts

@@ -24,5 +24,5 @@ export type {
   VideoTutorialConfig,
 } from "./UserFeatureConfig";
 export type { GamificationSettingsConfig as GamificationConfig } from "../../../domains/gamification";
-export type { SettingsConfig } from "./SettingsConfig";
+export type { SettingsConfig, SettingsTranslations } from "./SettingsConfig";
 export type { CustomSettingsSection } from "./CustomSection";

package/src/presentation/screens/utils/normalizeConfig.ts

@@ -79,6 +79,7 @@ export interface NormalizedConfig {
     enabled: boolean;
     config?: VideoTutorialConfig;
   };
+  translations?: import("../types").SettingsTranslations;
 }
 
 /**
@@ -128,5 +129,6 @@ export function normalizeSettingsConfig(
     wallet: normalizeConfigValue(config?.wallet, false),
     gamification: normalizeConfigValue(config?.gamification, "auto"),
     videoTutorial: normalizeConfigValue(config?.videoTutorial, "auto"),
+    translations: config?.translations,
   };
 }

package/src/presentation/utils/config-creators/feature-configs.ts

@@ -50,6 +50,8 @@ export const createGamificationConfig = (
   translations: {
     title: t("settings.gamification.title"),
     statsTitle: t("settings.gamification.stats.title"),
+    pointsLabel: t("settings.gamification.stats.points"),
+    totalCompletedLabel: t("settings.gamification.stats.totalCompleted"),
     achievementsTitle: t("settings.gamification.achievements.title"),
     streakTitle: t("settings.gamification.streak.title"),
     bestStreak: t("settings.gamification.streak.best"),