Add new screens for game management, team management, and cache handling; implement caching logic and session management

src/components/screens/AdminHubScreen.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const AdminHubScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Admin Hub</Text>
+    <Text style={styles.body}>Admin hub setup goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default AdminHubScreen;

src/components/screens/CreateGameScreen.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const CreateGameScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Create Game</Text>
+    <Text style={styles.body}>Create game setup goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default CreateGameScreen;

src/components/screens/GameLobbyScreen.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const GameLobbyScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Game Lobby</Text>
+    <Text style={styles.body}>Game lobby setup goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default GameLobbyScreen;

src/components/screens/GameTypeScreen.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import {Pressable, StyleSheet, Text, View} from 'react-native';
+import useGameHook from '../../hooks/useGameHook';
+import Screen from '../layout/Screen';
+
+const GameTypeScreen = ({ navigation }) => {
+  const { getGameTypes } = useGameHook();
+  const gameTypes = getGameTypes();
+
+  return (
+    <Screen style={styles.container}>
+      <Text style={styles.title}>Select Game Type</Text>
+      <View style={styles.content}>
+        {gameTypes && gameTypes.map((type) => (
+          <Pressable key={type} style={styles.button} onPress={() => navigation.navigate('GameLobbyScreen')}>
+            <Text style={styles.buttonText}>{type}</Text>
+          </Pressable>
+        ))}
+      </View>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+  },
+  content: {
+    gap: 12,
+    flex: 1,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    textAlign: 'center',
+    marginBottom: 20,
+  },
+  button: {
+    backgroundColor: '#2563eb',
+    borderRadius: 8,
+    paddingVertical: 12,
+    alignItems: 'center',
+  },
+  buttonText: {
+    color: '#ffffff',
+    fontWeight: '600',
+  },
+});
+
+export default GameTypeScreen;

src/components/screens/JoinPrivateGameScreen.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const JoinPrivateGameScreen = () => {
+  return (
+    <Screen style={styles.container}>
+      <Text style={styles.title}>Join Private Game</Text>
+      <Text style={styles.body}>Join private game setup goes here.</Text>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+  },
+  body: {
+    color: '#4b5563',
+    fontSize: 15,
+    marginTop: 10,
+  },
+});
+
+export default JoinPrivateGameScreen;

src/components/screens/LeaderboardScreen.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const LeaderboardScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Leaderboard</Text>
+    <Text style={styles.body}>Leaderboard view goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default LeaderboardScreen;
+

src/components/screens/LoginScreen.js

@@ -0,0 +1,110 @@
+import React, {useState} from 'react';
+import {Pressable, StyleSheet, Text, TextInput, View} from 'react-native';
+import useAuthHook from '../../hooks/useAuthHook';
+import Screen from '../layout/Screen';
+import {Button, ButtonTray} from '../UI/Button';
+
+const LoginScreen = ({ navigation }) => {
+  const { email, password, error, isLoading, setEmail, setPassword, login } = useAuthHook();
+  const [submitting, setSubmitting] = useState(false);
+
+  const handleLogin = async () => {
+    setSubmitting(true);
+    const user = await login();
+    setSubmitting(false);
+    if (!user) {
+      return;
+    }
+    if (user.IsAcceptedAdmin) {
+      navigation.reset({ index: 0, routes: [{ name: 'Admin' }] });
+      return;
+    }
+    navigation.reset({ index: 0, routes: [{ name: 'Game' }] });
+  };
+
+  return (
+    <Screen style={styles.container}>
+      <View style={styles.content}>
+        <Text style={styles.title}>Login</Text>
+
+        <TextInput
+          style={styles.input}
+          placeholder="Email"
+          autoCapitalize="none"
+          keyboardType="email-address"
+          value={email}
+          onChangeText={setEmail}
+          editable={!isLoading}
+        />
+        <TextInput
+          style={styles.input}
+          placeholder="Password"
+          secureTextEntry
+          value={password}
+          onChangeText={setPassword}
+          editable={!isLoading}
+        />
+
+        {error ? <Text style={styles.errorText}>{error}</Text> : null}
+
+        <ButtonTray>
+          <Button
+            label={submitting ? 'Logging in...' : 'Login'}
+            onClick={handleLogin}
+            styleButton={styles.submitButton}
+            styleLabel={styles.submitText}
+          />
+        </ButtonTray>
+
+        <Pressable onPress={() => navigation.navigate('Auth', { screen: 'RegisterScreen' })}>
+          <Text style={styles.linkText}>Create new account</Text>
+        </Pressable>
+      </View>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+  },
+  content: {
+    gap: 15,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    textAlign: 'center',
+    marginBottom: 10,
+  },
+  input: {
+    borderWidth: 1,
+    borderColor: '#d1d5db',
+    borderRadius: 8,
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+    fontSize: 16,
+  },
+  errorText: {
+    color: '#dc2626',
+    textAlign: 'center',
+    marginTop: 5,
+  },
+  submitButton: {
+    backgroundColor: '#2563eb',
+    borderColor: '#2563eb',
+  },
+  submitText: {
+    color: '#ffffff',
+    fontWeight: '600',
+  },
+  linkText: {
+    textAlign: 'center',
+    color: '#2563eb',
+    fontWeight: '600',
+    paddingVertical: 10,
+  },
+});
+
+export default LoginScreen;
+

