src/components/address.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

import countryList from "react-select-country-list";

export default function Address({ address }) {
  const edit_address_route = `/account/addresses/${address.id}/edit`;

  return(
    <tr className="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
      <th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
        {address.attributes.street}
      </th>
      <td className="px-6 py-4">
        {address.attributes.number}
      </td>
      <td className="px-6 py-4">
        {address.attributes.zip_code}
      </td>
      <td className="px-6 py-4">
        {address.attributes.city}
      </td>
      <td className="px-6 py-4">
        {countryList().getLabel(address.attributes.country)}
      </td>
      <td className="px-6 py-4">
      <a type="button" className="focus:outline-none text-white bg-green-700 hover:bg-green-800 focus:ring-4 focus:ring-green-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-800"
         href={edit_address_route}>
        Editar
      </a>
      </td>
    </tr>
  );
}