Sco 1771 add delete for non foldable list item#103
Conversation
Deploying kit with
|
| Latest commit: |
ebc3dc1
|
| Status: | 🚫 Build failed. |
JannieT
left a comment
JannieT
left a comment
There was a problem hiding this comment.
There is still problems with a simple list that is non-foldable. Looks like one can only delete the last item and the UX is confusing. We might need design thinking to handle simple lists differently from lists with complex items. Start by setting up two extra variations so we can demonstrate the differences:
- Non-foldable complex item
- Non-foldable string items
… define corresponding mock data
… update store for tracking removed states
…s and add references to mock data
…o improve conditional display and styling
| return Array.isArray(sourceList) && index < sourceList.length; | ||
| }; | ||
|
|
||
| const removedState = computed(() => store.getListRemoved(props.fieldPath)); |
There was a problem hiding this comment.
The store is for shared state. The deleted-ness of each item is state that is only used inside this component, so how about just using a local reference to track it:
| const removedState = computed(() => store.getListRemoved(props.fieldPath)); | |
| const allFalse = new Array(props.listItems.length).fill(false); | |
| const removedList = ref<boolean[]>(allFalse); |
| return removedState.value[index] ?? false; | ||
| }; | ||
|
|
||
| const title = (index: number): string => { |
There was a problem hiding this comment.
Looks like this function always resolves to 'New Section'
|
|
||
| const removedState = computed(() => store.getListRemoved(props.fieldPath)); | ||
|
|
||
| const ensureRemoved = () => { |
There was a problem hiding this comment.
Make sure this handles both length adjustments: padding and trimming
| const ensureRemoved = () => { | |
| const resizeRemovedList = () => { |
There was a problem hiding this comment.
I was not expecting any changes to the widget store for this feature.
src/frontend/test/mocks.ts
Outdated
| createdAt: '2025-10-24T06:10:38.482+00:00', | ||
| }, | ||
| bundle: { | ||
| questions: [], |
There was a problem hiding this comment.
Let's make sure we can handle something like this:
| questions: [], | |
| questions: [ | |
| {question: ''}, | |
| {question: 'Translated: If it turned out ... '} | |
| ], |
2 participants
No description provided.