Skip to content

Commit

Permalink
fix(web): enhance styling and add missing icons
Browse files Browse the repository at this point in the history
  • Loading branch information
@Robert27
Robert27 committed Dec 16, 2024
1 parent c47f73e commit a806afb
Show file tree
Hide file tree
Showing 28 changed files with 416 additions and 265 deletions.
8 changes: 7 additions & 1 deletion .eslintrc.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,5 +44,11 @@
{ "ignoreClassNames": false, "ignoreStyleProperties": false }
]
},
"ignorePatterns": ["metro.config.js", "node_modules/", "ios/", "android/"]
"ignorePatterns": [
"metro.config.js",
"node_modules/",
"ios/",
"android/",
"dist/"
]
}
Binary file modified bun.lockb
View file
Binary file not shown.
8 changes: 4 additions & 4 deletions ios/Podfile.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -313,11 +313,11 @@ PODS:
- hermes-engine (0.76.5):
- hermes-engine/Pre-built (= 0.76.5)
- hermes-engine/Pre-built (0.76.5)
- maplibre-react-native (10.0.0-beta.8):
- maplibre-react-native/DynamicLibrary (= 10.0.0-beta.8)
- maplibre-react-native (10.0.0-beta.9):
- maplibre-react-native/DynamicLibrary (= 10.0.0-beta.9)
- React
- React-Core
- maplibre-react-native/DynamicLibrary (10.0.0-beta.8):
- maplibre-react-native/DynamicLibrary (10.0.0-beta.9):
- React
- React-Core
- RCT-Folly (2024.01.01.00):
Expand Down Expand Up @@ -2738,7 +2738,7 @@ SPEC CHECKSUMS:
fmt: 10c6e61f4be25dc963c36bd73fc7b1705fe975be
glog: 08b301085f15bcbb6ff8632a8ebaf239aae04e6a
hermes-engine: 06a9c6900587420b90accc394199527c64259db4
maplibre-react-native: 2c0fec529115f9c3d0a0e7bf5e4bdd8a4a85ebe1
maplibre-react-native: afcf427bf5d726404bcd2a6985196e54bf940540
RCT-Folly: bf5c0376ffe4dd2cf438dcf86db385df9fdce648
RCTDeprecation: fb7d408617e25d7f537940000d766d60149c5fea
RCTRequired: 9aaf0ffcc1f41f0c671af863970ef25c422a9920
Expand Down
1 change: 0 additions & 1 deletion src/app/(screens)/about.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,6 @@ const stylesheet = createStyleSheet((theme) => ({
backgroundColor: theme.colors.card,
borderRadius: 9,
boxShadow: `4 4 10 0 ${theme.colors.labelTertiaryColor}`,
shadowColor: theme.colors.text,
},
logoImage: {
borderRadius: 9,
Expand Down
6 changes: 4 additions & 2 deletions src/app/(screens)/appIcon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,9 +56,7 @@ export default function AppIconPicker(): JSX.Element {
})

const support = supportsAlternateIcons
console.log(`The device supports alternate icons: ${support}`)
const iconName = getAppIconName()
console.log(`The active app icon is: ${iconName}`)

if (!support) {
return (
Expand Down Expand Up @@ -135,6 +133,10 @@ export default function AppIconPicker(): JSX.Element {
name: 'check',
size: 24,
}}
web={{
name: 'Check',
size: 20,
}}
/>
)}
</Pressable>
Expand Down
230 changes: 111 additions & 119 deletions src/app/(screens)/calendar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -129,127 +129,121 @@ export default function CalendarPage(): JSX.Element {
overdrag
>
{/* Page 1: Events */}
<View>
<ScrollView
contentContainerStyle={styles.itemsContainer}
style={styles.viewHorizontal}
onScroll={
Animated.event(
[
{
nativeEvent: {
contentOffset: { y: scrollY },
},
<ScrollView
contentContainerStyle={styles.itemsContainer}
onScroll={
Animated.event(
[
{
nativeEvent: {
contentOffset: { y: scrollY },
},
],
{ useNativeDriver: false }
) as any
}
scrollEventThrottle={16}
>
<View style={styles.contentBorder}>
{calendar?.length > 0 &&
calendar.map((item, index) => (
<React.Fragment key={`event_${index}`}>
<CalendarRow event={item} />
{index !== calendar.length - 1 && (
<Divider iosPaddingLeft={16} />
)}
</React.Fragment>
))}
</View>
<CalendarFooter />
</ScrollView>
</View>
},
],
{ useNativeDriver: false }
) as any
}
scrollEventThrottle={16}
>
<View style={styles.contentBorder}>
{calendar?.length > 0 &&
calendar.map((item, index) => (
<React.Fragment key={`event_${index}`}>
<CalendarRow event={item} />
{index !== calendar.length - 1 && (
<Divider iosPaddingLeft={16} />
)}
</React.Fragment>
))}
</View>
<CalendarFooter />
</ScrollView>

{/* Page 2: Exams */}
<View>
<ScrollView
contentContainerStyle={styles.itemsContainer}
style={styles.viewHorizontal}
onScroll={
Animated.event(
[
{
nativeEvent: {
contentOffset: { y: scrollY },
},

<ScrollView
contentContainerStyle={styles.itemsContainer}
onScroll={
Animated.event(
[
{
nativeEvent: {
contentOffset: { y: scrollY },
},
],
{ useNativeDriver: false }
) as any
}
refreshControl={
<RefreshControl
refreshing={isRefetchingByUser}
onRefresh={() => {
void refetchByUser()
}}
/>
}
scrollEventThrottle={16}
scrollEnabled={!isError}
>
{isLoading ? (
<LoadingIndicator />
) : isError ? (
<ErrorView
title={error?.message ?? t('error.title')}
onButtonPress={() => {
void refetchByUser()
}}
inModal
/>
) : isPaused && !isSuccess ? (
<ErrorView title={networkError} inModal />
) : userKind === USER_GUEST ? (
<ErrorView title={guestError} inModal />
) : (
<View>
<View style={styles.contentBorder}>
{exams != null && exams.length > 0 ? (
<>
{exams.map((item, index) => (
<React.Fragment
key={`exam_${index}`}
>
<ExamRow event={item} />
{index !==
exams.length - 1 && (
<Divider
iosPaddingLeft={16}
/>
)}
</React.Fragment>
))}
</>
) : (
<ErrorView
title={t(
'pages.calendar.exams.noExams.title'
)}
message={t(
'pages.calendar.exams.noExams.subtitle'
)}
icon={{
ios: 'calendar.badge.clock',
android: 'calendar_clock',
web: 'CalendarX2',
}}
buttonText="Primuss"
onButtonPress={() => {
void Linking.openURL(primussUrl)
}}
inModal
isCritical={false}
/>
)}
</View>
<CalendarFooter />
},
],
{ useNativeDriver: false }
) as any
}
refreshControl={
<RefreshControl
refreshing={isRefetchingByUser}
onRefresh={() => {
void refetchByUser()
}}
/>
}
scrollEventThrottle={16}
scrollEnabled={!isError}
>
{isLoading ? (
<LoadingIndicator />
) : isError ? (
<ErrorView
title={error?.message ?? t('error.title')}
onButtonPress={() => {
void refetchByUser()
}}
inModal
/>
) : isPaused && !isSuccess ? (
<ErrorView title={networkError} inModal />
) : userKind === USER_GUEST ? (
<ErrorView title={guestError} inModal />
) : (
<View>
<View style={styles.contentBorder}>
{exams != null && exams.length > 0 ? (
<>
{exams.map((item, index) => (
<React.Fragment
key={`exam_${index}`}
>
<ExamRow event={item} />
{index !== exams.length - 1 && (
<Divider
iosPaddingLeft={16}
/>
)}
</React.Fragment>
))}
</>
) : (
<ErrorView
title={t(
'pages.calendar.exams.noExams.title'
)}
message={t(
'pages.calendar.exams.noExams.subtitle'
)}
icon={{
ios: 'calendar.badge.clock',
android: 'calendar_clock',
web: 'CalendarX2',
}}
buttonText="Primuss"
onButtonPress={() => {
void Linking.openURL(primussUrl)
}}
inModal
isCritical={false}
/>
)}
</View>
)}
</ScrollView>
</View>
<CalendarFooter />
</View>
)}
</ScrollView>
</PagerView>
</View>
)
Expand Down Expand Up @@ -279,6 +273,7 @@ const stylesheet = createStyleSheet((theme) => ({
alignSelf: 'center',
justifyContent: 'center',
marginHorizontal: theme.margins.page,
paddingHorizontal: theme.margins.page,
width: '100%',
},
pagerContainer: {
Expand All @@ -288,9 +283,6 @@ const stylesheet = createStyleSheet((theme) => ({
borderColor: theme.colors.border,
paddingBottom: 12,
},
viewHorizontal: {
paddingHorizontal: theme.margins.page,
},
viewTop: {
paddingTop: theme.margins.page,
},
Expand Down
41 changes: 41 additions & 0 deletions src/app/(screens)/foodx.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import FoodScreen from '@/components/Food/FoodScreen'
import { FoodHeaderRight } from '@/components/Food/HeaderRight'
import WorkaroundStack from '@/components/Universal/WorkaroundStack'
import { useNavigation } from 'expo-router'
import Head from 'expo-router/head'
import React, { useEffect, useLayoutEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'

export default function FoodRootScreen(): JSX.Element {
const [isPageOpen, setIsPageOpen] = useState(false)
const { t } = useTranslation('navigation')
const navigation = useNavigation()
useEffect(() => {
setIsPageOpen(true)
}, [])

useLayoutEffect(() => {
navigation.setOptions({
headerRight: () => <FoodHeaderRight />,
})
}, [navigation])

return (
<>
<Head>
{/* eslint-disable-next-line react-native/no-raw-text */}
<title>{t('navigation.food')}</title>
<meta name="Food" content="Meal plan for the canteens" />
<meta property="expo:handoff" content="true" />
<meta property="expo:spotlight" content="true" />
</Head>
<WorkaroundStack
name={'food'}
titleKey={'navigation.food'}
component={isPageOpen ? FoodScreen : () => <></>}
headerRightElement={FoodHeaderRight}
androidFallback
/>
</>
)
}
Loading

0 comments on commit a806afb

Please sign in to comment.