Skip to content

Inserting new item in field list clears the values of the previous list item #707

Open
@joejemmely

Description

@joejemmely

Describe the bug and the expected behavior

Inserting a new item in field list clears the values of the previous list item.

To illustrate the bug, here's an example of a simple UI for adding variables to multiple environments.

Using a deeply nested schema like:

const schema = z.object({
  environments: z.array(
    z.array(
      z.object({
        name: z.string(),
        description: z.string(),
        value: z.string(),
      })
    )
  ),
});

Inserting a new environment clears the values of the previous environment when defining defaultValue as follow:

<button
  {...form.insert.getButtonProps({
    name: fields.environments.name,
    defaultValue: [{ name: "", description: "", value: "" }],
    )}
>
  Add environment
</button>

The same thing happens when inserting a new variable within an environment.

The expected behavior is that values previously entered are persisted when a new list item is inserted.

Conform version

v1.1.5

Steps to Reproduce the Bug or Issue

Sandbox: https://stackblitz.com/edit/remix-run-remix-7ybrqe?file=app%2Froutes%2F_index.tsx

  1. Go to https://stackblitz.com/edit/remix-run-remix-7ybrqe?file=app%2Froutes%2F_index.tsx
  2. Add a an environment by clicking on Add environment
  3. Fill in values for name, description, and value for the newly created environment
  4. Add a new environment by clicking on Add environment
  5. Values from step 3 have been cleared. The expected behavior is that values from step 3 are persisted.

Alternatively:

  1. Go to https://stackblitz.com/edit/remix-run-remix-7ybrqe?file=app%2Froutes%2F_index.tsx
  2. Add a an environment by clicking on Add environment
  3. Fill in values for name, description, and value for the newly created environment
  4. Add a new variable by clicking on Add variable
  5. Values from step 3 have been cleared. The expected behavior is that values from step 3 are persisted.

What browsers are you seeing the problem on?

Chrome, Firefox, Microsoft Edge, Safari, Others

Screenshots or Videos

No response

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions