Merge pull request #377 from eurofurence/feat/coming-soon

feat: coming soon for delaers & schedule

Author: docimin

assets/static/dealers-empty.png

@@ -17,7 +17,10 @@ import { StyleSheet, View } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Icon, type IconNames } from '@/components/generic/atoms/Icon'
 import { Search } from '@/components/generic/atoms/Search'
+import { ComingSoon } from '@/components/generic/containers/ComingSoon'
+import { conName } from '@/configuration'
 import { DealersSearchContext } from '@/context/DealersSearchContext'
+import { useCache } from '@/context/data/Cache'
 import { useThemeBackground } from '@/hooks/themes/useThemeHooks'
 
 export const unstable_settings = {
@@ -53,6 +56,7 @@ export default function DealersLayout() {
   const { t } = useTranslation('Dealers')
   const insets = useSafeAreaInsets()
   const backgroundSurface = useThemeBackground('surface')
+  const { dealers } = useCache()
   const [filter, setFilter] = useState('')
 
   const options = useMemo(() => {
@@ -65,6 +69,15 @@ export default function DealersLayout() {
     }
   }, [])
 
+  if (dealers.length === 0)
+    return (
+      <ComingSoon
+        image={require('@/assets/static/dealers-empty.png')}
+        title={t('coming_soon_title')}
+        text={t('coming_soon_body', { conName })}
+      />
+    )
+
   return (
     <DealersSearchContext.Provider
       value={{ query: filter, setQuery: setFilter }}

assets/static/events-empty.png

@@ -19,6 +19,8 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { ShowInternalEventsToggle } from '@/components/events/ShowInternalEventsToggle'
 import { Icon, type IconNames } from '@/components/generic/atoms/Icon'
 import { Search } from '@/components/generic/atoms/Search'
+import { ComingSoon } from '@/components/generic/containers/ComingSoon'
+import { conName } from '@/configuration'
 import { useCache } from '@/context/data/Cache'
 import type { EventDayDetails } from '@/context/data/types.details'
 import { ScheduleSearchContext } from '@/context/ScheduleSearchContext'
@@ -68,7 +70,7 @@ export default function ScheduleLayout() {
   const insets = useSafeAreaInsets()
   const now = useNow('static')
   const backgroundSurface = useThemeBackground('surface')
-  const { eventDays } = useCache()
+  const { events, eventDays } = useCache()
   const initialRouteName = getInitialRoute(eventDays, now)
   const [filter, setFilter] = useState('')
 
@@ -86,6 +88,15 @@ export default function ScheduleLayout() {
     }
   }, [eventDays])
 
+  if (events.length === 0)
+    return (
+      <ComingSoon
+        image={require('@/assets/static/events-empty.png')}
+        title={t('coming_soon_title')}
+        text={t('coming_soon_body', { conName })}
+      />
+    )
+
   return (
     <ScheduleSearchContext.Provider
       value={{ query: filter, setQuery: setFilter }}

src/app/(areas)/dealers/_layout.tsx

@@ -0,0 +1,52 @@
+import { StyleSheet, View } from 'react-native'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+
+import { useThemeBackground } from '@/hooks/themes/useThemeHooks'
+
+import { Image, type ImageProps } from '../atoms/Image'
+import { Label } from '../atoms/Label'
+
+export type ComingSoonProps = {
+  image: ImageProps['source']
+  title: string
+  text: string
+}
+
+export const ComingSoon = ({ image, title, text }: ComingSoonProps) => {
+  const insets = useSafeAreaInsets()
+  const backgroundSurface = useThemeBackground('surface')
+
+  return (
+    <View
+      style={[styles.container, backgroundSurface, { paddingTop: insets.top }]}
+      accessibilityRole='text'
+      accessibilityLabel={`${title}. ${text}`}
+    >
+      <Image style={styles.image} source={image} contentFit='contain' />
+      <Label type='h1' variant='middle'>
+        {title}
+      </Label>
+      <Label type='regular' variant='middle' style={styles.text}>
+        {text}
+      </Label>
+    </View>
+  )
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: 30,
+    gap: 20,
+  },
+  image: {
+    height: 240,
+    aspectRatio: 1,
+    maxWidth: '100%',
+  },
+  text: {
+    maxWidth: 360,
+  },
+})

src/app/(areas)/schedule/_layout.tsx

@@ -341,6 +341,8 @@
     "after_dark": "After Dark",
     "all": "Alle",
     "alphabetical": "A-Z",
+    "coming_soon_body": "Die Dealers' Den für {{conName}} wird noch vorbereitet. Schau später wieder vorbei, um zu sehen, wer dabei sein wird!",
+    "coming_soon_title": "Bald verfügbar!",
     "dealers_at_convention": "Dealer auf der {{convention}}",
     "dealers_in_ad": "Im After Dark Bereich",
     "dealers_in_regular": "Im regulären Bereich",
@@ -414,6 +416,8 @@
   },
   "Events": {
     "afternoon": "Nachmittags",
+    "coming_soon_body": "Das Programm für {{conName}} ist noch in Arbeit. Schau später wieder vorbei, um deinen Besuch zu planen!",
+    "coming_soon_title": "Bald verfügbar!",
     "current_subtitle": "Diese Events finden gerade jetzt statt",
     "current_title": "Aktuelle Events",
     "evening": "Am Abend",

src/components/generic/containers/ComingSoon.tsx

@@ -345,6 +345,8 @@
     "after_dark": "After dark",
     "all": "All",
     "alphabetical": "A-Z",
+    "coming_soon_body": "The Dealers' Den for {{conName}} is still being prepared. Check back later to see who will be there!",
+    "coming_soon_title": "Coming soon!",
     "dealers_at_convention": "Dealers at {{convention}}",
     "dealers_in_ad": "After dark dealers den",
     "dealers_in_regular": "Regular dealers den",
@@ -419,6 +421,8 @@
   },
   "Events": {
     "afternoon": "In the afternoon",
+    "coming_soon_body": "The schedule for {{conName}} is still being worked on. Check back later to plan your visit!",
+    "coming_soon_title": "Coming soon!",
     "current_subtitle": "These events are currently happening",
     "current_title": "Current Events",
     "evening": "In the evening",

src/i18n/translations.de.json

@@ -204,6 +204,8 @@
       "dealers_sectioned_list_hint": "Scorri per navigare tra i venditori raggruppati per categoria, trascina verso il basso per aggiornare"
     },
     "all": "Tutti",
