changed login

Interface.tsx

@@ -6,10 +6,9 @@ import Settings from './screens/Settings';
 import { ThemeButton, ThemeText } from './common/ThemeTypes';
 import { StyleSheet, Text, View } from 'react-native';
 import { useColors } from './common/colors';
-import {decode as atob, encode as btoa} from 'base-64'
+import { decode as atob, encode as btoa } from 'base-64'
 import Login from './screens/Login';
 
-let errorObject;
 export const InterfaceContext = createContext<any>(null);
 
 const Interface = ({ children }) => {
@@ -19,9 +18,12 @@ const Interface = ({ children }) => {
     const [baseData, setBaseData] = useState(null);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(false);
+    const [errorObject, setErrorObject] = useState(null);
 
     const fetchData = async () => {
         try {
+            setLoading(true)
+            if (settings.requireAuth ? !settings.username : false) throw new InterfaceError("Authentication Required")
             if (!settings.url) throw new InterfaceError("Invalid URL")
             const userinformation = await fetchUserInformation(settings.username);
             const basedata = await fetchBaseData();
@@ -31,7 +33,7 @@ const Interface = ({ children }) => {
             setError(false)
         } catch (error) {
             console.error(error);
-            errorObject = error;
+            setErrorObject(error);
             setError(true)
         } finally {
             setLoading(false)
@@ -110,31 +112,30 @@ const Interface = ({ children }) => {
 
 
     const requestGet = async (url, handleError = true) => {
+        console.log(url)
         try {
             const response = await axiosInstance.get(url);
             if (response.status === 200 && response.data.success === true) {
                 return response.data.data;
             } else {
-                throw new InterfaceError(response.data.message);
+                throw new NetworkError(response.data.message, url);
             }
         } catch (error) {
             if (!handleError) {
                 return null
-            }else if (error.response) {
-                if (error.response.data.message){
-                    throw new InterfaceError(error.response.status + ": " + error.response.data.message);
-                }else if (error.response.status === 404) {
-                    throw new InterfaceError('404: URL wurde auf dem Server nicht gefunden');
-                } else if (error.response.status === 500) {
-                    throw new InterfaceError('500: Ein unbekannter Fehler ist auf dem Webservice aufgetreten');
+            } else if (error.response) {
+                if (error.response.data.message) {
+                    throw new NetworkError(error.response.status + ": " + error.response.data.message, url);
+                } else if (error.response.status === 404) {
+                    throw new NetworkError('404: URL wurde auf dem Server nicht gefunden', url);
                 } else if (error.response.status === 502) {
-                    throw new InterfaceError('502: Webservice ist unerreichbar');
+                    throw new NetworkError('502: Webservice ist unerreichbar', url);
                 }
-                throw new Error(`${error.response.status}: Ein fehler ist auf dem Server aufgetreten`);
+                throw new NetworkError(`${error.response.status}: Ein unbekannter ist auf dem Server aufgetreten`, url);
             } else if (error.request) {
-                throw new InterfaceError('Netzwerkfehler');
+                throw new NetworkError('Netzwerkfehler', url);
             } else {
-                throw new InterfaceError(error.message || 'Ein unbekannter fehler ist aufgetreten');
+                throw new NetworkError(error.message || 'Ein unbekannter fehler ist aufgetreten', url);
             }
         }
     };
@@ -145,11 +146,11 @@ const Interface = ({ children }) => {
         container: {
             paddingTop: 30,
             flex: 1,
-            backgroundColor: colors.backSecondary,
         },
         titleBox: {
             paddingHorizontal: 20,
             paddingVertical: 10,
+            backgroundColor: colors.backSecondary,
         },
         title: {
             fontSize: 20,
@@ -161,18 +162,20 @@ const Interface = ({ children }) => {
     })
 
     const renderContent = () => {
-        if (error) return (
+        let needsCredentials = settings.requireAuth ? !settings.username : false;
+        if (error && !loading) return (
             <View style={styles.container}>
+                {!needsCredentials &&
                     <View style={styles.titleBox}>
                         <ThemeText style={styles.title}>Fehler beim laden der Daten</ThemeText>
                         <ThemeText>{errorObject?.message}</ThemeText>
                         <ThemeButton style={styles.button} onPress={refresh}><Text>Neu Versuchen</Text></ThemeButton>
                     </View>
+                }
                 <Login />
             </View>
         )
         if (!loading) return (children)
-        //return (children)
     }
 
     return (
@@ -190,3 +193,12 @@ export class InterfaceError extends Error {
         this.name = "InterfaceError";
     }
 }
+export class NetworkError extends Error {
+    url: string;
+
+    constructor(message: string, url: string) {
+        super(message);
+        this.name = "NetworkError";
+        this.url = url;
+    }
+}

common/Credits.tsx

@@ -54,6 +54,13 @@ const Credits = () => {
 
     return (
         <>
+            <View
+                style={{
+                    borderBottomColor: colors.textAccent,
+                    borderBottomWidth: 1,
+                    marginTop: 40,
+                }}
+            />
             <View style={[styles.section, { marginTop: 20 }]}>
                 <ThemeText>EDV-Schule Plattling</ThemeText>
                 <TouchableOpacity onPress={() => Linking.openURL('https://www.edvschule-plattling.de/impressum')}>

screens/Login.tsx

@@ -1,15 +1,13 @@
 import React, { useState, useEffect, useContext, useRef } from 'react';
-import { View, Text, ScrollView, Button, StyleSheet, TouchableOpacity, ActivityIndicator, Alert, Animated } from 'react-native';
+import { View, Text, ScrollView, Button, StyleSheet, TouchableOpacity, ActivityIndicator, Alert, Animated, Image } from 'react-native';
 import { SettingsContext } from '../SettingsProvider';
 import { useColors } from '../common/colors';
 import ErrorBoundary from 'react-native-error-boundary';
 import { ThemeSwitch, ThemeText, ThemeTextInput } from '../common/ThemeTypes';
-import { ToastType, useToast } from '../common/ToastProvider';
 import Credits from '../common/Credits';
 import FontAwesome5 from '@expo/vector-icons/FontAwesome5';
 
 const Login = () => {
-    const { showToast, hideToast } = useToast();
     const colors = useColors();
     const { settings, updateSettings } = useContext(SettingsContext);
 
@@ -50,7 +48,6 @@ const Login = () => {
                 darkTheme: isDarkMode,
                 requireAuth,
             });
-            hideToast();
         } catch (error) {
             console.error('Error updating settings:', error);
             Alert.alert('Error', 'Failed to save settings.');
@@ -61,7 +58,6 @@ const Login = () => {
 
     const handleChange = (setter) => (value) => {
         setter(value);
-        showToast(ToastType.Warn, 'Ungespeicherte Änderungen');
     };
 
     const toggleAdvancedSettings = () => {
@@ -113,10 +109,11 @@ const Login = () => {
             height: '100%',
         },
         arrowContainer: {
+            display: 'flex',
+            justifyContent: 'center',
             marginTop: 20,
             flexDirection: 'row',
             alignItems: 'center',
-            justifyContent: 'flex-start',
         },
         advancedButtonText: {
             marginLeft: 8,
@@ -126,11 +123,23 @@ const Login = () => {
         advancedSection: {
             overflow: 'hidden',
         },
+        logo: {
+            width: 100,
+            height: 100,
+        },
+        logoContainer: {
+            marginTop: 10,
+            display: 'flex',
+            alignItems: 'center',
+        },
     });
 
     return (
         <ErrorBoundary>
             <ScrollView style={[styles.container, { backgroundColor: colors.backPrimary }]}>
+                <View style={[styles.section, styles.logoContainer]}>
+                    <Image style={styles.logo} source={require('../assets/favicon.png')} />
+                </View>
                 <View style={styles.section}>
                     <ThemeText style={styles.label}>Benutzername</ThemeText>
                     <ThemeTextInput
@@ -180,7 +189,6 @@ const Login = () => {
                         </View>
                     </View>
                 </Animated.View>
-
                 <Credits />
             </ScrollView>
         </ErrorBoundary>