What is better way to create a payload for an array based subdocument?

[Goro]

What stack are you using?

(ex: MERN(mongoose + react), DR(django + react), PEN, etc.)

MERN

What's the problem you're trying to solve?

Instead of having the user submit a single subdcoument array item at a time, I would like them to be able to submit an array of updates without any conflict.

Post any code you think might be relevant (one fenced block per file)

      <FormControl mt={6}>
              <FormLabel>Order Items:</FormLabel>
              <ButtonGroup size="sm" isAttached variant="outline" m={1}>
                <Button mr="-px">Add New Order Item:</Button>
                <IconButton aria-label="Add to Order" icon={<GrAdd />} />
              </ButtonGroup>

              <List spacing={3} m={1}>
                {orderItemsMap}
              </List>

If you see an error message, post it here. If you don't, what unexpected behavior are you seeing?

This is a question about approach/implementation not about actual issue.

What is your best guess as to the source of the problem?

What things have you already tried to solve the problem?

I've attempted to push in an array payload which does not work. Either there is a built-in native mongoose method or...?

[Taylor Darneille]

Are you having troubles with the mongoose code on the backend or are you having a hard time sending it from react? If it's back-end, just do a forEach through the array and push one at a time?

[Goro]

My Understanding Thus Far:

1. I make a request for either no array items, or the pre-existing array items for the document I requested.
2. I store them into state to display for the user.
3. I create a separate state array to hold items added by the user.
4. I use this array as the payload for the patch request for my particular subdocument field.
5. When the payload hits my route, I push each item of the "state array" I Patched into the subdocument field.
6. Assuming this operation was successful, I make a new request for these subdocument array items and do a prop refresh.

Is that more or less what you are suggesting?

[Taylor Darneille]

oh so creating new subdocuments is actually a POST, not a PATCH. I'm gonna come chat with you.

[Taylor Darneille]

Goro is going to separate the 'add new items' (POST) from the 'edit this order'(Patch) and report back if he hits another block doing that.

[Goro]

Solution:

1. Add another form with the following:

• A Submit Button that handles a POST request which submits an entire Array as the req.body.
• An Add Button that appends an object to a stateful array.
• A Delete Button that Slices a particular entry out of that array.