diff --git a/src/app/(main)/cart/page.tsx b/src/app/(main)/cart/page.tsx index aa19b032d..cac8f802d 100644 --- a/src/app/(main)/cart/page.tsx +++ b/src/app/(main)/cart/page.tsx @@ -23,10 +23,10 @@ export default async function Page() { Looks like you haven’t added any items to the cart yet.

- Go back + Explore products ); diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx index ebb4fee08..01440b467 100644 --- a/src/app/checkout/page.tsx +++ b/src/app/checkout/page.tsx @@ -17,7 +17,7 @@ export default function CheckoutPage({ } return ( -
+
diff --git a/src/checkout/assets/icons/edit.tsx b/src/checkout/assets/icons/edit.tsx index 98b665395..bddd11f7d 100644 --- a/src/checkout/assets/icons/edit.tsx +++ b/src/checkout/assets/icons/edit.tsx @@ -3,7 +3,7 @@ export function EditIcon() { diff --git a/src/checkout/components/AddressForm/AddressForm.tsx b/src/checkout/components/AddressForm/AddressForm.tsx index 6272df578..bf593ab76 100644 --- a/src/checkout/components/AddressForm/AddressForm.tsx +++ b/src/checkout/components/AddressForm/AddressForm.tsx @@ -77,11 +77,9 @@ export const AddressForm: FC> = ({ return ( <> -
- {title} - -
+ {title}
+ {orderedAddressFields.map((field) => { const isRequired = isRequiredField(field); const label = getFieldLabel(field); diff --git a/src/checkout/components/AddressForm/useAddressFormUtils.ts b/src/checkout/components/AddressForm/useAddressFormUtils.ts index d674d65f2..30e751f4a 100644 --- a/src/checkout/components/AddressForm/useAddressFormUtils.ts +++ b/src/checkout/components/AddressForm/useAddressFormUtils.ts @@ -24,7 +24,14 @@ export const addressFieldMessages: Record = { phone: "Phone number", }; -export type LocalizedAddressFieldLabel = "province" | "district" | "state" | "zip" | "postal" | "postTown"; +export type LocalizedAddressFieldLabel = + | "province" + | "district" + | "state" + | "zip" + | "postal" + | "postTown" + | "prefecture"; export const localizedAddressFieldMessages: Record = { province: "Province", district: "District", @@ -32,6 +39,7 @@ export const localizedAddressFieldMessages: Record { diff --git a/src/checkout/components/AddressSelectBox/AddressSelectBox.tsx b/src/checkout/components/AddressSelectBox/AddressSelectBox.tsx index 97d0faa7a..e75e33747 100644 --- a/src/checkout/components/AddressSelectBox/AddressSelectBox.tsx +++ b/src/checkout/components/AddressSelectBox/AddressSelectBox.tsx @@ -4,6 +4,7 @@ import { Button } from "@/checkout/components/Button"; import { Address } from "@/checkout/components/Address"; import { type AddressFragment } from "@/checkout/graphql"; import { type AddressField } from "@/checkout/components/AddressForm/types"; +import { EditIcon } from "@/checkout/assets/icons"; interface AddressSelectBoxProps extends Omit, "children"> { @@ -21,22 +22,20 @@ export const AddressSelectBox = ({ }: AddressSelectBoxProps) => { return ( -
+
{unavailable &&

Can't ship to this address

}
-
-
+
); diff --git a/src/checkout/components/Button.tsx b/src/checkout/components/Button.tsx index 3cf451c6a..2eac60603 100644 --- a/src/checkout/components/Button.tsx +++ b/src/checkout/components/Button.tsx @@ -3,7 +3,7 @@ import clsx from "clsx"; export interface ButtonProps extends ButtonHTMLAttributes { label: ReactNode; - variant?: "primary" | "secondary" | "tertiary"; + variant?: "primary" | "secondary" | "tertiary" | ""; ariaLabel?: string; ariaDisabled?: boolean; } @@ -22,9 +22,9 @@ export const Button: FC = ({ const classes = clsx( "inline-flex h-10 items-center justify-center whitespace-nowrap rounded border active:outline-none", { - "bg-neutral-900 hover:bg-neutral-800 disabled:bg-neutral-700 aria-disabled:bg-neutral-200 text-white px-4": + "bg-neutral-900 hover:bg-neutral-800 disabled:bg-neutral-700 text-white px-4 aria-disabled:cursor-not-allowed aria-disabled:opacity-70 hover:aria-disabled:bg-neutral-700": variant === "primary", - "border-neutral-600 hover:border-neutral-700 hover:bg-neutral-300 active:bg-neutral-300 disabled:border-neutral-300 aria-disabled:border-neutral-300 bg-transparent disabled:bg-transparent aria-disabled:bg-transparent": + "border-neutral-600 hover:border-neutral-700 hover:bg-neutral-300 active:bg-neutral-300 disabled:border-neutral-300 aria-disabled:border-neutral-300 bg-transparent disabled:bg-transparent aria-disabled:bg-transparent px-4": variant === "secondary", "h-auto border-none bg-transparent p-0": variant === "tertiary", }, diff --git a/src/checkout/components/CountrySelect.tsx b/src/checkout/components/CountrySelect.tsx index bf11b75f2..9805c7548 100644 --- a/src/checkout/components/CountrySelect.tsx +++ b/src/checkout/components/CountrySelect.tsx @@ -17,6 +17,9 @@ export const CountrySelect: React.FC = ({ only = [] }) => { })); return ( - + ); }; diff --git a/src/checkout/components/ManualSaveAddressForm/AddressFormActions.tsx b/src/checkout/components/ManualSaveAddressForm/AddressFormActions.tsx index aa843e536..12974f0ed 100644 --- a/src/checkout/components/ManualSaveAddressForm/AddressFormActions.tsx +++ b/src/checkout/components/ManualSaveAddressForm/AddressFormActions.tsx @@ -16,22 +16,21 @@ export const AddressFormActions: React.FC = ({ loading, }) => { return ( -
+
{onDelete && ( -
- } /> +
+ } />
)} -