Added working activation page

src/routes/Activation/Activation.tsx

@@ -3,6 +3,8 @@ import styles, { colors } from "../../styles";
 import { View, Text, ActivityIndicator } from "react-native";
 import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
 import { useRoute } from "@react-navigation/native";
+import { useEffect, useState } from "react";
+import { UserActivate } from "../../components/Api/Api";
 
 interface ActivationRouteParams {
   uid?: string;
@@ -11,17 +13,47 @@ interface ActivationRouteParams {
 
 export default function Activation() {
   const route = useRoute();
-  const { uid, token } = route.params as ActivationRouteParams;
+  const { uid, token } = (route.params as ActivationRouteParams) || "";
+
+  const [state, setState] = useState(
+    "Activating with UID " + uid + " and Token " + token
+  );
+  const [loading, setLoading] = useState(true);
+  async function activate() {
+    if (await UserActivate({ uid: String(uid), token: String(token) })) {
+      setTimeout(() => {
+        setState("Activation successful!");
+      }, 1000);
+    } else {
+      setTimeout(() => {
+        setState("Activation unsuccessful\nPlease contact support");
+      }, 1000);
+    }
+    setLoading(false);
+  }
+  useEffect(() => {
+    activate();
+  }, []);
   return (
     <View style={styles.background}>
       <AnimatedContainer>
+        <View
+          style={{
+            paddingVertical: 4,
+            marginBottom: 16,
+            borderRadius: 4,
+            width: "90%",
+            backgroundColor: colors.blue_1,
+          }}
+        />
         <Text style={styles.text_white_large}>Activation</Text>
         <View style={{ paddingVertical: 8 }} />
-        <ActivityIndicator size={96} color={colors.blue_1} />
+        <ActivityIndicator
-        <Text style={styles.text_white_medium}>
+          animating={loading}
-          Activating {uid ? `with UID: ${uid}` : ""}{" "}
+          size={96}
-          {token ? `and Token: ${token}` : ""}
+          color={colors.blue_1}
-        </Text>
+        />
+        <Text style={styles.text_white_medium}>{state}</Text>
       </AnimatedContainer>
     </View>
   );