Merge pull request #20 from Gabry848/fix/android-edge-to-edge-orientation

fix(android): risolvi warning Play Store su edge-to-edge e orientamento

Author: Gabry848

app.json

@@ -3,7 +3,7 @@
     "name": "My taskly",
     "slug": "mytaskly",
     "version": "1.0.0",
-    "orientation": "portrait",
+    "orientation": "default",
     "icon": "./assets/icons/ios-light.png",
     "userInterfaceStyle": "automatic",
     "newArchEnabled": false,

package.json

@@ -73,7 +73,7 @@
     "react-native-chat-ui": "^0.1.9",
     "react-native-copilot": "^3.3.3",
     "react-native-dotenv": "^3.4.11",
-    "react-native-edge-to-edge": "1.6.0",
+    "react-native-edge-to-edge": "1.8.1",
     "react-native-gesture-handler": "~2.24.0",
     "react-native-keyboard-aware-scrollview": "^2.1.0",
     "react-native-markdown-display": "^7.0.2",

src/components/BotChat/ChatHeader.tsx

@@ -1,16 +1,18 @@
 import React from 'react';
-import { StyleSheet, View, Text, TouchableOpacity, StatusBar } from 'react-native';
+import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { MaterialIcons } from '@expo/vector-icons';
 import { ChatHeaderProps } from './types';
 
