0
\$\begingroup\$

I have several products. A product can have 1 or more images. In each image, we have content slot. I don't want duplication per content slot in a product.

My code works fine. I'm just wondering what will be a better way to do this or improvement on my code?

Codesandbox is here CLICK HERE

    <Autocomplete
      fullWidth
      size="small"
      options={
        Boolean(product.slot) && product.slot.length > 0
          ? contentSlots.filter(
              (slot) =>
                !product.slot.find((data) => data.value.id === slot.id)
            )
          : contentSlots
      }
      renderInput={(params) => (
        <TextField
          {...params}
          label="Content Slots"
          variant="outlined"
          fullWidth
        />
      )}
      getOptionLabel={(option) => option.name || ""}
      disableClearable={true}
      onChange={(_, value) => onChangeContentSlot(value, product)}
    />
New contributor
Joseph is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.
\$\endgroup\$

Your Answer

Joseph is a new contributor. Be nice, and check out our Code of Conduct.

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.