soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Tighten tasks tab controls
Some checks failed
linter / quality (push) Has been cancelled
Details
tests / ci (push) Has been cancelled
Details
tests / ui (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Codex Agent
2026-01-22 20:59:25 +01:00
parent 32644eb41e
commit c1dfbaa51e
1 changed files with 59 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
resources/js/admin/mobile/EventTasksPage.tsx
View File

@@ -87,9 +87,6 @@ export default function MobileEventTasksPage() {
glassBorder, glassBorder,
glassShadow, glassShadow,
} = useAdminTheme(); } = useAdminTheme();
const stickySurface = glassSurface ?? surface;
const stickyBorder = glassBorder ?? border;
const stickyShadow = glassShadow ?? shadow;
const isMember = user?.role === 'member'; const isMember = user?.role === 'member';
const [assignedTasks, setAssignedTasks] = React.useState<TenantTask[]>([]); const [assignedTasks, setAssignedTasks] = React.useState<TenantTask[]>([]);
const [library, setLibrary] = React.useState<TenantTask[]>([]); const [library, setLibrary] = React.useState<TenantTask[]>([]);
@@ -818,11 +815,17 @@ export default function MobileEventTasksPage() {
<Text fontSize="$sm" fontWeight="700" color={text}> <Text fontSize="$sm" fontWeight="700" color={text}>
{t('events.tasks.tabs.library', 'Task Library')} {t('events.tasks.tabs.library', 'Task Library')}
</Text> </Text>
<Pressable onPress={() => setActiveTab('collections')}> <Button
<Text fontSize={12} fontWeight="600" color={primary}> size="$2"
backgroundColor={withAlpha(primary, 0.12)}
borderWidth={1}
borderColor={withAlpha(primary, 0.35)}
onPress={() => setActiveTab('collections')}
>
<Text fontSize="$xs" fontWeight="700" color={primary}>
{t('events.tasks.import', 'Import photo task pack')} {t('events.tasks.import', 'Import photo task pack')}
</Text> </Text>
</Pressable> </Button>
</XStack> </XStack>
{!canAddTasks ? ( {!canAddTasks ? (
<Text fontSize={12} fontWeight="600" color={dangerText}> <Text fontSize={12} fontWeight="600" color={dangerText}>
@@ -966,15 +969,21 @@ export default function MobileEventTasksPage() {
<Text fontSize="$sm" fontWeight="700" color={text}> <Text fontSize="$sm" fontWeight="700" color={text}>
{t('events.tasks.tabs.emotions', 'Emotions')} {t('events.tasks.tabs.emotions', 'Emotions')}
</Text> </Text>
<CTAButton <Button
label={t('events.tasks.addEmotion', 'Add emotion')} size="$2"
fullWidth={false} backgroundColor={withAlpha(primary, 0.12)}
borderWidth={1}
borderColor={withAlpha(primary, 0.35)}
onPress={() => { onPress={() => {
setEditingEmotion(null); setEditingEmotion(null);
setEmotionForm({ name: '', color: border }); setEmotionForm({ name: '', color: border });
setShowEmotionSheet(true); setShowEmotionSheet(true);
}} }}
/> >
<Text fontSize="$xs" fontWeight="700" color={primary}>
{t('events.tasks.addEmotion', 'Add emotion')}
</Text>
</Button>
</XStack> </XStack>
{emotions.length === 0 ? ( {emotions.length === 0 ? (
<Text fontSize={12} fontWeight="500" color={muted}> <Text fontSize={12} fontWeight="500" color={muted}>
@@ -1182,53 +1191,47 @@ export default function MobileEventTasksPage() {
<Tabs.Content value="assigned" paddingTop="$2"> <Tabs.Content value="assigned" paddingTop="$2">
<Card borderRadius={18} borderWidth={1} borderColor={border} backgroundColor={surface} padding="$3"> <Card borderRadius={18} borderWidth={1} borderColor={border} backgroundColor={surface} padding="$3">
<YStack space="$2"> <YStack space="$2">
<YStack className="admin-sticky-toolbar"> <Card
<Card borderRadius={16}
borderRadius={16} borderWidth={1}
borderWidth={1} borderColor={border}
borderColor={stickyBorder} backgroundColor={surfaceMuted}
backgroundColor={stickySurface} padding="$2.5"
padding="$2.5" >
shadowColor={stickyShadow} <XStack alignItems="center" space="$2">
shadowOpacity={0.12} <XStack flex={1}>
shadowRadius={12} <MobileInput
shadowOffset={{ width: 0, height: 8 }} type="search"
> value={searchTerm}
<XStack alignItems="center" space="$2"> onChange={(e) => setSearchTerm(e.target.value)}
<XStack flex={1}> placeholder={t('events.tasks.search', 'Search photo tasks')}
<MobileInput compact
type="search" />
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
placeholder={t('events.tasks.search', 'Search photo tasks')}
compact
/>
</XStack>
<Pressable onPress={() => setShowEmotionFilterSheet(true)}>
<XStack
alignItems="center"
space="$1.5"
paddingVertical="$2"
paddingHorizontal="$3"
borderRadius={14}
borderWidth={1}
borderColor={border}
backgroundColor={surface}
>
<Text fontSize={11} fontWeight="700" color={text}>
{t('events.tasks.emotionFilterShort', 'Emotion')}
</Text>
<Text fontSize={11} color={muted}>
{emotionFilter
? emotions.find((e) => String(e.id) === emotionFilter)?.name ?? t('events.tasks.customEmotion', 'Custom emotion')
: t('events.tasks.allEmotions', 'All')}
</Text>
<ChevronDown size={14} color={muted} />
</XStack>
</Pressable>
</XStack> </XStack>
</Card> <Pressable onPress={() => setShowEmotionFilterSheet(true)}>
</YStack> <XStack
alignItems="center"
space="$1.5"
paddingVertical="$2"
paddingHorizontal="$3"
borderRadius={14}
borderWidth={1}
borderColor={border}
backgroundColor={surface}
>
<Text fontSize={11} fontWeight="700" color={text}>
{t('events.tasks.emotionFilterShort', 'Emotion')}
</Text>
<Text fontSize={11} color={muted}>
{emotionFilter
? emotions.find((e) => String(e.id) === emotionFilter)?.name ?? t('events.tasks.customEmotion', 'Custom emotion')
: t('events.tasks.allEmotions', 'All')}
</Text>
<ChevronDown size={14} color={muted} />
</XStack>
</Pressable>
</XStack>
</Card>
{taskPanel} {taskPanel}
</YStack> </YStack>
</Card> </Card>