Update translations.

components/settings/settings.jsx

@@ -1,5 +1,5 @@
-import SignOutButton from "@/components-old/sign-out-button/sign-out-button.component";
 import { selectDeleteAfterUpload } from "@/redux/app/app.selectors";
+import { signOutStart } from "@/redux/user/user.actions";
 import { selectBodyshop, selectCurrentUser } from "@/redux/user/user.selectors";
 import { registerForPushNotificationsAsync } from "@/util/notificationHandler";
 import { formatBytes } from "@/util/uploadUtils";
@@ -7,6 +7,7 @@ import AsyncStorage from "@react-native-async-storage/async-storage";
 import * as Application from "expo-application";
 import Constants from "expo-constants";
 import * as Notifications from "expo-notifications";
+import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Alert, ScrollView, StyleSheet, View } from "react-native";
 import { Button, Card, Divider, List, Text } from "react-native-paper";
@@ -22,16 +23,27 @@ const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
 });
 
-const mapDispatchToProps = (dispatch) => ({});
+const mapDispatchToProps = (dispatch) => ({
+  signOutStart: () => dispatch(signOutStart()),
+});
 export default connect(mapStateToProps, mapDispatchToProps)(Tab);
 
-function Tab({ bodyshop, currentUser }) {
+function Tab({ bodyshop, currentUser, signOutStart }) {
   const { t } = useTranslation();
+  const [permissionState, setPermissionState] = useState(null);
+
+  useEffect(() => {
+    (async () => {
+      const status = await Notifications.getPermissionsAsync();
+
+      setPermissionState(status);
+    })();
+  }, []);
 
   const handleClearStorage = () => {
     Alert.alert(
       "Clear Local Cache",
-      "This will remove persisted Redux state. Media already uploaded won't be affected. Continue?",
+      "This will remove cache and settings. Continue?",
       [
         { text: "Cancel", style: "cancel" },
         {
@@ -40,7 +52,10 @@ function Tab({ bodyshop, currentUser }) {
           onPress: async () => {
             try {
               await AsyncStorage.removeItem("persist:root");
-              Alert.alert("Cleared", "Local cache cleared.");
+              Alert.alert(
+                "Cleared",
+                "Local cache cleared. Please restart the app."
+              );
             } catch (_e) {
               Alert.alert("Error", "Unable to clear local cache.");
             }
@@ -54,7 +69,7 @@ function Tab({ bodyshop, currentUser }) {
     <SafeAreaView style={{ flex: 1 }}>
       <ScrollView contentContainerStyle={styles.container}>
         <Text variant="headlineMedium" style={styles.title}>
-          Settings
+          {t("settings.titles.settings")}
         </Text>
 
         <Card style={styles.section}>
@@ -90,18 +105,14 @@ function Tab({ bodyshop, currentUser }) {
             </List.Section>
           </Card.Content>
           <Card.Actions>
-            <Button
-              onPress={handleClearStorage}
-              mode="contained-tonal"
-              icon="delete-outline"
-            >
-              Clear Cache
+            <Button onPress={handleClearStorage} icon="delete-outline">
+              {t("settings.actions.clearcache")}
             </Button>
           </Card.Actions>
         </Card>
 
         <Card style={styles.section}>
-          <Card.Title title="Theme" />
+          <Card.Title title={t("settings.labels.theme")} />
           <Card.Content>
             <List.Section>
               <View style={styles.inlineRow}>
@@ -109,8 +120,22 @@ function Tab({ bodyshop, currentUser }) {
               </View>
             </List.Section>
           </Card.Content>
+          <Card.Actions></Card.Actions>
+        </Card>
+        <Card style={styles.section}>
+          <Card.Title title="Notifications" />
+          <Card.Content>
+            <List.Section>
+              <View style={styles.inlineRow}>
+                <Text>{`${t("settings.labels.notificationsenabled")}: ${
+                  permissionState?.granted === true ? "Yes" : "No"
+                }`}</Text>
+              </View>
+            </List.Section>
+          </Card.Content>
           <Card.Actions>
             <Button
+              icon="bell-outline"
               onPress={async () => {
                 try {
                   await registerForPushNotificationsAsync();
@@ -123,39 +148,7 @@ function Tab({ bodyshop, currentUser }) {
                 }
               }}
             >
-              Enable Notifications
-            </Button>
-            <Button
-              onPress={async () => {
-                const projectId =
-                  Constants?.expoConfig?.extra?.eas?.projectId ??
-                  Constants?.easConfig?.projectId;
-
-                const pushTokenString = (
-                  await Notifications.getExpoPushTokenAsync({
-                    projectId,
-                  })
-                ).data;
-                const message = {
-                  to: pushTokenString,
-                  sound: "default",
-                  title: "Original Title",
-                  body: "And here is the body!",
-                  data: { someData: "goes here" },
-                };
-
-                await fetch("https://exp.host/--/api/v2/push/send", {
-                  method: "POST",
-                  headers: {
-                    Accept: "application/json",
-                    "Accept-encoding": "gzip, deflate",
-                    "Content-Type": "application/json",
-                  },
-                  body: JSON.stringify(message),
-                });
-              }}
-            >
-              Test Noti
+              {t("settings.actions.enablenotifications")}
             </Button>
           </Card.Actions>
         </Card>
@@ -163,15 +156,18 @@ function Tab({ bodyshop, currentUser }) {
         <Card style={styles.section}>
           <Card.Content>
             <Text style={styles.paragraph}>
-              Signed in to bodyshop:{" "}
-              {bodyshop?.shopname || bodyshop?.id || "Unknown"}
+              {`${t("settings.labels.signedinshop")} ${
+                bodyshop?.shopname || bodyshop?.id || "Unknown"
+              }`}
             </Text>
             <Text style={styles.paragraph}>
-              Signed in to as: {currentUser?.email || "Unknown"}
+              {`${t("settings.labels.signedinuser")} ${currentUser?.email || "Unknown"}`}
             </Text>
           </Card.Content>
-          <Card.Actions style={styles.actionsRow}>
-            <SignOutButton />
+          <Card.Actions>
+            <Button onPress={signOutStart}>
+              {t("general.actions.signout")}
+            </Button>
           </Card.Actions>
         </Card>