src/components/screens/ManageGameScreen.js

@@ -0,0 +1,168 @@
+import React, {useCallback, useEffect, useState} from 'react';
+import {ActivityIndicator, StyleSheet, Text, View} from 'react-native';
+import * as Location from 'expo-location';
+import Screen from '../layout/Screen';
+import AdminCacheEditorView from '../gameplay/AdminCacheEditorView';
+import useGameHook from '../../hooks/useGameHook';
+import {getSession} from '../../hooks/SessionStore';
+
+const ManageGameScreen = () => {
+  const session = getSession();
+  const { getCaches, upsertCache } = useGameHook();
+  const [userLocation, setUserLocation] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState('');
+  const [cacheRecords, setCacheRecords] = useState([]);
+
+  const loadCaches = useCallback(() => {
+    if (!session.currentGid) {
+      setCacheRecords([]);
+      return;
+    }
+    setCacheRecords(getCaches(session.currentGid, null));
+  }, [getCaches, session.currentGid]);
+
+  useEffect(() => {
+    loadCaches();
+  }, [loadCaches]);
+
+  useEffect(() => {
+    let locationSub;
+
+    const start = async () => {
+      const { status } = await Location.requestForegroundPermissionsAsync();
+      if (status !== 'granted') {
+        setError('Location permission denied');
+        setLoading(false);
+        return;
+      }
+
+      const current = await Location.getCurrentPositionAsync({ accuracy: Location.Accuracy.Balanced });
+      setUserLocation({ latitude: current.coords.latitude, longitude: current.coords.longitude });
+
+      locationSub = await Location.watchPositionAsync(
+        {
+          accuracy: Location.Accuracy.Balanced,
+          distanceInterval: 1,
+          timeInterval: 1000,
+        },
+        (next) => {
+          setUserLocation({ latitude: next.coords.latitude, longitude: next.coords.longitude });
+        },
+      );
+
+      setLoading(false);
+    };
+
+    start();
+
+    return () => {
+      if (locationSub) {
+        locationSub.remove();
+      }
+    };
+  }, []);
+
+  const handleAddCache = (coordinate) => {
+    if (!session.currentGid) {
+      return;
+    }
+    upsertCache({
+      gid: session.currentGid,
+      latitude: coordinate.latitude,
+      longitude: coordinate.longitude,
+      radius: 20,
+      clue: `Cache ${cacheRecords.length + 1}`,
+      subgroupId: 1,
+    });
+    loadCaches();
+  };
+
+  const handleMoveCache = (cacheId, coordinate) => {
+    if (!session.currentGid) {
+      return;
+    }
+    const current = cacheRecords.find((cache) => cache.id === cacheId);
+    if (!current) {
+      return;
+    }
+    upsertCache({
+      gid: session.currentGid,
+      cacheId,
+      latitude: coordinate.latitude,
+      longitude: coordinate.longitude,
+      radius: current.radius,
+      clue: current.clue,
+      subgroupId: current.subgroupId,
+    });
+    loadCaches();
+  };
+
+  if (!session.currentGid) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.body}>Create or join a game first.</Text>
+      </Screen>
+    );
+  }
+
+  if (!session.isAcceptedAdmin) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.body}>Only admins can edit cache locations.</Text>
+      </Screen>
+    );
+  }
+
+  if (loading) {
+    return (
+      <Screen style={styles.center}>
+        <ActivityIndicator size="large" />
+      </Screen>
+    );
+  }
+
+  if (error) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.error}>{error}</Text>
+      </Screen>
+    );
+  }
+
+  return (
+    <Screen style={styles.container}>
+      <View style={styles.mapWrap}>
+        <AdminCacheEditorView
+          userLocation={userLocation}
+          caches={cacheRecords}
+          onAddCache={handleAddCache}
+          onMoveCache={handleMoveCache}
+        />
+      </View>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    padding: 0,
+  },
+  mapWrap: {
+    flex: 1,
+  },
+  center: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  body: {
+    color: '#4b5563',
+    fontSize: 15,
+  },
+  error: {
+    color: '#dc2626',
+    fontSize: 15,
+  },
+});
+
+export default ManageGameScreen;

