@umituz/react-native-settings 4.10.0 → 4.11.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.10.0",
+  "version": "4.11.0",
   "description": "Settings management for React Native apps - user preferences, theme, language, notifications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/presentation/components/DevSettingsSection.tsx

@@ -2,12 +2,14 @@
  * Dev Settings Section Component
  * Only visible in __DEV__ mode
  * Provides development utilities like clearing storage
+ *
+ * NOTE: This component uses hardcoded English text since it's DEV-only
+ * and doesn't need localization support.
  */
 
 import React from "react";
 import { Alert } from "react-native";
 import { Feather } from "@expo/vector-icons";
-import { useLocalization } from "@umituz/react-native-localization";
 import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
 import { storageRepository } from "@umituz/react-native-storage";
 import { SettingsSection } from "./SettingsSection";
@@ -18,29 +20,40 @@ const TrashIcon: React.FC<{ size?: number; color?: string }> = ({ size = 24, col
   <Feather name="trash-2" size={size} color={color} />
 );
 
+// Default texts (English only - DEV feature)
+const DEFAULT_TEXTS = {
+  sectionTitle: "Developer",
+  clearTitle: "Clear All Data",
+  clearDescription: "Reset app to initial state (DEV only)",
+  confirmTitle: "Clear All Data?",
+  confirmMessage: "This will clear all app data and reset to initial state. This action cannot be undone.",
+  cancelButton: "Cancel",
+  confirmButton: "Clear",
+  successTitle: "Success",
+  successMessage: "All data cleared. Restarting app...",
+  errorTitle: "Error",
+  errorMessage: "Failed to clear data",
+};
+
 export interface DevSettingsProps {
   /** Enable dev settings section (default: true in __DEV__ mode) */
   enabled?: boolean;
-  /** Optional callback after storage is cleared (e.g., reload app) */
+  /** Callback after storage is cleared - use this to reload the app */
   onAfterClear?: () => Promise<void>;
-  /** Custom title for the section */
-  sectionTitle?: string;
-  /** Custom title for clear data button */
-  clearDataTitle?: string;
-  /** Custom description for clear data button */
-  clearDataDescription?: string;
+  /** Custom texts (optional - defaults to English) */
+  texts?: Partial<typeof DEFAULT_TEXTS>;
 }
 
 export const DevSettingsSection: React.FC<DevSettingsProps> = ({
   enabled = true,
   onAfterClear,
-  sectionTitle,
-  clearDataTitle,
-  clearDataDescription,
+  texts = {},
 }) => {
-  const { t } = useLocalization();
   const tokens = useAppDesignTokens();
 
+  // Merge custom texts with defaults
+  const t = { ...DEFAULT_TEXTS, ...texts };
+
   // Only render in development mode and when enabled
   if (!__DEV__ || !enabled) {
     return null;
@@ -48,35 +61,33 @@ export const DevSettingsSection: React.FC<DevSettingsProps> = ({
 
   const handleClearData = () => {
     Alert.alert(
-      t("settings.devSettings.clearData.confirmTitle") || "Clear All Data?",
-      t("settings.devSettings.clearData.confirmMessage") || "This will clear all app data and reset to initial state. This action cannot be undone.",
+      t.confirmTitle,
+      t.confirmMessage,
       [
         {
-          text: t("common.cancel") || "Cancel",
+          text: t.cancelButton,
           style: "cancel",
         },
         {
-          text: t("common.confirm") || "Confirm",
+          text: t.confirmButton,
           style: "destructive",
           onPress: async () => {
             try {
-              // Clear all storage using the package's storageRepository
+              // Clear all storage
               await storageRepository.clearAll();
 
-              // Call optional after-clear callback (e.g., reload app)
+              // If callback provided, call it (e.g., reload app)
               if (onAfterClear) {
-                await onAfterClear();
+                Alert.alert(t.successTitle, t.successMessage);
+                // Small delay to show the alert before reload
+                setTimeout(async () => {
+                  await onAfterClear();
+                }, 500);
+              } else {
+                Alert.alert(t.successTitle, "All data cleared successfully");
               }
-
-              Alert.alert(
-                t("common.success") || "Success",
-                t("settings.devSettings.clearData.success") || "All data cleared successfully"
-              );
             } catch {
-              Alert.alert(
-                t("common.error") || "Error",
-                t("settings.devSettings.clearData.error") || "Failed to clear data"
-              );
+              Alert.alert(t.errorTitle, t.errorMessage);
             }
           },
         },
@@ -85,16 +96,11 @@ export const DevSettingsSection: React.FC<DevSettingsProps> = ({
   };
 
   return (
-    <SettingsSection
-      title={sectionTitle || t("settings.devSettings.title") || "Developer"}
-    >
+    <SettingsSection title={t.sectionTitle}>
       <SettingItem
         icon={TrashIcon}
-        title={clearDataTitle || t("settings.devSettings.clearData.title") || "Clear All Data"}
-        value={
-          clearDataDescription ||
-          t("settings.devSettings.clearData.description") || "Reset app to initial state (DEV only)"
-        }
+        title={t.clearTitle}
+        value={t.clearDescription}
         onPress={handleClearData}
         iconColor={tokens.colors.error}
         titleColor={tokens.colors.error}

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

@@ -224,9 +224,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
         <DevSettingsSection
           enabled={devSettings.enabled}
           onAfterClear={devSettings.onAfterClear}
-          sectionTitle={devSettings.sectionTitle}
-          clearDataTitle={devSettings.clearDataTitle}
-          clearDataDescription={devSettings.clearDataDescription}
+          texts={devSettings.texts}
         />
       )}