Skip to content

Commit

Permalink
feat: profile pages (#1023)
Browse files Browse the repository at this point in the history
Co-authored-by: Alder Whiteford <[email protected]>
  • Loading branch information
in-mai-space and Alder Whiteford authored Jun 15, 2024
1 parent f7c6e7c commit 91a5dfb
Show file tree
Hide file tree
Showing 49 changed files with 2,433 additions and 1,393 deletions.
2,176 changes: 1,215 additions & 961 deletions frontend/dashboard/yarn.lock

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion frontend/lib/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@generatesac/lib",
"version": "0.0.169",
"version": "0.0.170",
"type": "module",
"main": "dist/index.js",
"types": "dist/index.d.ts",
Expand Down
2 changes: 0 additions & 2 deletions frontend/lib/src/types/category.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { z } from "zod";

import { rootModelSchema } from "./root";
import { tagSchema } from "./tag";

// Schemas:
export const createCategoryRequestBodySchema = z.object({
Expand All @@ -10,7 +9,6 @@ export const createCategoryRequestBodySchema = z.object({

export const categorySchemaIntermediate = z.object({
name: z.string(),
tags: z.array(tagSchema),
});

export const categorySchema = categorySchemaIntermediate.merge(rootModelSchema);
Expand Down
4 changes: 3 additions & 1 deletion frontend/mobile/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
"@fortawesome/free-solid-svg-icons": "^6.5.2",
"@fortawesome/react-fontawesome": "^0.2.2",
"@fortawesome/react-native-fontawesome": "^0.3.2",
"@generatesac/lib": "0.0.169",
"@generatesac/lib": "0.0.170",
"@gorhom/bottom-sheet": "^4.6.3",
"@hookform/resolvers": "^3.4.2",
"@react-native-async-storage/async-storage": "^1.23.1",
Expand All @@ -37,6 +37,8 @@
"@shopify/restyle": "^2.4.4",
"@stream-io/flat-list-mvcp": "^0.10.3",
"@svgr/core": "^8.1.0",
"@tanstack/react-query": "^5.44.0",
"axios": "^1.7.2",
"expo": "~51.0.2",
"expo-dev-client": "~4.0.14",
"expo-font": "~12.0.5",
Expand Down
3 changes: 2 additions & 1 deletion frontend/mobile/src/app/(app)/(tabs)/_layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,8 @@ const Layout = () => {
name="profile"
options={{
title: 'Profile',
headerShown: false,
headerShown: true,
headerTransparent: true,
tabBarLabel: ({ focused }) =>
TabBarLabel({ focused, title: 'Profile' }),
tabBarIcon: ({ focused }) =>
Expand Down
103 changes: 91 additions & 12 deletions frontend/mobile/src/app/(app)/(tabs)/profile.tsx
Original file line number Diff line number Diff line change
@@ -1,31 +1,110 @@
import { StyleSheet, Text, View } from 'react-native';
import React from 'react';
import { StyleSheet, TouchableOpacity } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';

import { router } from 'expo-router';

import {
IconDefinition,
faHeart,
faSignOutAlt,
faUser
} from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-native-fontawesome';
import { Avatar } from '@rneui/base';

import { GlobalLayout } from '@/src/app/(design-system)/components/GlobalLayout/GlobalLayout';

import { Box, Colors, SACColors, Spacing, Text } from '../../(design-system)';

type ProfileItemProps = {
icon: IconDefinition;
text: string;
textColor?: SACColors;
onPress?: () => void;
};

const ProfileItem = ({ icon, text, textColor, onPress }: ProfileItemProps) => (
<TouchableOpacity onPress={onPress}>
<Box
gap="l"
paddingVertical="s"
flexDirection="row"
alignItems="center"
>
<FontAwesomeIcon
size={24}
color={textColor ? Colors.darkRed : Colors.gray}
icon={icon}
/>
<Text color={textColor}>{text}</Text>
</Box>
</TouchableOpacity>
);

const ProfilePage = () => {
return (
<GlobalLayout>
<View style={styles.container}>
<Text style={styles.title}>Profile</Text>
</View>
<SafeAreaView style={styles.container}>
<Box
paddingTop="xxl"
flexDirection="row"
gap="m"
alignItems="center"
>
<Avatar
source={{
uri: 'https://media1.popsugar-assets.com/files/thumbor/S6_lryTon-0orhMkLrw6m1yIFww=/1500x1500/filters:format_auto():quality(85):extract_cover()/2017/02/28/003/n/1922441/ace7eba458b602264e7940.39836479_edit_img_image_43244124_1488304081.jpg'
}}
size={60}
rounded
/>
<Box flexDirection="column" gap="xxs">
<Text variant="subheader-2">Quokka</Text>
<Text>[email protected]</Text>
</Box>
</Box>
<Box width="100%">
<ProfileItem
onPress={() => router.push('/user/detail/')}
icon={faUser}
text="Edit Profile"
/>
<ProfileItem
icon={faHeart}
onPress={() => router.push('/user/interest/')}
text="Edit Interests"
/>
<Box
width="100%"
height={1}
backgroundColor="gray"
marginVertical="s"
/>
<ProfileItem
icon={faSignOutAlt}
text="Logout"
textColor="darkRed"
/>
</Box>
</SafeAreaView>
</GlobalLayout>
);
};

const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center'
flexDirection: 'column',
alignItems: 'flex-start',
justifyContent: 'flex-start',
marginVertical: Spacing.m,
gap: Spacing.l
},
title: {
fontSize: 20,
fontWeight: 'bold'
},
separator: {
marginVertical: 30,
height: 1,
width: '80%'
fontWeight: 'bold',
marginBottom: 20
}
});

Expand Down
8 changes: 8 additions & 0 deletions frontend/mobile/src/app/(app)/_layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,14 @@ const Layout = () => {
}
}}
/>
<Stack.Screen
name="user"
options={{
headerTitle: 'Profile',
headerTransparent: true,
headerShown: false
}}
/>
</Stack>
);
};
Expand Down
10 changes: 4 additions & 6 deletions frontend/mobile/src/app/(app)/event/[id].tsx
Original file line number Diff line number Diff line change
Expand Up @@ -181,10 +181,8 @@ const EventPage = () => {
eventName={event.name}
color={MockEvent.color}
club={club?.name}
startTime={
new Date(event.start_time)
}
endTime={new Date(event.end_time)}
startTime={event.start_time}
endTime={event.end_time}
location={
event.location ||
'ISEC, Room 204'
Expand Down Expand Up @@ -224,8 +222,8 @@ const EventPage = () => {
</Animated.ScrollView>
<ShareEventBottomSheet ref={shareEvent} link={MockEvent.link} />
<RegisterBottomSheet
startTime={new Date(event?.start_time as string)}
endTime={new Date(event?.end_time as string)}
startTime={event?.start_time as string}
endTime={event?.end_time as string}
eventDetail={event?.description as string}
eventName={event?.name as string}
location={event?.location as string}
Expand Down
4 changes: 2 additions & 2 deletions frontend/mobile/src/app/(app)/event/components/overview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ interface OverviewProps {
eventName: string;
club: string;
clubId: string;
startTime: Date;
endTime: Date;
startTime: string;
endTime: string;
location: string;
type: EventType;
color: SACColors;
Expand Down
6 changes: 4 additions & 2 deletions frontend/mobile/src/app/(app)/event/components/register.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ const SaveEventText = `By saving this event, you are automatically signed up for

interface RegisterSheetProps {
eventType: EventType;
startTime: Date;
endTime: Date;
startTime: string;
endTime: string;
location: string;
eventName: string;
eventDetail: string;
Expand Down Expand Up @@ -55,6 +55,8 @@ const RegisterBottomSheet = forwardRef<Ref, RegisterSheetProps>(
endTime: endTime
};

console.log(createGoogleCalendarLink(CALENDAR_INFO));

return (
<BottomSheet
ref={ref}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ export const UpcomingEvent: React.FC<UpcomingEventsProps> = ({ events }) => {
return (
<Pressable onPress={() => router.push(`/event/${item.id}`)}>
<EventCard
clubId={'1'}
variant="small"
event={item.name}
club={item.host}
Expand Down
19 changes: 19 additions & 0 deletions frontend/mobile/src/app/(app)/user/_layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import React from 'react';

import { Stack } from 'expo-router';

const Layout = () => {
return (
<Stack>
<Stack.Screen name="interest" options={{ headerShown: false }} />
<Stack.Screen
name="detail"
options={{
headerShown: false
}}
/>
</Stack>
);
};

export default Layout;
16 changes: 16 additions & 0 deletions frontend/mobile/src/app/(app)/user/components/save.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { TouchableOpacity } from 'react-native-gesture-handler';

import { Text } from '@/src/app/(design-system)';

interface SaveProps {
onPress: () => void;
isValid: boolean;
}

export const Save: React.FC<SaveProps> = ({ onPress, isValid }) => {
return (
<TouchableOpacity disabled={!isValid} onPress={onPress}>
<Text color={isValid ? 'black' : 'darkGray'}>Save</Text>
</TouchableOpacity>
);
};
Loading

0 comments on commit 91a5dfb

Please sign in to comment.