Bug - Demo is broken? Unable to create payment link

[obsidian oxide]

^ The title - screenshot attached.

[fiery tundra]

@obsidian oxide yes this is a bit outdated -- we will update this soon.

[obsidian oxide]

Okay, no worries - just thought I'll report in case the team was not aware

[fiery tundra]

Thanks!

@royal hamlet can you take this task?

[obsidian oxide]

@fiery tundra & @royal hamlet - Reporting a minor issue on the checkout page:
There is a typo in the text here - 'who' should be 'which'.

Another minor thing is that the checkout page seems to be defaulting to the light theme option instead of the system option.

[obsidian oxide]

Found one more issue: the state field is mandatory for countries where there is no concept of state/province, and the country needs to be selected twice if the user wishes to provide their phone number - this can create unnecessary friction for the user?

A user in Singapore, would need to select 'Singapore' 3-4 times (country for address, country for phone number, city & state would also be the same)

Lemon Squeezy only asks for the postal code, for example (with the exception of the US, where it asks for full address)
.

[wide quail]

also other payment providers usually automatically select the country based on your location

ive had users accidentally not select their country which makes it default to the US, and that causes problems in the reports

none of my users are from the US, and yet it shows up in the dashboard

because they forgot to select their country

[fiery tundra]

@wide quail we auto select the country on the basis of IP

[obsidian oxide]

@fiery tundra Just checked, the billing address country is auto-selected, but the phone number country isn't.

@wide quail This might be happening because some of your customers might be using a VPN?

[wide quail]

let me check

it doesnt auto select for me

defaulted to the US

[obsidian oxide]

Check on a production checkout page

[wide quail]

okay

nope

hm actually

it works on chrome

not on firefox

wait it does work on firefox

it doesnt work on zen, the browser i use

but zen is firefox based

thats weird

ah its because of ublock origin

okay that makes sense

i should mention, even with ublock origin enabled, other payment processors manage to detect the country

not sure how

this is with ublock origin disabled

this is with ublock origin enabled. it fails to fetch https://api.country.is/

@fiery tundra i think its best if you detected the country on the server

thats probably how others do it

[fiery tundra]

Yes we will update this @snow shuttle please make a note of this

[obsidian oxide]

Thanks @fiery tundra - please do consider simplifying the billing address form as well.

If, for whatever reason, you don't wish to do down the 'only postal code' path - you can use this JSON Data to show appropriate form fields for each country:

https://www.geoapify.com/assets/address-template-by-country.json

Basically in the data above: 'region' is state/province and 'settlement' is city. Some countries also have a 'county' in addition to state/province.

The JSON data is described here:
https://www.geoapify.com/address-formats-by-country-json/

[obsidian oxide]

@wide quail I would assume that they are using locale instead of location - but not sure.

Locale is essentially the region/langauge set on the user's device - this is probably a better parameter to get the billing country since it indicates the user's country of residence even if they are travelling (edge case) - e.g. An Indian's country is still detected as India even if they are travelling in UAE, this is probably better in this case since they would probably still use an Indian card to pay.

And it can be done on the client side, so saves an API call.

const locale = new Intl.Locale(navigator.language);
const countryCode = locale.region;

[wide quail]

yeah this is true

but i think location is probably better

i personally set my region/language to the US

even though im in india

and a lot of other people do the same

[obsidian oxide]

Fair enough

[fiery tundra]

this is a good suggestion -- we will implement this soon.
cc: @snow shuttle

[snow shuttle]

The UI revamp was just Phase 1 of Checkout 2.0. In upcoming updates, we will add address auto-complete using the Google Places API, hybrid links, and much more. Thanks for all the suggestions! We will check feasibility and implement them accordingly.