Utc

App.tsx

@@ -19,7 +19,7 @@ import { State } from "react-native-gesture-handler";
 import Toast, { ErrorToast } from "react-native-toast-message";
 
 const prefix = Linking.createURL("/");
-console.log(prefix);
+// console.log(prefix);
 
 type RootStackParamList = {
   Login: undefined,
@@ -70,6 +70,7 @@ const App = (props) => {
       if (token) {
         dispatch(setToken(token))
         const decoded = decodeToken(token);
+        console.log("token", token, "decoded token", decoded);
         console.log(decoded.roles);
 
         if(!decoded.roles.includes('USER')) {

Components/CurrentEventCard.tsx

@@ -15,10 +15,10 @@ import {
 } from "@expo-google-fonts/kufam";
 import CustomModal from "./CustomModal"; // Import the custom modal
 
-// import AppLoading from "expo-app-loading";
+import AppLoading from "expo-app-loading";
 import Colors from "../constants/Colors";
 
-import { formatTime } from "../navigation/DayEvent";
+import { formatTime, formatLocation } from "../navigation/DayEvent";
 
 import EvilIcons from "@expo/vector-icons/EvilIcons";
 
@@ -41,9 +41,9 @@ const CurrentEventCard = ({
     Kufam_700Bold_Italic,
   });
 
-  //   if (!fontsLoaded) {
-  //     return <AppLoading />;
-  //   }
+    if (!fontsLoaded) {
+      return <AppLoading />;
+    }
 
   // Get the current time
   const currentTime = new Date();
@@ -70,7 +70,7 @@ const CurrentEventCard = ({
             <View style={styles.info}>
               <View style={styles.infoItem}>
                 <EvilIcons name="location" size={26} color={Colors.DARK_BLUE} />
-                <Text style={styles.infoText}>{location}</Text>
+                <Text style={styles.infoText}>{formatLocation(location)}</Text>
               </View>
               <View style={styles.infoItem}>
                 <EvilIcons name="clock" size={26} color={Colors.DARK_BLUE} />
@@ -98,7 +98,7 @@ const CurrentEventCard = ({
         visible={showModal}
         onClose={() => setShowModal(false)}
         title={name}
-        location={location}
+        location={formatLocation(location)}
         time={formatTime(start)}
         points={points}
         description={description}
@@ -134,11 +134,12 @@ const styles = StyleSheet.create({
   },
   info: {
     flexDirection: "row",
+    marginTop: 2
   },
   infoItem: {
     flexDirection: "row",
     alignItems: "center",
-    marginHorizontal: 8,
+    marginRight: 10,
   },
   infoText: {
     color: Colors.DARK_BLUE,

components/EventCard.tsx

@@ -47,7 +47,7 @@ const EventCard = ({ name, time, location, description, points }) => {
             </Text>
             <View style={styles.info}>
               <View style={styles.infoItem}>
-                <EvilIcons name="location" size={26} color={Colors.DARK_BLUE} />
+                <EvilIcons name="location" size={26} color={Colors.DARK_BLUE} style={{ margin: 0, padding: 0}} />
                 <Text style={styles.infoText}>{location}</Text>
               </View>
               <View style={styles.infoItem}>
@@ -103,19 +103,25 @@ const styles = StyleSheet.create({
     marginLeft: 15,
     marginTop: 30,
     maxWidth: 320,
+    // backgroundColor: 'green'
   },
   name: {
     fontSize: 20,
     color: "black",
     fontFamily: "Kufam_700Bold",
   },
   info: {
+    flex: 1,
     flexDirection: "row",
+    // backgroundColor: 'red',
+    flexWrap: 'wrap',
+    marginTop: 2
   },
   infoItem: {
     flexDirection: "row",
     alignItems: "center",
-    marginHorizontal: 8,
+    marginRight: 10,
+    // backgroundColor: 'purple'
   },
   infoText: {
     color: Colors.DARK_BLUE,

components/EventModal.tsx

@@ -28,11 +28,6 @@ const EventModal = ({ title, location, time, points, description }) => {
             <EvilIcons name="clock" size={26} color={Colors.DARK_BLUE} />
             <Text style={styles.infoText}>{time}</Text>
           </View>
-          {/* <View style={styles.infoItem}>
-              <View style={styles.badge}>
-                <Text style={styles.badgeText}>{points} pts</Text>
-              </View>
-            </View> */}
           <View style={styles.infoItem}>
             <Image
               source={require("../assets/pixel.png")}
@@ -66,19 +61,21 @@ const styles = StyleSheet.create({
   name: {
     fontSize: 20,
     // marginLeft: 20,
-    paddingRight: 25,
+    // paddingRight: 25,
     color: "black",
     fontFamily: "Kufam_700Bold",
-    paddingRight: 25,
   },
   info: {
     flexDirection: "row",
+    // backgroundColor: 'green',
+    flexWrap: 'wrap'
   },
   infoItem: {
     flexDirection: "row",
     alignItems: "center",
-    marginTop: 10,
-    marginRight: 16,
+    marginTop: 5,
+    marginRight: 8,
+    // backgroundColor: 'red'
   },
   infoText: {
     color: Colors.DARK_BLUE,

navigation/DayEvent.tsx

@@ -4,19 +4,29 @@ import EventCard from "../Components/EventCard";
 import Colors from "../constants/Colors";
 
 export const formatTime = (timestamp) => {
-  const date = new Date(timestamp); // Create a Date object from the timestamp string
-  let hours = date.getUTCHours();
-  let minutes = date.getUTCMinutes();
-  const ampm = hours >= 12 ? "PM" : "AM"; // Determine if it's AM or PM
+  const date = new Date(timestamp);
 
-  hours = hours % 12;
-  hours = hours ? hours : 12; // Handle midnight (0 hours)
-  let minuteStr = minutes < 10 ? "0" + minutes : minutes; // Add leading zero for single digit minutes
+  // Format the time for 'America/Chicago' (Central Time) using the Intl API
+  const options = {
+    hour: "numeric",
+    minute: "numeric",
+    hour12: true,
+    timeZone: "America/Chicago",
+  };
+
+  const formattedTime = new Intl.DateTimeFormat("en-US", options).format(date);
 
-  const formattedTime = hours + ":" + minuteStr + ampm; // Concatenate hours, minutes, and AM/PM
   return formattedTime;
 };
 
+export const formatLocation = (location) => {
+  if (location.includes("Atrium")) {
+    const locationWords = location.split(' ');
+    return `${locationWords[1]} ${locationWords[2]}`
+  }
+  return location
+}
+
 const DayEvent = ({ day, events }) => {
   return (
     <View style={styles.container}>
@@ -29,7 +39,7 @@ const DayEvent = ({ day, events }) => {
             key={event.id}
             name={event.name}
             time={formatTime(event.startTime)}
-            location={"location"}
+            location={formatLocation(event.location)}
             description={event.description}
             points={event.points}
           />

screens/Login.tsx

@@ -41,6 +41,7 @@ const Login: React.FC<LoginProps> = ({ navigation }) => {
     )
       .then((result) => {
         if (result.type === "success") {
+          console.log("opening url for log in ")
           Linking.openURL(result.url);
         }
       })

yarn.lock

@@ -11637,6 +11637,15 @@ expo@latest:
   languageName: node
   linkType: hard
 
+"react-icons@npm:^5.3.0":
+  version: 5.3.0
+  resolution: "react-icons@npm:5.3.0"
+  peerDependencies:
+    react: "*"
+  checksum: 3aa5f50e05aafc6d31e0d995fe0d98560069aa88717b24ce8aaa082a7e7b20ca95e1e19d847ed6e52d658a5a30e15826af20d7554bf993a743edd55586db62e3
+  languageName: node
+  linkType: hard
+
 "react-is@npm:^16.12.0 || ^17.0.0 || ^18.0.0, react-is@npm:^18.0.0":
   version: 18.3.1
   resolution: "react-is@npm:18.3.1"
@@ -11824,6 +11833,16 @@ expo@latest:
   languageName: node
   linkType: hard
 
+"react-native-toast-message@npm:^2.2.0":
+  version: 2.2.0
+  resolution: "react-native-toast-message@npm:2.2.0"
+  peerDependencies:
+    react: "*"
+    react-native: "*"
+  checksum: b286b8d5ca0f21737c2e0a8e9c2d6dab2c06a3895335aa541c69eeb42d526cc6f3951069e59d8d346d3e6cafb8feaa450c35b0efe7c3d51ff81351d1477e71eb
+  languageName: node
+  linkType: hard
+
 "react-native-webview@npm:^13.12.0":
   version: 13.12.0
   resolution: "react-native-webview@npm:13.12.0"
@@ -12403,6 +12422,7 @@ expo@latest:
     jwt-decode: ^4.0.0
     lucide-react-native: ^0.381.0
     react: 18.2.0
+    react-icons: ^5.3.0
     react-native: 0.74.2
     react-native-gesture-handler: ^2.16.0
     react-native-modal: ^13.0.1
@@ -12416,6 +12436,7 @@ expo@latest:
     react-native-svg-transformer: ^1.5.0
     react-native-svg-uri: ^0.0.1
     react-native-tab-view: ^3.5.2
+    react-native-toast-message: ^2.2.0
     react-native-webview: ^13.12.0
     react-navigation: ^5.0.0
     react-redux: ^9.1.2