Altinn / Altinn/app-frontend-react

Repeating groups v4: Angi komponenter i en gruppe i en repeterende gruppe som header

Open
#1,873 5 comments 0 reactions 0 assignees View on GitHub
area/table kind/feature-request org/ssb
Dominant language
TypeScript
Stars
21
Forks
33
Avg merge
6d 23h
Merged PRs (30d)
3

Description

### Description of the bug

Hvis en benytter seg av gruppe komponent inne i en repeterende gruppe så er det ønskelig å kunne vise til feltene som ligger inne i gruppa som header elementer i den repeterende gruppen når raden er lukket.
Man ønsker seg et utseende som ser slik ut:
![image](https://github.com/Altinn/app-frontend-react/assets/91887041/111ea893-9f04-4d9e-b36b-1aef27da097e)
Hvis man legge inn feltene inn i en gruppe under en repeterende gruppe så ser det slik ut i en åpen gruppe i dag i v4:
![image](https://github.com/Altinn/app-frontend-react/assets/91887041/35589dc7-5667-4ee5-9cce-d4e57fe77271)
og når gruppen er lukket:
![image](https://github.com/Altinn/app-frontend-react/assets/91887041/dd62de7b-b9bc-461b-a58c-df788a8b295c)

Hvordan det er satt opp i layoutfila, for de to gruppene:

``` {
"id": "Group-9eKswQ",
"type": "RepeatingGroup",
"maxCount": 100,
"textResourceBindings":{
"title": "S07_MengdePetroleumGass.Panel-dfFMFJ.body"
},
"dataModelBindings": {
"group": "SkjemaData.GassOgPetroleumKost"
},
"tableHeaders": [
"Dropdown-gsfbAv",
"Input-hN71RX",
"Input-URiio3"
],
"grid": {
"md": 12
},
"edit": {
"deleteButton": false,
"alwaysShowAddButton": false,
"addButton": false,
"openByDefault": "first",
"saveAndNextButton": true
},
"stickyHeader": true,
"hiddenRow": ["not",
["or",
["commaContains",["dataModel","SkjemaData.petroleumProdukterValgt"],["dataModel","SkjemaData.GassOgPetroleumKost.produktTypeBruktId"]],
["commaContains",["dataModel","SkjemaData.gassProdukterValgt"],["dataModel","SkjemaData.GassOgPetroleumKost.produktTypeBruktId"]]
]
],
"children": [
"Dropdown-gsfbAv",
"Side07-gruppedetaljer"
]
},
{
"id": "Side07-gruppedetaljer",
"type": "Group",
"textResourceBindings":{
"title":"S07.tittel.repgrp.petroleumgass",
"description": ["dataModel","SkjemaData.GassOgPetroleumKost.produktTypeBesk"]
},
"children": [
"Input-eZuJCe",
"Input-8Dlpjq",
"Input-hN71RX",
"Input-URiio3"
]
} `

### Steps To Reproduce

se slack: https://altinn.slack.com/archives/C02EJ9HKQA3/p1709031316363209

### Additional Information

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the layout shown in the issue: a RepeatingGroup containing the fields directly and through the nested Group `Side07-gruppedetaljer`, using the linked Slack discussion for missing reproduction context. Trace how `tableHeaders` and collapsed rows are rendered; done means fields inside the nested group appear as header elements when the repeating-group row is closed.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.