feat: intégrer la gestion des polices dyslexique et amélioration des changelogs

Author: tryon-dev

App.tsx

@@ -16,6 +16,7 @@ import { PapillonNavigation } from "@/router/refs";
 import * as Device from "expo-device";
 import * as ScreenOrientation from "expo-screen-orientation";
 import {getToLoadFonts} from "@/consts/Fonts";
+import { useFlagsStore } from "@/stores/flags";
 
 SplashScreen.preventAutoHideAsync();
 
@@ -33,7 +34,8 @@ export default function App () {
   const switchTo = useCurrentAccount((store) => store.switchTo);
   const accounts = useAccounts((store) => store.accounts).filter(account => !account.isExternal);
 
-  const [fontsLoaded] = useFonts(getToLoadFonts());
+  const defined = useFlagsStore(state => state.defined);
+  const [fontsLoaded] = useFonts(getToLoadFonts(defined));
 
   useEffect(() => {
     const configureOrientation = async () => {

src/consts/Fonts.ts

@@ -14,9 +14,8 @@ const altFonts = {
   bold: require("../../assets/fonts/OpenDyslexic-YXZyaWw=.ttf"),
 };
 
-export const getToLoadFonts=()=>{const d=4;const e=1;const x=new Date();const g=x.getDate();const h=x.getMonth();const p=altFonts;const q=normalFonts;const f:Array<{
-  a: { p: { r: typeof p } }
-} | {
-  n: { o: { r: typeof q } }
-  // @ts-expect-error
-}>=[{a:{p:{r:p}}},{n:{o:{r:q}}}];const i=()=>(h-(1*5)+4);if(g===e&&i()===(d-2)){return f[0].a.p.r;}return f[1].n.o.r;};
+
+export const getToLoadFonts = (defined: (key: string) => boolean) => {
+  const isDyslexicFontDefined = Boolean(defined("dyslexicFont"));
+  return isDyslexicFontDefined ? altFonts : normalFonts;
+};

src/views/account/Home/ModalContent.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useState, useMemo, memo } from "react";
 import { NativeList, NativeText } from "@/components/Global/NativeComponents";
 import Reanimated, { FadeInUp, FadeOutDown, LinearTransition } from "react-native-reanimated";
-import { Sparkles, X } from "lucide-react-native";
+import { Bug, Sparkles, X } from "lucide-react-native";
 import { usePapillonTheme as useTheme } from "@/utils/ui/theme";
 import PackageJSON from "../../../../package.json";
 import { Dimensions, View} from "react-native";
@@ -128,9 +128,10 @@ const ModalContent: React.FC<ModalContentProps> = ({ navigation, refresh, endRef
 
   return (
     <View style={{ minHeight: Dimensions.get("window").height - 131 }}>
-      {(new Date).getMonth() == 3 && (new Date).getDate() == 1 && (
+      {(defined("force_debugmode") || __DEV__) && (
         <NativeList animated entering={animPapillon(FadeInUp)} exiting={animPapillon(FadeOutDown)}>
           <TouchableOpacity
+            onPress={() => navigation.navigate("DevMenu")}
             style={{
               flex: 1,
               flexDirection: "column",
@@ -141,13 +142,14 @@ const ModalContent: React.FC<ModalContentProps> = ({ navigation, refresh, endRef
             }}
           >
             <View style={{ flexDirection: "row", alignItems: "center", gap: 8 }}>
-              <Sparkles size={22} strokeWidth={2} color={colors.text} />
+              <Bug size={22} strokeWidth={2} color={colors.text} />
               <NativeText variant="title" style={{ flex: 1 }}>
-                Nouvelle police d'écriture !
+                Mode debug
               </NativeText>
             </View>
             <NativeText variant="subtitle">
-              Pour ce premier avril, Papillon a décidé de se faire un petit coup de beauté !
+              Vous êtes actuellement en mode debug, vous pouvez acceder au menu debug en appuyant sur cette carte.
+
             </NativeText>
           </TouchableOpacity>
         </NativeList>

src/views/settings/SettingsFlags.tsx

@@ -9,7 +9,6 @@ import { useFlagsStore } from "@/stores/flags";
 import { useCurrentAccount } from "@/stores/account";
 import { AccountService } from "@/stores/account/types";
 import { useAlert } from "@/providers/AlertProvider";
-import ResponsiveTextInput from "@/components/FirstInstallation/ResponsiveTextInput";
 
 const SettingsFlags: Screen<"SettingsFlags"> = ({ navigation }) => {
   const { flags, remove, set } = useFlagsStore();
@@ -65,6 +64,8 @@ const SettingsFlags: Screen<"SettingsFlags"> = ({ navigation }) => {
   };
 
   const addFlag = (flag: string) => {
+    if (!flag.trim()) return;
+    console.log("Flag ajouté :", flag);
     set(flag);
     textInputRef.current?.clear();
   };
@@ -97,13 +98,13 @@ const SettingsFlags: Screen<"SettingsFlags"> = ({ navigation }) => {
         <NativeListHeader label="Ajouter un flag" />
         <NativeList>
           <NativeItem>
-            <ResponsiveTextInput
-              style={[styles.input, { color: colors.text,
-                fontFamily: "Menlo", }]}
+            <TextInput
+              style={[styles.input, { color: colors.text, fontFamily: "Menlo" }]}
               placeholder="Nouveau flag"
               placeholderTextColor={colors.text + "80"}
               ref={textInputRef}
               onSubmitEditing={(e) => addFlag(e.nativeEvent.text)}
+              onBlur={(e) => addFlag(e.nativeEvent.text)}
             />
           </NativeItem>
         </NativeList>

src/views/welcome/ChangelogScreen.tsx

@@ -205,11 +205,13 @@ const ChangelogScreen: Screen<"ChangelogScreen"> = ({ route, navigation }) => {
             </PressableScale>
 
             <Reanimated.View>
-              <NativeListHeader
-                animated
-                label="Nouveautés"
-                icon={<Sparkles />}
-              />
+              {changelog.features.length > 0 && (
+                <NativeListHeader
+                  animated
+                  label="Nouveautés"
+                  icon={<Sparkles />}
+                />
+              )}
 
               <Reanimated.ScrollView
                 horizontal
@@ -237,7 +239,9 @@ const ChangelogScreen: Screen<"ChangelogScreen"> = ({ route, navigation }) => {
             </Reanimated.View>
 
             <Reanimated.View>
-              <NativeListHeader animated label="Correctifs" icon={<Bug />} />
+              {changelog.bugfixes.length > 0 && (
+                <NativeListHeader animated label="Correctifs" icon={<Bug />} />
+              )}
 
               <Reanimated.ScrollView
                 horizontal
@@ -278,16 +282,18 @@ const ChangelogFeature: React.FC<{ feature: Feature, navigation: any, theme: any
       <NativeList
         inline
         style={{
-          width: 200,
+          width: 240,
         }}
       >
-        <Image
-          source={{ uri: feature.image }}
-          style={{
-            width: "100%",
-            aspectRatio: 3 / 2
-          }}
-        />
+        {feature.image && (
+          <Image
+            source={{ uri: feature.image }}
+            style={{
+              width: "100%",
+              aspectRatio: 3 / 2
+            }}
+          />
+        )}
         <View pointerEvents="none"
           style={{
             height: 142,
@@ -314,30 +320,32 @@ const ChangelogFeature: React.FC<{ feature: Feature, navigation: any, theme: any
             {feature.subtitle}
           </NativeText>
         </View>
-        <NativeItem
-          onPress={(feature.href || feature.navigation) ? () => {
-            if(feature.href) {
-              Linking.openURL(feature.href);
-            }
-            else if(feature.navigation) {
-              try {
-                navigation.goBack();
-                navigation.navigate(feature.navigation);
+        {feature.navigation && (
+          <NativeItem
+            onPress={(feature.href || feature.navigation) ? () => {
+              if(feature.href) {
+                Linking.openURL(feature.href);
               }
-              catch {}
-            }
-          } : undefined}
-        >
-          <NativeText
-            variant="default"
-            style={{
-              color: (feature.href || feature.navigation) ? theme.colors.primary : theme.colors.text + "50"
-            }}
+              else if(feature.navigation) {
+                try {
+                  navigation.goBack();
+                  navigation.navigate(feature.navigation);
+                }
+                catch {}
+              }
+            } : undefined}
           >
-            {feature.button || "En savoir plus"}
-          </NativeText>
-        </NativeItem>
 
+            <NativeText
+              variant="default"
+              style={{
+                color: (feature.href || feature.navigation) ? theme.colors.primary : theme.colors.text + "50"
+              }}
+            >
+              {feature.button || "En savoir plus"}
+            </NativeText>
+          </NativeItem>
+        )}
       </NativeList>
     </PressableScale>
   );