fix: amélioration de la page des logs + fix non affichage de la versi…

…on d'Expo (#571)
PapillonApp · Jan 20, 2025 · 3c76eda · 3c76eda
2 parents 00694a6 + a073e6d
commit 3c76eda
Show file tree

Hide file tree

Showing 3 changed files with 125 additions and 33 deletions.
diff --git a/src/utils/logger/logger.ts b/src/utils/logger/logger.ts
@@ -38,19 +38,31 @@ function get_file_from_stacktrace (stack: string): string
   return (res);
 }
 
-function save_logs_to_memory (log: string)
-{
-  AsyncStorage.getItem("logs")
-    .then((result) => {
-      let logs = [];
-      if (result != null)
-        logs = JSON.parse(result);
-      logs.push(log);
-      if (logs.length > 800) {
-        logs = logs.splice(0, 100);
+function save_logs_to_memory (log: string) {
+  AsyncStorage.getItem("logs").then((result) => {
+    const twoWeeksAgo = Date.now() - 14 * 24 * 60 * 60 * 1000;
+    let logs: string[] = [];
+
+    if (result != null) {
+      logs = JSON.parse(result) as string[];
+    }
+    logs.push(log);
+
+    logs = logs.filter((element) => {
+      const match = element.split("]")[1].replace("[", "");
+      if (match) {
+        const logDate = new Date(match).getTime();
+        return logDate >= twoWeeksAgo;
       }
-      AsyncStorage.setItem("logs", JSON.stringify(logs));
+      return false;
     });
+
+    if (logs.length > 800) {
+      logs = logs.splice(0, 100);
+    }
+
+    AsyncStorage.setItem("logs", JSON.stringify(logs));
+  });
 }
 
 function log (message: string, from: string): void {

diff --git a/src/views/settings/SettingsAbout.tsx b/src/views/settings/SettingsAbout.tsx
@@ -200,7 +200,12 @@ const SettingsAbout: Screen<"SettingsAbout"> = ({ navigation }) => {
             Version des dépendances
           </NativeText>
           <NativeText variant="subtitle">
-            RN : {PackageJSON.dependencies["react-native"].split("^")[1]} | Expo : {(PackageJSON.devDependencies["expo"] || PackageJSON.dependencies["expo"]).split(/[~^]/)[1] || (PackageJSON.devDependencies["expo"] || PackageJSON.dependencies["expo"])}
+            RN : {PackageJSON.dependencies["react-native"].split("^")[1]} |
+            Expo :{" "}
+            {(
+              PackageJSON.devDependencies.expo ||
+              PackageJSON.dependencies.expo
+            ).replace("^", "").replace("~", "")}
           </NativeText>
         </NativeItem>
       </NativeList>

diff --git a/src/views/settings/SettingsDevLogs.tsx b/src/views/settings/SettingsDevLogs.tsx
@@ -1,5 +1,5 @@
 import type { Screen } from "@/router/helpers/types";
-import { ActivityIndicator, ScrollView, TextInput } from "react-native";
+import { ActivityIndicator, Alert, Platform, ScrollView, TextInput, TouchableOpacity } from "react-native";
 import {
   NativeIcon,
   NativeItem,
@@ -17,44 +17,43 @@ import {
   CircleAlert,
   CircleX,
   Code,
-  Delete,
   Layers,
+  Trash2,
   TriangleAlert,
   Moon,
   Newspaper,
   Calendar,
   Folder,
+  X,
 } from "lucide-react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { PressableScale } from "react-native-pressable-scale";
 import {
   FadeInDown,
   FadeOutUp,
 } from "react-native-reanimated";
 import { animPapillon } from "@/utils/ui/animations";
 import { useTheme } from "@react-navigation/native";
+import { useAlert } from "@/providers/AlertProvider";
+import MissingItem from "@/components/Global/MissingItem";
 
 const SettingsDevLogs: Screen<"SettingsDevLogs"> = ({ navigation }) => {
-  const theme = useTheme();
+  const { colors } = useTheme();
   const [logs, setLogs] = useState<Log[]>([]);
   const [searchTerms, setSearchTerms] = useState<string>("");
   const insets = useSafeAreaInsets();
 
   const [loading, setLoading] = useState(true);
+  const { showAlert } = useAlert();
 
   useEffect(() => {
     get_logs().then((logs) => {
-      setLogs(logs);
+      setLogs(
+        logs.sort(
+          (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()
+        )
+      );
       setLoading(false);
     });
-
-    navigation.setOptions({
-      headerRight: (props) => (
-        <PressableScale onPress={() => delete_logs()}>
-          <Delete />
-        </PressableScale>
-      ),
-    });
   }, [navigation]);
 
   return (
@@ -69,21 +68,85 @@ const SettingsDevLogs: Screen<"SettingsDevLogs"> = ({ navigation }) => {
         placeholder={"Rechercher"}
         value={searchTerms}
         onChangeText={setSearchTerms}
-        placeholderTextColor={theme.colors.text + "80"}
+        placeholderTextColor={colors.text + "80"}
         style={{
-          color: theme.colors.text,
+          color: colors.text,
           padding: 8,
           borderRadius: 80,
           fontFamily: "medium",
           fontSize: 16.5,
           flex: 1,
-          backgroundColor: theme.colors.border,
+          backgroundColor: colors.border,
           marginTop: 12,
         }}
       />
-      <NativeListHeader animated label={"Logs"} />
+      <NativeListHeader
+        animated
+        label="Logs des 2 dernières semaines"
+        trailing={
+          logs.length > 0 && (
+            <TouchableOpacity
+              onPress={() => {
+                if (Platform.OS === "ios") {
+                  Alert.alert(
+                    "Supprimer les logs ?",
+                    "Es-tu sûr de vouloir supprimer toutes les logs ?", [
+                      {
+                        text: "Annuler",
+                        style: "cancel",
+                      },
+                      {
+                        text: "Supprimer",
+                        style: "destructive",
+                        onPress: () => {
+                          delete_logs();
+                          setLogs([]);
+                        },
+                      },
+                    ]
+                  );
+                } else {
+                  showAlert({
+                    title: "Supprimer les logs ?",
+                    message: "Es-tu sûr de vouloir supprimer toutes les logs ?",
+                    actions: [
+                      {
+                        title: "Annuler",
+                        onPress: () => {},
+                        backgroundColor: colors.card,
+                        icon: <X color={colors.text} />,
+                      },
+                      {
+                        title: "Supprimer",
+                        primary: true,
+                        onPress: () => {
+                          delete_logs();
+                          setLogs([]);
+                        },
+                        backgroundColor: "#CF0029",
+                        icon: <Trash2 color="#FFFFFF" />,
+                      },
+                    ],
+                  });
+                }
+              }}
+              style={{
+                padding: 5,
+                borderRadius: 100,
+                backgroundColor: colors.text + "20",
+              }}
+            >
+              <Trash2
+                size={25}
+                strokeWidth={2}
+                color="red"
+              />
+            </TouchableOpacity>
+          )
+        }
+      />
 
-      {loading && (
+      {loading ? (
         <NativeList
           animated
           entering={animPapillon(FadeInDown)}
@@ -96,9 +159,7 @@ const SettingsDevLogs: Screen<"SettingsDevLogs"> = ({ navigation }) => {
             </NativeText>
           </NativeItem>
         </NativeList>
-      )}
-
-      {logs.length !== 0 && (
+      ) : logs.length > 0 ? (
         <NativeList
           animated
           entering={animPapillon(FadeInDown)}
@@ -167,6 +228,20 @@ const SettingsDevLogs: Screen<"SettingsDevLogs"> = ({ navigation }) => {
             return null;
           })}
         </NativeList>
+      ) : (
+        <NativeList
+          animated
+          entering={animPapillon(FadeInDown)}
+          exiting={animPapillon(FadeOutUp)}
+        >
+          <NativeItem animated style={{ paddingVertical: 10 }}>
+            <MissingItem
+              emoji="💾"
+              title="Aucune log enregistrée"
+              description="Il n'y a pas de logs à te présenter."
+            />
+          </NativeItem>
+        </NativeList>
       )}
     </ScrollView>
   );