src/components/screens/ManagePrivateGameScreen.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const ManagePrivateGameScreen = () => {
+  return (
+    <Screen style={styles.container}>
+      <Text style={styles.title}>Manage Private Game</Text>
+      <Text style={styles.body}>Manage private game setup goes here.</Text>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default ManagePrivateGameScreen;

src/components/screens/ManageSubgroupsScreen.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const ManageSubgroupsScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Manage Subgroups</Text>
+    <Text style={styles.body}>Manage subgroups setup goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default ManageSubgroupsScreen;

src/components/screens/MapScreen.js

@@ -0,0 +1,183 @@
+import React, {useCallback, useEffect, useMemo, useState} from 'react';
+import {ActivityIndicator, StyleSheet, Text, View} from 'react-native';
+import * as Location from 'expo-location';
+import {Magnetometer} from 'expo-sensors';
+import Screen from '../layout/Screen';
+import PlayerMapView from '../gameplay/PlayerMapView';
+import useGameHook from '../../hooks/useGameHook';
+import usePlayerGame from '../../hooks/usePlayerGame';
+import {getSession} from '../../hooks/SessionStore';
+import Cache from '../../models/Cache';
+
+const toHeading = ({ x, y }) => {
+  const angle = Math.atan2(y, x) * (180 / Math.PI);
+  return angle < 0 ? angle + 360 : angle;
+};
+
+const MapScreen = () => {
+  const session = getSession();
+  const { getCaches, claimCache } = useGameHook();
+  const [userLocation, setUserLocation] = useState(null);
+  const [heading, setHeading] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [cacheRecords, setCacheRecords] = useState([]);
+  const [error, setError] = useState('');
+
+  const activeCaches = useMemo(() => (
+    cacheRecords.map(
+      (cache) => new Cache(
+        cache.id,
+        cache.coordinates.latitude,
+        cache.coordinates.longitude,
+        cache.radius,
+        cache.clue,
+        cache.groupId,
+        cache.subgroupId,
+      ),
+    )
+  ), [cacheRecords]);
+
+  const subgroupFilter = session.currentSGid;
+  const { visibleCache, isClaiming, setIsClaiming } = usePlayerGame(userLocation, heading, activeCaches);
+
+  const loadCaches = useCallback(() => {
+    if (!session.currentGid) {
+      setCacheRecords([]);
+      return;
+    }
+    const rows = getCaches(session.currentGid, subgroupFilter);
+    setCacheRecords(rows);
+  }, [getCaches, session.currentGid, subgroupFilter]);
+
+  useEffect(() => {
+    loadCaches();
+  }, [loadCaches]);
+
+  useEffect(() => {
+    let locationSub;
+    let headingSub;
+
+    const start = async () => {
+      const { status } = await Location.requestForegroundPermissionsAsync();
+      if (status !== 'granted') {
+        setError('Location permission denied');
+        setLoading(false);
+        return;
+      }
+
+      const current = await Location.getCurrentPositionAsync({ accuracy: Location.Accuracy.Balanced });
+      setUserLocation({ latitude: current.coords.latitude, longitude: current.coords.longitude });
+
+      locationSub = await Location.watchPositionAsync(
+        {
+          accuracy: Location.Accuracy.Balanced,
+          distanceInterval: 1,
+          timeInterval: 1000,
+        },
+        (next) => {
+          setUserLocation({ latitude: next.coords.latitude, longitude: next.coords.longitude });
+        },
+      );
+
+      Magnetometer.setUpdateInterval(500);
+      headingSub = Magnetometer.addListener((data) => {
+        setHeading(toHeading(data));
+      });
+
+      setLoading(false);
+    };
+
+    start();
+
+    return () => {
+      if (locationSub) {
+        locationSub.remove();
+      }
+      if (headingSub) {
+        headingSub.remove();
+      }
+    };
+  }, []);
+
+  const handleClaim = (cacheId) => {
+    if (!session.currentGid) {
+      return;
+    }
+    claimCache({
+      gid: session.currentGid,
+      cacheId,
+      uid: session.currentUid,
+      tid: session.currentTid,
+    });
+    setIsClaiming(false);
+    loadCaches();
+  };
+
+  if (!session.currentGid) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.body}>Join or create a game to use map features.</Text>
+      </Screen>
+    );
+  }
+
+  if (session.isAcceptedAdmin) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.body}>Admins manage caches from Manage Game.</Text>
+      </Screen>
+    );
+  }
+
+  if (loading) {
+    return (
+      <Screen style={styles.center}>
+        <ActivityIndicator size="large" />
+      </Screen>
+    );
+  }
+
+  if (error) {
+    return (
+      <Screen style={styles.center}>
+        <Text style={styles.error}>{error}</Text>
+      </Screen>
+    );
+  }
+
+  return (
+    <Screen style={styles.container}>
+      <View style={styles.mapWrap}>
+        <PlayerMapView
+          userLocation={userLocation}
+          visibleCache={visibleCache}
+          isClaiming={isClaiming}
+          onClaimSuccess={handleClaim}
+        />
+      </View>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    padding: 0,
+  },
+  mapWrap: {
+    flex: 1,
+  },
+  center: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  body: {
+    color: '#4b5563',
+    fontSize: 15,
+  },
+  error: {
+    color: '#dc2626',
+    fontSize: 15,
+  },
+});
+
+export default MapScreen;

