Nessa aula, vamos consertar um detalhe que é para salvar o addressId. Nós estamos salvando aqui apenas o value, só que, precisamos no addressId salvar o key. Vamos então lá em “DropDownComponent” e vamos criar mais uma prop, que será essa string definindo se é key ou value

interface DropDownProps {
  data: Object[];
  placeholder: string;
  setSelected: React.Dispatch<SetStateAction<string>>;
  saveMethod: string;
}

const DropDownComponent = ({
  data,
  placeholder,
  setSelected,
  saveMethod,
}: DropDownProps) => {

return (
  <DropDownContainer>
    <DropDown
      setSelected={(val: string) => setSelected(val)}
      data={res}
      placeholder={placeholder}
      save={saveMethod === "value" ? "value" : "key"}
      search={false}
      arrowicon={<ArrowIcon source={arrowIcon} />}
    />
  </DropDownContainer>
);

Agora, nós iremos pesquisar pelos locais que usam o dropdown e iremos adicionar, começando pelo nosso addProduct

<DropDownComponent
  data={Category}
  placeholder="Selecione a categoria"
  setSelected={setCategorie}
  saveMethod="value"
/>

<DropDownComponent
  data={address}
  placeholder="Selecione o endereço"
  setSelected={setAddressId}
  saveMethod="key"
/>

E aí ao fazermos isso, quando clicarmos em um endereço no dropDown, ele vai aparecer o nome da rua, porém salvar apenas o id de fato. Vamos adicionar isso também em “fieldsAbled”, como ele não serve para selecionar, apenas para mostrar, podemos deixar como value

<DropDownComponent
	placeholder="Seus endereços"
  setSelected={setSelect}
  data={Data}
  saveMethod="value"
/>

E ao fazer isso, podemos agora cadastrar algum produto, e nós iremos ter no mongo a visualização do endereço que temos cadastrado quando enviamos também o produto

E vamos poder também agora, chamar o endereço na tela individual de produto, basta irmos lá e chamar ele onde temos o comentário

const Product = ({ route }: Props) => {
  const navigation = useNavigation<PropsStack>();
  const { token } = useAuth();

  return (
    <Container>
      <BackArrow marginLeft={30} />
      <Title>{route.params.name}</Title>
      <SubTitleContainer>
        <SubTitle>Publicado em {getDate(route.params.createdAt)}</SubTitle>
        <SubTitle>
          {route.params.address.city}, {route.params.address.state}
        </SubTitle>
      </SubTitleContainer>

Podemos ver então, que nesse onde a gente salvou está com o endereço correto, então podemos recriar alguns dos produtos para terem endereços certinho