handle persist flag

Author: jjoy-zz

README.md

@@ -53,60 +53,65 @@ const App = () => {
 **Basic usage:**
 
 ```typescript
+import { View, Text } from "react-native";
 import { useAutoTranslate } from "react-native-autolocalise";
 
 const MyComponent = () => {
   const { t, loading, error } = useAutoTranslate();
 
   return (
-    <div>
-      <h1>{t("Welcome to our app!", false)}</h1>
-      <p>{t("This text will be automatically translated")}</p>
-      <p style={{ color: "black" }}>
-        welcome
-        <p style={{ color: "read" }}> to </p>our app
-      </p>
-    </div>
+    <View>
+      <Text>{t("Welcome to our app!", false)}</Text>
+      <Text>{t("This text will be automatically translated")}</Text>
+    </View>
   );
 };
 ```
 
 **Use with nested text formatting:**
 
 ```typescript
+import { Text, View } from "react-native";
 import { useAutoTranslate, FormattedText } from "react-native-autolocalise";
 
 const MyComponent = () => {
   const { t } = useAutoTranslate();
 
   return (
-    <FormattedText>
-      <Text>
-        Hello, we <Text style={{ color: "red" }}>want</Text> you to be{" "}
-        <Text style={{ fontWeight: "bold" }}>happy</Text>!
-      </Text>
-    </FormattedText>
+    <View>
+      <FormattedText>
+        <Text>
+          Hello, we <Text style={{ color: "red" }}>want</Text> you to be{" "}
+          <Text style={{ fontWeight: "bold" }}>happy</Text>!
+        </Text>
+      </FormattedText>
+      <FormattedText persist={false}>
+        Hello,
+        <Text style={{ color: "red" }}>World</Text>
+      </FormattedText>
+    </View>
   );
 };
 ```
 
 **Use with params:**
 
 ```typescript
+import { View, Text } from "react-native";
 import { useAutoTranslate } from "react-native-autolocalise";
 
 const MyComponent = () => {
   const { t } = useAutoTranslate();
   const name = "John";
 
   return (
-    <div>
-      <p>
+    <View>
+      <Text>
         {t("Welcome, {{1}}!, Nice to meet you. {{2}}.")
           .replace("{{1}}", name)
           .replace("{{2}}", t("Have a great day!"))}
-      </p>
-    </div>
+      </Text>
+    </View>
   );
 };
 ```

src/components/FormattedText.tsx

@@ -17,11 +17,17 @@ import { useAutoTranslate } from "../context/TranslationContext";
 interface FormattedTextProps {
   children: React.ReactNode;
   style?: TextStyle;
+  /**
+   * Whether to persist the text for review in the dashboard.
+   * @default true
+   */
+  persist?: boolean;
 }
 
 export const FormattedText: React.FC<FormattedTextProps> = ({
   children,
   style,
+  persist = true,
 }) => {
   const { t } = useAutoTranslate();
 
@@ -88,7 +94,7 @@ export const FormattedText: React.FC<FormattedTextProps> = ({
   };
 
   const { text, styles } = extractTextAndStyles(children);
-  const translatedText = t(text);
+  const translatedText = t(text, persist);
 
   return <Text style={style}>{restoreStyledText(translatedText, styles)}</Text>;
 };