src/components/screens/RegisterScreen.js

@@ -0,0 +1,178 @@
+import React, {useState} from 'react';
+import {Pressable, StyleSheet, Text, TextInput, View} from 'react-native';
+import useAuthHook from '../../hooks/useAuthHook';
+import Screen from '../layout/Screen';
+import {Button, ButtonTray} from '../UI/Button';
+
+const RegisterScreen = ({ navigation }) => {
+  const {
+    username,
+    email,
+    password,
+    confirmPassword,
+    accountType,
+    error,
+    isLoading,
+    setUsername,
+    setEmail,
+    setPassword,
+    setConfirmPassword,
+    setAccountType,
+    register,
+  } = useAuthHook();
+  const [submitting, setSubmitting] = useState(false);
+
+  const handleRegister = async () => {
+    setSubmitting(true);
+    const user = await register();
+    setSubmitting(false);
+    if (!user) {
+      return;
+    }
+    if (user.IsAcceptedAdmin) {
+      navigation.reset({ index: 0, routes: [{ name: 'Admin' }] });
+      return;
+    }
+    navigation.reset({ index: 0, routes: [{ name: 'Game' }] });
+  };
+
+  return (
+    <Screen style={styles.container}>
+      <View style={styles.content}>
+        <Text style={styles.title}>Create Account</Text>
+
+        <TextInput
+          style={styles.input}
+          placeholder="Username"
+          value={username}
+          onChangeText={setUsername}
+          editable={!isLoading}
+        />
+        <TextInput
+          style={styles.input}
+          placeholder="Email"
+          autoCapitalize="none"
+          keyboardType="email-address"
+          value={email}
+          onChangeText={setEmail}
+          editable={!isLoading}
+        />
+        <TextInput
+          style={styles.input}
+          placeholder="Password"
+          secureTextEntry
+          value={password}
+          onChangeText={setPassword}
+          editable={!isLoading}
+        />
+        <TextInput
+          style={styles.input}
+          placeholder="Confirm Password"
+          secureTextEntry
+          value={confirmPassword}
+          onChangeText={setConfirmPassword}
+          editable={!isLoading}
+        />
+
+        <View style={styles.typeRow}>
+          <Pressable
+            style={[styles.typeButton, accountType === 'Individual' && styles.typeButtonActive]}
+            onPress={() => setAccountType('Individual')}
+            disabled={isLoading}
+          >
+            <Text style={[styles.typeText, accountType === 'Individual' && styles.typeTextActive]}>Individual</Text>
+          </Pressable>
+          <Pressable
+            style={[styles.typeButton, accountType === 'Business/School' && styles.typeButtonActive]}
+            onPress={() => setAccountType('Business/School')}
+            disabled={isLoading}
+          >
+            <Text style={[styles.typeText, accountType === 'Business/School' && styles.typeTextActive]}>Business</Text>
+          </Pressable>
+        </View>
+
+        {error ? <Text style={styles.errorText}>{error}</Text> : null}
+
+        <ButtonTray>
+          <Button
+            label={submitting ? 'Creating...' : 'Create Account'}
+            onClick={handleRegister}
+            styleButton={styles.submitButton}
+            styleLabel={styles.submitText}
+          />
+        </ButtonTray>
+
+        <Pressable onPress={() => navigation.navigate('Auth', { screen: 'LoginScreen' })}>
+          <Text style={styles.linkText}>Back to Login</Text>
+        </Pressable>
+      </View>
+    </Screen>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+  },
+  content: {
+    gap: 12,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    textAlign: 'center',
+    marginBottom: 10,
+  },
+  input: {
+    borderWidth: 1,
+    borderColor: '#d1d5db',
+    borderRadius: 8,
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+    fontSize: 16,
+  },
+  typeRow: {
+    flexDirection: 'row',
+    gap: 10,
+  },
+  typeButton: {
+    flex: 1,
+    borderWidth: 1,
+    borderColor: '#cbd5e1',
+    borderRadius: 8,
+    alignItems: 'center',
+    paddingVertical: 10,
+  },
+  typeButtonActive: {
+    backgroundColor: '#2563eb',
+    borderColor: '#2563eb',
+  },
+  typeText: {
+    color: '#1f2937',
+    fontWeight: '600',
+  },
+  typeTextActive: {
+    color: '#ffffff',
+  },
+  errorText: {
+    color: '#dc2626',
+    textAlign: 'center',
+    marginTop: 5,
+  },
+  submitButton: {
+    backgroundColor: '#2563eb',
+    borderColor: '#2563eb',
+  },
+  submitText: {
+    color: '#ffffff',
+    fontWeight: '600',
+  },
+  linkText: {
+    textAlign: 'center',
+    color: '#2563eb',
+    fontWeight: '600',
+    paddingVertical: 10,
+  },
+});
+
+export default RegisterScreen;

src/components/screens/TeamScreen.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import {StyleSheet, Text} from 'react-native';
+import Screen from '../layout/Screen';
+
+const TeamScreen = () => (
+  <Screen style={styles.container}>
+    <Text style={styles.title}>Team Management</Text>
+    <Text style={styles.body}>Team management setup goes here.</Text>
+  </Screen>
+);
+
+const styles = StyleSheet.create({
+  container: { justifyContent: 'center', alignItems: 'center' },
+  title: { fontSize: 24, fontWeight: 'bold' },
+  body: { color: '#4b5563', fontSize: 15, marginTop: 10 },
+});
+
+export default TeamScreen;