-const ChatHeader: React.FC<ChatHeaderProps> = ({ 
-  modelType, 
-  onModelChange, 
+const ChatHeader: React.FC<ChatHeaderProps> = ({
+  modelType,
+  onModelChange,
   onNewChat,
-  style 
+  style
 }) => {
+  const insets = useSafeAreaInsets();
   return (
-    <View style={[styles.header, style]}>
+    <View style={[styles.header, { paddingTop: insets.top + 5 }, style]}>
       <View style={styles.actions}>
         <TouchableOpacity
           style={styles.modelSelector}
@@ -40,7 +42,7 @@ const styles = StyleSheet.create({
     justifyContent: "flex-end",
     width: "100%",
     padding: 8,
-    paddingTop: StatusBar.currentHeight ? StatusBar.currentHeight + 5 : 15,
+    paddingTop: 15,
     paddingBottom: 8,
     backgroundColor: "#FFFFFF",
     shadowColor: "#000",

src/components/BotChat/VoiceCalendarModal.tsx

@@ -6,10 +6,10 @@ import {
   TouchableOpacity,
   Animated,
   Dimensions,
-  StatusBar,
   StyleSheet,
   Platform,
 } from "react-native";
+import { StatusBar } from 'expo-status-bar';
 import { Ionicons } from "@expo/vector-icons";
 import CalendarView from "../Calendar/CalendarView";
 
@@ -72,7 +72,7 @@ const VoiceCalendarModal: React.FC<VoiceCalendarModalProps> = ({ visible, onClos
       statusBarTranslucent
       onRequestClose={handleClose}
     >
-      <StatusBar barStyle="dark-content" backgroundColor="#FFFFFF" />
+      <StatusBar style="dark" />
 
       {/* Overlay sfondo scuro */}
       <Animated.View style={[styles.backdrop, { opacity: fadeAnim }]} pointerEvents="none" />

src/components/BotChat/VoiceChatExample.tsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
-import { View, Text, StyleSheet, TouchableOpacity, SafeAreaView } from 'react-native';
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { MaterialIcons } from '@expo/vector-icons';
 import VoiceChatModal from './VoiceChatModal';
 import VoiceCalendarModal from './VoiceCalendarModal';

src/components/BotChat/VoiceChatModal.tsx

@@ -7,11 +7,12 @@ import {
   TouchableOpacity,
   Animated,
   Dimensions,
-  StatusBar,
   Alert,
   Platform,
   ScrollView,
 } from "react-native";
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { StatusBar } from 'expo-status-bar';
 import Svg, { Path, Defs, RadialGradient, Stop } from "react-native-svg";
 import { Ionicons } from "@expo/vector-icons";
 import { useVoiceChat, ActiveTool } from '../../hooks/useVoiceChat';
@@ -224,6 +225,7 @@ const VoiceChatModal: React.FC<VoiceChatModalProps> = ({
   onClose,
   onOpenCalendar,
 }) => {
+  const insets = useSafeAreaInsets();
   const {
     state,
     error,
@@ -383,7 +385,7 @@ const VoiceChatModal: React.FC<VoiceChatModalProps> = ({
       statusBarTranslucent={true}
       onRequestClose={handleClose}
     >
-      <StatusBar barStyle="dark-content" backgroundColor="#FFFFFF" />
+      <StatusBar style="dark" />
 
       <Animated.View
         style={[
@@ -395,7 +397,7 @@ const VoiceChatModal: React.FC<VoiceChatModalProps> = ({
         ]}
       >
         {/* Header */}
-        <View style={styles.header}>
+        <View style={[styles.header, { paddingTop: insets.top + 16 }]}>
           {isConnected ? (
             <View style={styles.liveIndicator}>
               <Animated.View style={[styles.liveDot, { opacity: liveDotOpacity }]} />
@@ -542,7 +544,7 @@ const styles = StyleSheet.create({
 
   // Header
   header: {
-    paddingTop: StatusBar.currentHeight ? StatusBar.currentHeight + 16 : 52,
+    paddingTop: 52,
     paddingHorizontal: 20,
     paddingBottom: 14,
     flexDirection: "row",

src/components/Calendar20/TopBar.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { View, Text, TouchableOpacity, StyleSheet, Platform, StatusBar } from 'react-native';
+import { View, Text, TouchableOpacity, StyleSheet, Platform } from 'react-native';
 import { Ionicons } from '@expo/vector-icons';
 import { CalendarViewType } from './types';
 import { useTranslation } from 'react-i18next';

src/components/WelcomeCarousel/WelcomeCarouselScreen.tsx

@@ -4,12 +4,12 @@ import {
   FlatList,
   Dimensions,
   Animated,
-  SafeAreaView,
-  StatusBar,
   TouchableOpacity,
   Text,
   StyleSheet,
 } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { StatusBar } from 'expo-status-bar';
 import { useNavigation } from '@react-navigation/native';
 import type { NavigationProp } from '@react-navigation/native';
 import type { RootStackParamList } from '../../types.d';
@@ -79,7 +79,7 @@ export const WelcomeCarouselScreen = () => {
 
   return (
     <SafeAreaView style={styles.container}>
-      <StatusBar barStyle="dark-content" backgroundColor="#FFFFFF" />
+      <StatusBar style="dark" />
 
       {/* Skip Button */}
       <TouchableOpacity style={styles.skipButton} onPress={handleSkip} activeOpacity={0.7}>

src/navigation/screens/About.tsx

@@ -1,6 +1,8 @@
 import { Text } from '@react-navigation/elements';
 import React from 'react';
-import { StyleSheet, View, SafeAreaView, StatusBar, ScrollView } from 'react-native';
+import { StyleSheet, View, ScrollView } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { StatusBar } from 'expo-status-bar';
 import { Ionicons } from '@expo/vector-icons';
 import { useTranslation } from 'react-i18next';
 
@@ -9,7 +11,7 @@ export default function About() {
 
   return (
     <SafeAreaView style={styles.container}>
-      <StatusBar barStyle="dark-content" backgroundColor="#ffffff" />
+      <StatusBar style="dark" />
 
       {/* Content */}
       <ScrollView style={styles.content}>

src/navigation/screens/AccountSettings.tsx

@@ -4,14 +4,14 @@ import {
   StyleSheet,
   View,
   TouchableOpacity,
-  SafeAreaView,
-  StatusBar,
   ScrollView,
   ActivityIndicator,
   Alert,
   Modal,
   TextInput,
 } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { StatusBar } from 'expo-status-bar';
 import { Ionicons } from '@expo/vector-icons';
 import { getValidToken, changeEmail, changeUsername } from '../../services/authService';
 import axios from '../../services/axiosInstance';
@@ -167,7 +167,7 @@ export default function AccountSettings() {
   if (loading) {
     return (
       <SafeAreaView style={styles.container}>
-        <StatusBar barStyle="dark-content" backgroundColor="#ffffff" />
+        <StatusBar style="dark" />
         <View style={styles.loadingContainer}>
           <ActivityIndicator size="large" color="#000000" />
           <Text style={styles.loadingText}>{t('common.messages.loading')}</Text>
@@ -178,7 +178,7 @@ export default function AccountSettings() {
 
   return (
     <SafeAreaView style={styles.container}>
-      <StatusBar barStyle="dark-content" backgroundColor="#ffffff" />
+      <StatusBar style="dark" />
 
       <ScrollView style={styles.content} showsVerticalScrollIndicator={false}>
         {error ? (