getodk / getodk/web-forms

UI to indicate that an existing instance is being edited

Open
#314 0 comments 0 reactions 0 assignees View on GitHub
deferred
Dominant language
TypeScript
Stars
38
Forks
22
PR merge metrics
No merged PRs in 30d

Description

## User stories

**Embed/overlay**
Given I want to edit a submission
When I click edit (embedded, overlay, or separate window)
Then I should see a toolbar at the top of the form

**Feedback that you are editing a submission**
Given I want to edit a submission
When I click edit in the submission table in Central
Then I should see two indicators so that I know I'm in edit mode
- clear dismissible message at the top that I’m making a change to the submission
- edit button highlighted
- connected to the story about [switching between edit and viewing a submission](https://github.com/getodk/web-forms/issues/255)

**Indicator a submission is being edited by another person**
Given I want to edit a submission but someone else is editing it
When I look at the submission table (inline message) or click edit
Then they will see feedback that notifies me it's being edited and prevents me from opening it

**Language dropdown**
Given I want to change the language
When I look at the toolbar
Then I see the dropdown and can change the language

**Title in toolbar**
Given I’m editing a submission and it’s a long form
When I look at the top toolbar
Then I should see the **title of the form in the toolbar**
So that I know I’m editing the right form

## Designs
[Figma](https://www.figma.com/design/6v0NnvayfDlaQhYpjv37Bn/Web-Forms?node-id=549-10792&t=t46o1MYyLy1A8AZ6-1)

![Image](https://github.com/user-attachments/assets/8886bf35-6413-4da8-bdd6-6c1aa879bfa9)

## Notes

To discuss: should the editing experience be embedded, overlay or in a separate window (like in Enketo). Central has responsibility for showing that an edit is going on.

**Embedded/overlay pros**
- Editing submission stays within context
- Distinctively different than previewing or form filling (separate window)

**Embedded/overlay cons**
- Different than Enketo, so would require users to adapt (not a deal beaker)
- Web Forms has different UX/UI from Central, so it might be a bit confusing

**Other design considerations**
- Might need to rethinking toolbar, if we have Central nav too
- We will need to make sure the editing submission experience doesn't get confused with "Edit Form" tab as part of the drafts redesign in Central because the wording is similar. Overlay vs embedded might help make this more clear.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the linked Figma design, issue #255, and the submission-table edit entry point in Central. Clarify whether editing is embedded, overlaid, or in a separate window before tracing the toolbar and edit-state flow; done means the specified indicators, language dropdown, form title, and concurrent-edit prevention work consistently.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.