Integrate status filters into event list
This commit is contained in:
@@ -264,6 +264,7 @@ function EventsList({
|
||||
|
||||
return (
|
||||
<YStack space="$3">
|
||||
{filteredEvents.length === 0 ? (
|
||||
<Card
|
||||
borderRadius={22}
|
||||
borderWidth={2}
|
||||
@@ -275,19 +276,41 @@ function EventsList({
|
||||
shadowRadius={14}
|
||||
shadowOffset={{ width: 0, height: 8 }}
|
||||
>
|
||||
<YStack space="$2.5">
|
||||
<XStack
|
||||
alignItems="center"
|
||||
paddingHorizontal="$3"
|
||||
paddingVertical="$1.5"
|
||||
borderRadius={999}
|
||||
borderWidth={1}
|
||||
<YStack space="$2" alignItems="center">
|
||||
<Text fontSize="$sm" fontWeight="700" color={text}>
|
||||
{t('events.list.empty.filtered')}
|
||||
</Text>
|
||||
<Text fontSize="$xs" color={muted} textAlign="center">
|
||||
{t('events.list.empty.filteredHint')}
|
||||
</Text>
|
||||
<CTAButton
|
||||
label={t('events.list.filters.all')}
|
||||
tone="ghost"
|
||||
fullWidth={false}
|
||||
onPress={() => onStatusChange('all')}
|
||||
/>
|
||||
</YStack>
|
||||
</Card>
|
||||
) : (
|
||||
<Card
|
||||
borderRadius={22}
|
||||
borderWidth={2}
|
||||
borderColor={border}
|
||||
backgroundColor={surfaceMuted}
|
||||
backgroundColor={surface}
|
||||
padding="$2.5"
|
||||
shadowColor={shadow}
|
||||
shadowOpacity={0.14}
|
||||
shadowRadius={14}
|
||||
shadowOffset={{ width: 0, height: 8 }}
|
||||
>
|
||||
<YStack space="$2.5">
|
||||
<XStack alignItems="center" justifyContent="space-between">
|
||||
<Text fontSize="$xs" fontWeight="800" color={text}>
|
||||
{t('events.workspace.fields.status')}
|
||||
</Text>
|
||||
<Text fontSize="$xs" color={muted}>
|
||||
{t('events.list.subtitle')}
|
||||
</Text>
|
||||
</XStack>
|
||||
<ScrollView horizontal showsHorizontalScrollIndicator={false}>
|
||||
<ToggleGroup
|
||||
@@ -322,47 +345,7 @@ function EventsList({
|
||||
</ToggleGroup>
|
||||
</ScrollView>
|
||||
</YStack>
|
||||
</Card>
|
||||
|
||||
{filteredEvents.length === 0 ? (
|
||||
<Card
|
||||
borderRadius={22}
|
||||
borderWidth={2}
|
||||
borderColor={border}
|
||||
backgroundColor={surface}
|
||||
padding="$3"
|
||||
shadowColor={shadow}
|
||||
shadowOpacity={0.14}
|
||||
shadowRadius={14}
|
||||
shadowOffset={{ width: 0, height: 8 }}
|
||||
>
|
||||
<YStack space="$2" alignItems="center">
|
||||
<Text fontSize="$sm" fontWeight="700" color={text}>
|
||||
{t('events.list.empty.filtered')}
|
||||
</Text>
|
||||
<Text fontSize="$xs" color={muted} textAlign="center">
|
||||
{t('events.list.empty.filteredHint')}
|
||||
</Text>
|
||||
<CTAButton
|
||||
label={t('events.list.filters.all')}
|
||||
tone="ghost"
|
||||
fullWidth={false}
|
||||
onPress={() => onStatusChange('all')}
|
||||
/>
|
||||
</YStack>
|
||||
</Card>
|
||||
) : (
|
||||
<Card
|
||||
borderRadius={22}
|
||||
borderWidth={2}
|
||||
borderColor={border}
|
||||
backgroundColor={surface}
|
||||
padding="$2"
|
||||
shadowColor={shadow}
|
||||
shadowOpacity={0.14}
|
||||
shadowRadius={14}
|
||||
shadowOffset={{ width: 0, height: 8 }}
|
||||
>
|
||||
<YGroup
|
||||
{...({
|
||||
borderRadius: 18,
|
||||
@@ -371,6 +354,7 @@ function EventsList({
|
||||
overflow: 'hidden',
|
||||
backgroundColor: surface,
|
||||
} as any)}
|
||||
marginTop="$2.5"
|
||||
>
|
||||
{filteredEvents.map((event) => {
|
||||
const statusKey = resolveEventStatusKey(event);
|
||||
|
||||
Reference in New Issue
Block a user