feat: add and enhance PermitsScreen and RequestPermitModal

- add LoadingScreen component
- update utilities

app/(protected)/permits/index.tsx

@@ -4,6 +4,7 @@ import { Alert, ScrollView, Text, TouchableOpacity, View, ActivityIndicator, Ref
 import { TimeOffRequest, TimeOffRequestType } from '@/types/types';
 import RequestPermitModal from '@/components/RequestPermitModal';
 import CalendarWidget from '@/components/CalendarWidget';
+import LoadingScreen from '@/components/LoadingScreen';
 import api from '@/utils/api';
 import { formatDate, formatTime } from '@/utils/dateTime';
 
@@ -51,14 +52,8 @@ export default function PermitsScreen() {
         fetchPermits();
     };
 
-    // TODO: Migliorare schermata di caricamento -> spostarla in un componente a parte
     if (isLoading && !refreshing) {
-        return (
-            <View className="flex-1 justify-center items-center bg-gray-50">
-                <ActivityIndicator size="large" color="#099499" />
-                <Text className="text-gray-500 mt-2">Caricamento...</Text>
-            </View>
-        );
+        return <LoadingScreen />;
     }
 
     return (
@@ -96,7 +91,7 @@ export default function PermitsScreen() {
                     ) : (
                         <View className="gap-4">
                             <Text className="text-xl font-bold text-gray-800 px-1">Le tue richieste</Text>
-                            {/* TODO: Aggiungere una paginazione con delle freccette affianco? */}
+                            {/* TODO: Aggiungere una paginazione con delle freccette affianco? - Limite backend? */}
                             {permits.map((item) => (
                                 <View key={item.id} className="bg-white p-5 rounded-3xl shadow-sm border border-gray-100 flex-row justify-between items-center">
                                     <View className="flex-row items-center gap-4">
@@ -115,6 +110,7 @@ export default function PermitsScreen() {
                                             )}
                                         </View>
                                     </View>
+                                    {/* TODO: Aggiungere funzionalità per modificare/eliminare la richiesta? */}
                                     <View className={`px-3 py-1.5 rounded-lg ${item.status ? 'bg-green-100' : 'bg-yellow-100'}`}>
                                         <Text className={`text-xs font-bold uppercase tracking-wide ${item.status ? 'text-green-700' : 'text-yellow-700'}`}>
                                             {item.status ? 'Approvato' : 'In Attesa'}