+    "coming_soon_body": "La Dealers' Den di {{conName}} è ancora in preparazione. Torna più tardi per scoprire chi ci sarà!",
+    "coming_soon_title": "In arrivo!",
     "dealers_at_convention": "Venditori a {{convention}}",
     "not_attending_on": "Non disponibile il {{offDays}}",
     "search": {
@@ -263,6 +265,8 @@
   },
   "Events": {
     "afternoon": "Al pomeriggio",
+    "coming_soon_body": "Il programma di {{conName}} è ancora in preparazione. Torna più tardi per pianificare la tua visita!",
+    "coming_soon_title": "In arrivo!",
     "current_subtitle": "Questi eventi si stanno svolgendo ora",
     "current_title": "Eventi in corso",
     "evening": "Alla sera",

src/i18n/translations.en.json

@@ -244,6 +244,8 @@
     "after_dark": "After dark",
     "all": "All",
     "alphabetical": "A-Z",
+    "coming_soon_body": "De Dealers' Den voor {{conName}} wordt nog voorbereid. Kom later terug om te zien wie erbij zal zijn!",
+    "coming_soon_title": "Binnenkort beschikbaar!",
     "dealers_at_convention": "Dealers op {{convention}}",
     "dealers_in_ad": "After dark dealers den",
     "dealers_in_regular": "Normale dealers",
@@ -314,6 +316,8 @@
   },
   "Events": {
     "afternoon": "In de middag",
+    "coming_soon_body": "Het programma voor {{conName}} is nog in de maak. Kom later terug om je bezoek te plannen!",
+    "coming_soon_title": "Binnenkort beschikbaar!",
     "current_subtitle": "Deze evenementen zijn momenteel aan het gebeuren",
     "current_title": "Huidige evenementen",
     "evening": "In de avond",

src/i18n/translations.it.json

@@ -212,6 +212,8 @@
       "dealers_sectioned_list_hint": "Przeciągnij, aby nawigować przez wystawców pogrupowanych według kategorii, przeciągnij w dół, aby odświeżyć"
     },
     "all": "Wszyscy",
+    "coming_soon_body": "Dealers' Den na {{conName}} jest jeszcze w przygotowaniu. Zajrzyj później, aby zobaczyć, kto się pojawi!",
+    "coming_soon_title": "Już wkrótce!",
     "dealers_at_convention": "Wystawcy na {{convention}}",
     "not_attending_on": "Nie biorą udziału w {{offDays}}",
     "search": {
@@ -274,6 +276,8 @@
   },
   "Events": {
     "afternoon": "Po południu",
+    "coming_soon_body": "Program {{conName}} jest jeszcze w przygotowaniu. Zajrzyj później, aby zaplanować swoją wizytę!",
+    "coming_soon_title": "Już wkrótce!",
     "current_subtitle": "Te punkty programu odbywają się w tej chwili",
     "current_title": "Bieżące punkty programu",
     "evening": "Wieczorem",