Skip to content

feat: Add profile screen and various improvements #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
digitalnomad91 merged 4 commits into from
Feb 22, 2026
Merged

feat: Add profile screen and various improvements #10

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
064b954
feat: Add profile screen and various improvements
digitalnomad91 Feb 22, 2026
d489567
Update components/permissions/TelephonySmsPermissionDemo.tsx
digitalnomad91 Feb 22, 2026
8d8bbd3
Update app/(tabs)/profile.tsx
digitalnomad91 Feb 22, 2026
2d173fa
Update components/permissions/TelephonySmsPermissionDemo.tsx
digitalnomad91 Feb 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 21 additions & 4 deletions app/(tabs)/_layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
import FontAwesome from '@expo/vector-icons/FontAwesome';
import { Link, Tabs } from 'expo-router';
import { Tabs, usePathname, useRouter } from 'expo-router';

// You can explore the built-in icon families and icons on the web at https://icons.expo.fyi/
function TabBarIcon(props: { name: React.ComponentProps<typeof FontAwesome>['name']; color: string }) {
return <FontAwesome size={28} style={{ marginBottom: -3 }} {...props} />;
}

export default function TabLayout() {
const pathname = usePathname();
const router = useRouter();

return (
<Tabs
screenOptions={{
Expand Down Expand Up @@ -38,10 +41,10 @@ export default function TabLayout() {
}}
/>
<Tabs.Screen
name="cellular"
name="profile"
options={{
title: 'Cellular',
tabBarIcon: ({ color }: { color: string }) => <TabBarIcon name="phone" color={color} />,
title: 'Profile',
tabBarIcon: ({ color }: { color: string }) => <TabBarIcon name="user" color={color} />,
}}
/>
<Tabs.Screen
Expand All @@ -50,6 +53,20 @@ export default function TabLayout() {
title: 'Permissions',
tabBarIcon: ({ color }: { color: string }) => <TabBarIcon name="shield" color={color} />,
}}
listeners={{
tabPress: (e: { preventDefault: () => void }) => {
// If already on a permissions sub-page (not the index), navigate to permissions index
const isOnPermissionsSubPage = pathname.startsWith('/permissions/') && pathname !== '/permissions';
const isOnPermissionsIndex = pathname === '/permissions' || pathname === '/(tabs)/permissions';

if (isOnPermissionsSubPage || isOnPermissionsIndex) {
// Prevent default tab behavior
e.preventDefault();
// Navigate to permissions index, replacing the current route to reset the stack
router.replace('/(tabs)/permissions');
}
Comment on lines +57 to +67
Copy link

Copilot AI Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The tab press logic on lines 59-62 has redundant conditions. When isOnPermissionsIndex is true, the code prevents default and calls router.replace('/(tabs)/permissions'), which navigates to the same page the user is already on. This creates unnecessary navigation and may cause flickering. The condition should only prevent default and navigate when on a sub-page, not when already on the index. Remove isOnPermissionsIndex from the if condition on line 62.

Copilot uses AI. Check for mistakes.
Copy link
Member Author

@digitalnomad91 digitalnomad91 Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot open a new pull request to apply changes based on this feedback

},
}}
/>
</Tabs>
);
Expand Down
37 changes: 0 additions & 37 deletions app/(tabs)/cellular.tsx
View file
Open in desktop

This file was deleted.

88 changes: 2 additions & 86 deletions app/(tabs)/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,21 +1,11 @@
import { View, Text, Button, ActivityIndicator, StyleSheet, Image, ScrollView } from 'react-native';
import MapView, { Marker } from 'react-native-maps';
import { View, Button, StyleSheet, Image, ScrollView } from 'react-native';
import { Link } from 'expo-router';
import { useLocation } from '@/hooks/useLocation';
import LogViewer from '@/components/LogViewer';
import BatteryInfo from '@/components/BatteryInfo';
import { triggerLocalSampleNotification } from '@/utils/notifications.utils';
import { usePushNotifications } from '@/hooks/usePushNotifications';
import CustomHeader from '@/components/CustomHeader';
import { simulateAsyncGlobalError, triggerNativeTestException } from '@/services/errorHandler.service';
import * as Sentry from '@sentry/react-native';

export default function LocationComponent() {
const { fcmToken } = usePushNotifications();
const { location, address, error, loading, fetchLocation } = useLocation(fcmToken);

const textColor = '#ffffff';

export default function HomeScreen() {
return (
<View style={{ flex: 1, backgroundColor: '#000' }}>
<CustomHeader title="Home" showModalButton={true} />
Expand All @@ -28,64 +18,6 @@ export default function LocationComponent() {
{/* Battery information */}
<BatteryInfo />

{/* Location / Map */}
{loading ? (
<ActivityIndicator size="large" color="#007AFF" />
) : error ? (
<Text style={[styles.text, { color: textColor }]}>{error}</Text>
) : location && address ? (
<>
<Text style={[styles.text, { color: textColor }]}>
Address: {address.name}, {address.city}, {address.region}, {address.country}
</Text>
<Text style={[styles.text, { color: textColor }]}>
{location.coords.latitude} - {location.coords.longitude}
</Text>

<View style={styles.mapContainer}>
<MapView
style={styles.map}
region={
location
? {
latitude: location.coords.latitude,
longitude: location.coords.longitude,
latitudeDelta: 0.01,
longitudeDelta: 0.01,
}
: {
latitude: 37.7749, // Default to San Francisco
longitude: -122.4194,
latitudeDelta: 0.05,
longitudeDelta: 0.05,
}
}
showsUserLocation={true}
loadingEnabled={true}
>
{location && (
<Marker
coordinate={{
latitude: location.coords.latitude,
longitude: location.coords.longitude,
}}
title="You are here"
/>
)}
</MapView>
</View>
</>
) : (
<Text style={[styles.text, { color: textColor }]}>Waiting for location...</Text>
)}

<Button title="Get Location" onPress={fetchLocation} />
<Button title="Trigger Sample Notification" onPress={triggerLocalSampleNotification} />
<View style={{ height: 12 }} />
<Button title="JS Crash Test (async)" onPress={() => simulateAsyncGlobalError('Manual JS async crash test')} />
<View style={{ height: 8 }} />
<Button color="#d9534f" title="Native Crash Test" onPress={triggerNativeTestException} />

{/* Link to Login page */}
<View style={{ marginTop: 12 }}>
<Link href="/login" asChild>
Expand All @@ -108,11 +40,6 @@ const styles = StyleSheet.create({
width: '90%',
alignItems: 'center',
},
text: {
fontSize: 16,
marginVertical: 8,
textAlign: 'center',
},
batteryContainer: {
borderRadius: 8,
padding: 10,
Expand All @@ -124,17 +51,6 @@ const styles = StyleSheet.create({
fontSize: 16,
marginBottom: 4,
},
mapContainer: {
width: '100%',
height: 300,
marginTop: 16,
borderRadius: 10,
overflow: 'hidden',
},
map: {
width: '100%',
height: '100%',
},
});

const imgStyles = StyleSheet.create({
Expand Down
11 changes: 11 additions & 0 deletions app/(tabs)/permissions/_layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { Stack } from 'expo-router';

export default function PermissionsLayout() {
return (
<Stack
screenOptions={{
headerShown: false,
}}
/>
);
}
41 changes: 25 additions & 16 deletions app/(tabs)/permissions/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,22 @@
import { Link } from 'expo-router';
import { useRouter } from 'expo-router';
import React from 'react';
import { View, Text, StyleSheet, ScrollView, Pressable } from 'react-native';
import FontAwesome from '@expo/vector-icons/FontAwesome';
import CustomHeader from '@/components/CustomHeader';

const routes = [
{ href: '/permissions/location', title: 'Location (foreground/background)' },
{ href: '/permissions/camera-mic', title: 'Camera & Microphone' },
{ href: '/permissions/notifications', title: 'Notifications' },
{ href: '/permissions/media-storage', title: 'Media Library' },
{ href: '/permissions/storage', title: 'Storage & File Access' },
{ href: '/permissions/telephony-sms', title: 'Telephony & SMS' },
{ href: '/permissions/connectivity', title: 'Bluetooth & Nearby' },
const routes: Array<{ href: string; title: string; icon: string; color: string }> = [
{ href: '/permissions/location', title: 'Location (foreground/background)', icon: '📍', color: '#4CAF50' },
{ href: '/permissions/camera-mic', title: 'Camera & Microphone', icon: '📷', color: '#E91E63' },
{ href: '/permissions/notifications', title: 'Notifications', icon: '🔔', color: '#FF9800' },
{ href: '/permissions/media-storage', title: 'Media Library', icon: '🖼️', color: '#9C27B0' },
{ href: '/permissions/storage', title: 'Storage & File Access', icon: '📁', color: '#00BCD4' },
{ href: '/permissions/telephony-sms', title: 'Telephony & SMS', icon: '📱', color: '#F44336' },
{ href: '/permissions/connectivity', title: 'Bluetooth & Nearby', icon: '📶', color: '#3F51B5' },
];

export default function PermissionsHub() {
const router = useRouter();

return (
<View style={styles.container}>
<CustomHeader title="Permissions Hub" />
Expand All @@ -24,12 +27,14 @@ export default function PermissionsHub() {
</Text>
{routes.map((route) => (
<View style={styles.card} key={route.href}>
<Text style={styles.cardTitle}>{route.title}</Text>
<Link href={route.href} asChild>
<Pressable style={styles.button}>
<Text style={styles.buttonText}>Open demo</Text>
</Pressable>
</Link>
<Text style={styles.cardTitle}>{route.icon} {route.title}</Text>
<Pressable
style={[styles.button, { backgroundColor: route.color }]}
onPress={() => router.push(route.href as any)}
>
<Text style={styles.buttonText}>Open demo</Text>
<FontAwesome name="chevron-right" size={12} color="#fff" style={styles.buttonArrow} />
</Pressable>
</View>
))}
</ScrollView>
Expand All @@ -53,8 +58,12 @@ const styles = StyleSheet.create({
button: {
backgroundColor: '#1e88e5',
paddingVertical: 10,
paddingHorizontal: 16,
borderRadius: 8,
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
},
buttonText: { color: '#fff', fontWeight: '600' },
buttonText: { color: '#fff', fontWeight: '600', fontSize: 14 },
buttonArrow: { marginLeft: 8, marginTop: 2 },
});
Loading