I'm trying to connect to my school mqtt broker with using react native. The problem is that i can't connect and i get two errors....

The first one is : Object { "errorCode": 1, "errorMessage": "AMQJSC0001E Connect timed out.", "invocationContext": undefined, }

and the second one : Error: AMQJS0011E Invalid state already connected.

the second one appears when i press the button "DeployParachute.

This is my code :

import * as React from "react";
import { useState } from "react";
import { StyleSheet, View, Text, TouchableOpacity } from "react-native";
import Paho from "paho-mqtt";


export default function App() {
  const client = new Paho.Client(
    '172.30.X.X',
    Number(1883),
    'hicheme'
  );
  
  function subscribeTopics () {
    client.subscribe("tags");
  }
  
  function onFailure(msg) {
    console.log("Failed to connect",msg);
  }
  
  function onConnectionLost(responseObject) {
    console.log("Connection Lost" + responseObject);
  }
  
  function deployParachute() {
    client.connect({
      onSuccess: function () {
        console.log("deploying parachute");
    },
      onFailure: function(msg){
        console.log("failte to connect",msg )
      },
      useSSL: true,
    });
  }

  const [connected, setConnected] = useState(false);
  const mqtt_options = {
    onSuccess: onConnect,
    onFailure: onFailure,
  };

  function onConnect() {
    console.log("connected")
    setConnected(true);
    subscribeTopics ();
  }

  function onMessage(message) {
    //console.log('Topic: ' + message.destinationName + ", Message: " + message.payloadString);
    console.log('message',JSON.parse(message));
  }

  if (!connected)
  {
    client.connect(mqtt_options);
    client.onConnectionLost = onConnectionLost;
    client.onMessageArrived = onMessage;
    console.log("Why i'm here????????????")
  }

  return (
    <View style={styles.container}>
      <TouchableOpacity onPress={deployParachute} style={styles.button}>
        <Text>Deploy Parachute!</Text>
      </TouchableOpacity>
    </View>
  )
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
  button: {
    backgroundColor: 'red',
    padding: 20,
    borderRadius: 5,
  },
  buttonText: {
    fontSize: 20,
    color: '#fff',
  },
}) 

Can somebody help me please