Skip to content

Commit 3da443c

Browse files
committedMar 26, 2025·
UX fiks utforsk boksen
1 parent a572856 commit 3da443c

File tree

1 file changed

+60
-60
lines changed

1 file changed

+60
-60
lines changed
 

‎src/components/chartbuilder/EventParameterSelector.tsx

+60-60
Original file line numberDiff line numberDiff line change
@@ -366,64 +366,10 @@ const getGroupedParameters = () => {
366366
</ExpansionCard.Header>
367367
<ExpansionCard.Content>
368368
<VStack gap="6">
369-
370-
{/* Parameters Section - Only shown when events are selected and not loading */}
371-
{!isLoadingParameters && (
369+
{/* Parameters Section - Only shown when events are selected and not loading */}
370+
{!isLoadingParameters && (
372371
<Box borderRadius="medium">
373-
<Heading level="3" size="xsmall" spacing>
374-
Standard hendelser og detaljer
375-
</Heading>
376-
<p className="text-md text-gray-700 mb-4">
377-
Sidevisninger spores automatisk med mindre dette er skrudd av.
378-
</p>
379-
380-
<ExpansionCard aria-label="Detaljer som følger med hendelser" size="small">
381-
<ExpansionCard.Header>
382-
<ExpansionCard.Title as="h3" size="small">
383-
<span className="items-center gap-2">
384-
<BodyShort weight="semibold">Detaljer som følger med hendelser</BodyShort>
385-
<span className="text-sm text-gray-600">
386-
{Object.values(FILTER_COLUMNS).reduce((sum, group) => {
387-
const filteredColumns = group.columns.filter(col => !EXCLUDED_PARAMS.includes(col.value));
388-
return sum + filteredColumns.length;
389-
}, 0)} detaljer
390-
</span>
391-
</span>
392-
</ExpansionCard.Title>
393-
</ExpansionCard.Header>
394-
<ExpansionCard.Content>
395-
<VStack gap="3">
396-
<div className="flex flex-col gap-3">
397-
{/* Map through FILTER_COLUMNS categories */}
398-
{Object.entries(FILTER_COLUMNS).map(([key, group]) => (
399-
<div key={key}>
400-
<div className="mb-2">
401-
<BodyShort weight="semibold">{group.label}</BodyShort>
402-
</div>
403-
{group.columns
404-
.filter(column => !EXCLUDED_PARAMS.includes(column.value))
405-
.map(column => (
406-
<div
407-
key={column.value}
408-
className="flex items-center justify-between p-3 bg-white rounded border mb-2"
409-
>
410-
<div className="flex flex-col">
411-
<span className="font-medium">{column.label}</span>
412-
<span className="text-xs text-gray-600">{getParamDescription(column.value)}</span>
413-
</div>
414-
<HStack gap="2">
415-
<Tag variant="neutral" size="xsmall">{getParamType(column.value)}</Tag>
416-
</HStack>
417-
</div>
418-
))}
419-
</div>
420-
))}
421-
</div>
422-
</VStack>
423-
</ExpansionCard.Content>
424-
</ExpansionCard>
425-
426-
<Heading level="3" size="xsmall" spacing className="mt-8">
372+
<Heading level="3" size="xsmall" spacing className="mt-3">
427373
Egendefinerte hendelser og detaljer
428374
</Heading>
429375

@@ -435,8 +381,8 @@ const getGroupedParameters = () => {
435381

436382
{/* Continue with existing Alert for no events */}
437383
{!isLoadingParameters && availableEvents.length === 0 && !parameters.some(p => p.key.startsWith(MANUAL_EVENT_NAME)) && (
438-
<Alert variant="info" inline className="mt-3">
439-
Ingen egendefinerte hendelser eller detaljer funnet. Mangler noen? Eventer og detaljer hentes inn for de siste 3 dagene, du kan justere tidsperioden under "innstillinger for hendelsesinnlasting".
384+
<Alert variant="info" className="mt-3">
385+
Ingen egendefinerte hendelser eller detaljer funnet. Eventer og detaljer hentes inn for de siste 3 dagene, du kan justere tidsperioden under "innstillinger for hendelsesinnlasting".
440386
</Alert>
441387
)}
442388

@@ -507,13 +453,67 @@ const getGroupedParameters = () => {
507453
<strong>Mangler noen?</strong> Eventer og detaljer hentes inn for de siste 3 dagene, du kan justere tidsperioden under "innstillinger for hendelsesinnlasting".
508454
</BodyShort>
509455
)}
456+
457+
<Heading level="3" size="xsmall" spacing className="mt-6">
458+
Standard hendelser og detaljer
459+
</Heading>
460+
<p className="text-md text-gray-700 mb-4">
461+
Sidevisninger spores automatisk med mindre dette er skrudd av.
462+
</p>
463+
464+
<ExpansionCard aria-label="Detaljer som følger med hendelser" size="small">
465+
<ExpansionCard.Header>
466+
<ExpansionCard.Title as="h3" size="small">
467+
<span className="items-center gap-2">
468+
<BodyShort weight="semibold">Detaljer som følger med hendelser</BodyShort>
469+
<span className="text-sm text-gray-600">
470+
{Object.values(FILTER_COLUMNS).reduce((sum, group) => {
471+
const filteredColumns = group.columns.filter(col => !EXCLUDED_PARAMS.includes(col.value));
472+
return sum + filteredColumns.length;
473+
}, 0)} detaljer
474+
</span>
475+
</span>
476+
</ExpansionCard.Title>
477+
</ExpansionCard.Header>
478+
<ExpansionCard.Content>
479+
<VStack gap="3">
480+
<div className="flex flex-col gap-3">
481+
{/* Map through FILTER_COLUMNS categories */}
482+
{Object.entries(FILTER_COLUMNS).map(([key, group]) => (
483+
<div key={key}>
484+
<div className="mb-2">
485+
<BodyShort weight="semibold">{group.label}</BodyShort>
486+
</div>
487+
{group.columns
488+
.filter(column => !EXCLUDED_PARAMS.includes(column.value))
489+
.map(column => (
490+
<div
491+
key={column.value}
492+
className="flex items-center justify-between p-3 bg-white rounded border mb-2"
493+
>
494+
<div className="flex flex-col">
495+
<span className="font-medium">{column.label}</span>
496+
<span className="text-xs text-gray-600">{getParamDescription(column.value)}</span>
497+
</div>
498+
<HStack gap="2">
499+
<Tag variant="neutral" size="xsmall">{getParamType(column.value)}</Tag>
500+
</HStack>
501+
</div>
502+
))}
503+
</div>
504+
))}
505+
</div>
506+
</VStack>
507+
</ExpansionCard.Content>
508+
</ExpansionCard>
509+
510510

511511
</Box>
512512
)}
513513

514514
{/* Date Range Settings - Moved from WebsitePicker */}
515515
<div>
516-
<ReadMore className="-mt-2" header="Innstillinger for hendelsesinnlasting">
516+
<ReadMore className="mt-0" header="Innstillinger for hendelsesinnlasting">
517517
<div className="space-y-4 mt-4">
518518
<div className="text-sm">
519519
Endre tidsperioden for å hente hendelser og detaljer fra en tidligere dato.

0 commit comments

Comments
 (0)
Please sign in to comment.