refactored fonts and removed loading from all files (#211)

client/App.tsx

@@ -4,10 +4,14 @@ import { AuthStore } from "./src/services/AuthStore";
 import { NavigationContainer } from "@react-navigation/native";
 import AppNavigator from "./src/navigation/AppNavigator";
 import AuthNavigator from "./src/navigation/AuthNavigator";
+import { useGlobalFonts } from "./src/styles/fonts";
 
 
 const App = () => {
   const { initialized, isLoggedin } = AuthStore.useState();
+  const { fontsLoaded, fontError } = useGlobalFonts();
+
+  if (!fontsLoaded && !fontError) return <Text>Error Loading Fonts!</Text>;
 
   if (!initialized) return <Text>Loading...</Text>;
 

client/src/components/auth/AuthButtons.tsx

@@ -10,22 +10,14 @@ import {
   ImageSourcePropType,
   Platform,
 } from "react-native";
-import { router, useRouter } from "expo-router";
 import { useFonts } from "expo-font";
 import { appSignOut } from "../../services/AuthStore";
 
 interface SignOutButtonProps {}
 
 export const SignOutButton: React.FC<SignOutButtonProps> = () => {
-  const router = useRouter();
   const [loading, setLoading] = useState(false);
 
-  const [fontsLoaded, fontError] = useFonts({
-    "Gilroy-ExtraBold": require("../../../assets/fonts/Gilroy-ExtraBold.otf"),
-    "Gilroy-Light": require("../../../assets/fonts/Gilroy-Light.otf"),
-    "Quicksand-Medium": require("../../../assets/fonts/Quicksand-Medium.ttf"), // fixed loading this file!
-  });
-
   const handleSignOut = async () => {
     Alert.alert(
       "Confirm Sign Out",
@@ -43,7 +35,7 @@ export const SignOutButton: React.FC<SignOutButtonProps> = () => {
             setLoading(false);
 
             if (response?.user === null) {
-              router.replace("/");
+              console.log("Sign out successful");
             } else if (response?.error) {
               console.log(response.error);
               Alert.alert(
@@ -58,9 +50,6 @@ export const SignOutButton: React.FC<SignOutButtonProps> = () => {
     );
   };
 
-  if (!fontsLoaded && !fontError) {
-    return null;
-  }
 
   return (
     <TouchableOpacity
@@ -76,14 +65,6 @@ export const SignOutButton: React.FC<SignOutButtonProps> = () => {
 export const LogInButton: React.FC<{ onPress?: () => void }> = ({
   onPress,
 }) => {
-  const [fontsLoaded, fontError] = useFonts({
-    "Gilroy-ExtraBold": require("../../../assets/fonts/Gilroy-ExtraBold.otf"),
-    "Gilroy-Light": require("../../../assets/fonts/Gilroy-Light.otf"),
-  });
-
-  if (!fontsLoaded && !fontError) {
-    return null;
-  }
 
   return (
     <TouchableOpacity style={styles.login_button} onPress={onPress}>
@@ -117,10 +98,10 @@ export const ExternalAuthButton: React.FC<{
   imageSource?: ImageSourcePropType;
 }> = ({ onPress, companyName, imageSource }) => {
   const images: { [key: string]: ImageSourcePropType } = {
-    google: require("../../../assets/google_logo.png"),
-    apple: require("../../../assets/apple_logo.png"),
-    github: require("../../../assets/github_logo.png"),
-    facebook: require("../../../assets/facebook_logo.png"),
+    google: require("../../../assets/icons/auth/google_logo.png"),
+    apple: require("../../../assets/icons/auth/apple_logo.png"),
+    github: require("../../../assets/icons/auth/github_logo.png"),
+    facebook: require("../../../assets/icons/auth/facebook_logo.png"),
   };
 
   const clicked = () => {
@@ -132,7 +113,7 @@ export const ExternalAuthButton: React.FC<{
       <Image
         style={styles.login_logo}
         source={
-          images[companyName] || require("../../../assets/adaptive-icon.png")
+          images[companyName] || require("../../../assets/icons/expo/adaptive-icon.png")
         }
       />
     </TouchableOpacity>

client/src/components/auth/LogInButton.tsx

@@ -1,21 +1,10 @@
-import { router } from "expo-router";
 import React from "react";
-import { useFonts } from "expo-font";
 import { StyleSheet, Text, TouchableOpacity, Dimensions } from "react-native";
 import { LogInButtonProps } from "../../types/Props";
 
 
 const LogInButton: React.FC<LogInButtonProps> = ({ onPress }) => {
 
-  const [fontsLoaded, fontError] = useFonts({
-    'Gilroy-ExtraBold': require('../../../assets/fonts/Gilroy-ExtraBold.otf'),
-    'Gilroy-Light': require('../../../assets/fonts/Gilroy-Light.otf'),
-  });
-
-  if (!fontsLoaded && !fontError) {
-    return null;
-  }
-
   return (
     <TouchableOpacity style={styles.button} onPress={onPress}>
       <Text style={styles.button_text}>Log In</Text>

client/src/components/auth/SignUpButton.tsx

@@ -1,18 +1,8 @@
-import { router } from "expo-router";
 import React from "react";
-import { useFonts } from "expo-font";
 import { StyleSheet, Text, TouchableOpacity, Dimensions } from "react-native";
 import { SignUpButtonProps } from "../../types/Props";
 
 const SignUpButton: React.FC<SignUpButtonProps> = ({ onPress }) => {
-  const [fontsLoaded, fontError] = useFonts({
-    "Gilroy-ExtraBold": require("../../../assets/fonts/Gilroy-ExtraBold.otf"),
-    "Gilroy-Light": require("../../../assets/fonts/Gilroy-Light.otf"),
-  });
-
-  if (!fontsLoaded && !fontError) {
-    return null;
-  }
 
   return (
     <TouchableOpacity style={styles.button} onPress={onPress}>

client/src/components/chat/ChatMessage.tsx

@@ -19,7 +19,7 @@ const Message: React.FC<MessageProps> = ({ messageContent, time, author }) => {
       <View style={styles.profileImageContainer}>
         <Image
           style={styles.profileImage}
-          source={require("../../../assets/user_icons/fake_pfp.jpg")}
+          source={require("../../../assets/icons/user/fake_pfp.jpg")}
         />
       </View>
       <View style={styles.contentContainer}>

client/src/components/chat/MessageChannel.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import Message from "./ChatMessage";
-import { FlatList, StyleSheet, View } from "react-native";
+import { FlatList } from "react-native";
 import { MessageChannelProps } from "../../types/Props";
 
 const MessageChannel: React.FC<MessageChannelProps> = ({ messages }) => {

client/src/components/chat/NearbyHeader.tsx

@@ -1,7 +1,7 @@
-
 import { View, Text, StyleSheet, Dimensions, Image } from 'react-native'
 import React from 'react'
-import { CounterProps } from '../../utils/types'
+import NearbyCount from './NearbyCount';
+import { CounterProps } from '../../types/Props';
 
 export const NearbyHeader: React.FC<CounterProps> = ({ count }) => {
   return (

client/src/components/common/CustomButtons.tsx

@@ -5,7 +5,7 @@ import { ChatSendButtonProps } from '../../types/Props';
 export const ChatSendButton: React.FC<ChatSendButtonProps> = ({ onPress }) => {
   return (
     <TouchableOpacity style={styles.sendButton} onPress={onPress}>
-        <Image style={styles.sendButtonImage} source={require('../../../assets/transparentSend.png')}/>
+        <Image style={styles.sendButtonImage} source={require('../../../assets/icons/arrow/transparentSend.png')}/>
     </TouchableOpacity>
   )
 }

client/src/components/settings/SettingsItem.tsx

@@ -39,7 +39,7 @@ export const SettingsItem = ({id, title, type, setter, data}: SettingsProps) =>
                 {(type === 'select') && (
                     <View style={{flexDirection: 'row', alignItems: 'center'}}>
                         <Text style={styles.rowValueText}>{data[id as keyof typeof data]}</Text>
-                        <Image source={require('../../../assets/angle-right.png')} style={styles.rightArrow} />
+                        <Image source={require('../../../assets/icons/arrow/angle-right.png')} style={styles.rightArrow} />
                     </View>
 
                 )}

client/src/navigation/AppNavigator.tsx

@@ -13,7 +13,10 @@ const AppNavigator = () => {
     <LocationProvider>
       <SocketProvider>
         <UserProvider>
-          <Tab.Navigator>
+          <Tab.Navigator screenOptions={{
+            headerShown: false,
+
+          }}>
             <Tab.Screen name="Home" component={ChatScreen} />
             <Tab.Screen name="Profile" component={SettingsScreen} />
           </Tab.Navigator>