get toast for invalid server address

getting login screen to look better?

components/Login/helpers/server-address.tsx

@@ -9,13 +9,12 @@ import { AsyncStorageKeys } from "../../../enums/async-storage-keys";
 import { Button, TextField, View } from "react-native-ui-lib";
 import { JellifyServer } from "../../../types/JellifyServer";
 import { serverUrlMutation } from "../../../api/mutators/storage";
+import Toast from "react-native-ui-lib/src/incubator/toast";
 
 export default function ServerAddress(): React.JSX.Element {
 
     const [serverUrl, setServerUrl] = useState("");
 
-    const [storeUrl, setStoreUrl] = useState("");
-
     return (
         <View useSafeArea>
             <TextField 
@@ -27,6 +26,12 @@ export default function ServerAddress(): React.JSX.Element {
                 onPress={() => serverUrlMutation.mutate(serverUrl)}
                 label="Connect"
             />
+
+            <Toast  
+                visible={serverUrlMutation.isError}  
+                message="Unable to connect to Jellyfin"
+                position={'bottom'}  
+                autoDismiss={2500}/>
         </View>
     )
 }

components/Login/helpers/server-authentication.tsx

@@ -7,7 +7,7 @@ export default function ServerAuthentication(): React.JSX.Element {
     const [password, setPassword] = React.useState('');
 
     return (
-        <View>
+        <View useSafeArea>
             <ActionBar
                 actions={[
                     {