Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make country and state a dropdown in shipping info section #88

Open
wants to merge 8 commits into
base: main
Choose a base branch
from

Conversation

andrii-balitskyi
Copy link
Contributor

@andrii-balitskyi andrii-balitskyi commented Oct 18, 2024

Closes #87

  • Add country dropdown
  • Add state dropdown
Kapture.2024-10-21.at.15.20.54.mp4

Copy link

vercel bot commented Oct 18, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Skipped Deployment
Name Status Preview Updated (UTC)
snippets ⬜️ Ignored (Inspect) Visit Preview Oct 21, 2024 1:26pm

Copy link
Contributor

@seveibar seveibar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cool. Is it possible to type in the state/country? Just a pet peeve when it's a forced dropdown and not a dropdown or type search.

Next step is to load this from the server via /accounts/get_shipping_info and set it with update_shipping_info

@seveibar
Copy link
Contributor

Can we make the order of the fields more conventional

Id also recommend we do country first

image

@andrii-balitskyi
Copy link
Contributor Author

Cool. Is it possible to type in the state/country? Just a pet peeve when it's a forced dropdown and not a dropdown or type search.

@seveibar you can't type but when you hit a key, the select dropdown does go to the choices starting with that letter.
To make it typeable, should I use input tag together with datalist one?

Next step is to load this from the server via /accounts/get_shipping_info and set it with update_shipping_info

I added /accounts/get and /accounts/update endpoints for that as shipping info is stored on accounts. What's the benefit of using separate shipping info endpoints?

@andrii-balitskyi
Copy link
Contributor Author

@seveibar I end up adding a custom SearchableSelect component. Also, I added some shipping properties to make the fields more conventional as you suggested. I updated the video in the PR description so you can take a look at the updated version. Lmk what you think.

@seveibar
Copy link
Contributor

The design is a bit unconventional, the correct design is like this where you don't have to click the select field: https://react-select.com/home

Even better, shadcn has a builtin component here: https://ui.shadcn.com/docs/components/combobox

Still this is an improvement

Copy link
Contributor

@seveibar seveibar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd recommend switching to ComboBox, shadcn's builtin

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Make country and state a dropdown in shipping info section
2 participants