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

Add i18n support #848

Merged
merged 46 commits into from
Jan 10, 2025
Merged
Changes from 1 commit
Commits
Show all changes
46 commits
Select commit Hold shift + click to select a range
15d836f
feat: add i18n helper and provider
pfferrari Dec 11, 2024
e6c851e
feat: add i18n-locales package
pfferrari Dec 11, 2024
e8711c7
chore: export useTranslation
marcomontalbano Dec 11, 2024
503e3f4
perf: import useTranslation from app-elements in docs
pfferrari Dec 11, 2024
042e7c4
chore: rename localeUrl prop
pfferrari Dec 11, 2024
0d32536
feat: add translations for dictionaries
pfferrari Dec 12, 2024
ae8a0e3
fix: remove i18n package to ship locales with app-elements using `i18…
gciotola Dec 13, 2024
55529de
fix: remove `useTranslation` in functions (non-react components)
gciotola Dec 13, 2024
ecfdc63
feat: add translations for hooks
pfferrari Dec 16, 2024
5dbf39e
fix: use `ts` file to improve type definitions in consumer apps
gciotola Dec 16, 2024
ac2fa45
fix: update vite plugin hook
gciotola Dec 16, 2024
8a0ff85
fix: apply new structure to locales
gciotola Dec 16, 2024
dea3c4e
fix: add static type defs for locales
gciotola Dec 16, 2024
1fbcbd9
fix: add more keys for app-orders
gciotola Dec 17, 2024
fdb2699
fix: add new locale keys
gciotola Dec 17, 2024
36abcd7
fix: update locales import path
gciotola Dec 17, 2024
708802c
feat: add locales for composite components
pfferrari Dec 18, 2024
1f9020f
fix: reorganize empty states locale keys
gciotola Dec 18, 2024
a8ce6e3
chore: add new locales for forms components
pfferrari Dec 18, 2024
f89e320
fix: add new keys for app orders and links
gciotola Dec 18, 2024
5317ad2
fix: update translations for app orders
gciotola Dec 18, 2024
fcda3c7
chore: add locales for forms components
pfferrari Dec 18, 2024
34373f8
feat: add locales for resources components
pfferrari Dec 19, 2024
ba5dc1b
fix: add new translations keys for app customers
gciotola Dec 19, 2024
aef78bb
fix: add more keys of app-customers
gciotola Dec 19, 2024
c910794
fix: improve loading state in i18n provider
gciotola Dec 19, 2024
5fcf5ea
fix: add missing translations for app shipments
gciotola Dec 20, 2024
60551bc
chore: add locales for resources components
pfferrari Dec 20, 2024
bcb83cc
fix: export Trans component
gciotola Dec 20, 2024
ac82b7a
fix: update locales for orders and returns
gciotola Dec 20, 2024
d5862c8
fix: add missing locale keys
gciotola Dec 20, 2024
34a70e2
fix: update locale keys
gciotola Dec 20, 2024
e7324cf
fix: typos
gciotola Dec 20, 2024
da77d6a
fix: add locale in user object
gciotola Jan 2, 2025
46d7125
fix: update locale keys
gciotola Jan 3, 2025
5e67971
fix: add withLocale decorator in storybook
gciotola Jan 3, 2025
e22c77b
fix: add missing translations
gciotola Jan 3, 2025
1b73032
fix: add localization for date helpers
gciotola Jan 7, 2025
64ca6ef
docs: update date story with i18n s
gciotola Jan 7, 2025
99a117c
fix: update language code rules
gciotola Jan 7, 2025
7668b2a
fix: set locale as optional in date helpers
gciotola Jan 7, 2025
3dd6a5d
fix: pass correct locale to ResourceListItem date helpers
gciotola Jan 7, 2025
3eb3248
fix: remove unused `i18next-browser-languagedetecto` package
gciotola Jan 7, 2025
9ae2f39
fix: add missing locale keys
gciotola Jan 7, 2025
9a8d373
fix: add missing locale keys
gciotola Jan 7, 2025
acd34d0
docs: add basic documentation for `I18NProvider`
gciotola Jan 9, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix: apply new structure to locales
  • Loading branch information
gciotola committed Jan 7, 2025
commit 8a0ff85a9a5f280cfa95d27f2287e840d69b658a
11 changes: 0 additions & 11 deletions packages/app-elements/i18n.d.ts

This file was deleted.

3 changes: 0 additions & 3 deletions packages/app-elements/package.json
Original file line number Diff line number Diff line change
@@ -20,9 +20,6 @@
},
"./tailwind.config": {
"require": "./dist/tailwind.config.js"
},
"./i18n.d.ts": {
"require": "./dist/i18n.d.ts"
}
},
"engines": {
18 changes: 9 additions & 9 deletions packages/app-elements/src/dictionaries/customers.ts
Original file line number Diff line number Diff line change
@@ -10,35 +10,35 @@ export function getCustomerDisplayStatus(
switch (customerObj.status) {
case 'prospect':
return {
label: t('common.resources.customers.status.prospect'),
label: t('resources.customers.attributes.status.prospect'),
icon: 'chatCircle',
color: 'orange',
task: t('common.resources.customers.status.prospect')
task: t('resources.customers.attributes.status.prospect')
}

case 'acquired':
return {
label: t('common.resources.customers.status.acquired'),
label: t('resources.customers.attributes.status.acquired'),
icon: 'check',
color: 'orange',
task: t('common.resources.customers.status.acquired')
task: t('resources.customers.attributes.status.acquired')
}

case 'repeat':
return {
label: t('common.resources.customers.status.repeat'),
label: t('resources.customers.attributes.status.repeat'),
icon: 'arrowUpRight',
color: 'orange',
task: t('common.resources.customers.status.repeat')
task: t('resources.customers.attributes.status.repeat')
}
}
}

export function getCustomerStatusName(status: Customer['status']): string {
const dictionary: Record<typeof status, string> = {
prospect: t('common.resources.customers.status.prospect'),
acquired: t('common.resources.customers.status.acquired'),
repeat: t('common.resources.customers.status.repeat')
prospect: t('resources.customers.attributes.status.prospect'),
acquired: t('resources.customers.attributes.status.acquired'),
repeat: t('resources.customers.attributes.status.repeat')
}

return dictionary[status]
94 changes: 52 additions & 42 deletions packages/app-elements/src/dictionaries/orders.ts
Original file line number Diff line number Diff line change
@@ -15,10 +15,10 @@ export function getOrderDisplayStatus(order: Order): OrderDisplayStatus {

if (order.status === 'editing') {
return {
label: t('common.resources.orders.status.editing'),
label: t('resources.orders.attributes.status.editing'),
icon: 'pencilSimple',
color: 'orange',
task: t('common.resources.orders.status.editing')
task: t('resources.orders.attributes.status.editing')
}
}

@@ -32,79 +32,81 @@ export function getOrderDisplayStatus(order: Order): OrderDisplayStatus {
case 'placed:free:unfulfilled':
case 'placed:free:not_required':
return {
label: t('common.resources.orders.status.placed'),
label: t('resources.orders.attributes.status.placed'),
icon: 'arrowDown',
color: 'orange',
task: t('common.resources.orders.task.awaiting_approval')
task: t('apps.orders.task.awaiting_approval')
}

case 'placed:unpaid:unfulfilled':
return {
label: t('common.resources.orders.status.placed'),
label: t('resources.orders.attributes.status.placed'),
icon: 'x',
color: 'red',
task: t('common.resources.orders.task.error_to_cancel')
task: t('apps.orders.task.error_to_cancel')
}

case 'approved:authorized:unfulfilled':
case 'approved:authorized:not_required':
return {
label: t('common.resources.orders.status.approved'),
label: t('resources.orders.attributes.status.approved'),
icon: 'creditCard',
color: 'orange',
task: t('common.resources.orders.task.payment_to_capture')
task: t('apps.orders.task.payment_to_capture')
}

case 'approved:paid:in_progress':
case 'approved:partially_refunded:in_progress':
return {
label: t('common.resources.orders.status.in_progress'),
label: t('resources.orders.attributes.status.in_progress'),
icon: 'arrowClockwise',
color: 'orange',
task: t('common.resources.orders.task.fulfillment_in_progress')
task: t('apps.orders.task.fulfillment_in_progress')
}

case 'approved:authorized:in_progress':
return {
label: t('common.resources.orders.status.in_progress_manual'),
label: t('apps.orders.display_status.in_progress_manual'),
icon: 'arrowClockwise',
color: 'orange',
task: t('common.resources.orders.task.fulfillment_in_progress')
task: t('apps.orders.task.fulfillment_in_progress')
}

case 'approved:paid:fulfilled':
return {
label: t('common.resources.orders.fulfillment_status.fulfilled'),
label: t('resources.orders.attributes.fulfillment_status.fulfilled'),
icon: 'check',
color: 'green'
}

// TODO: This could be a gift-card and what If i do return?
case 'approved:free:fulfilled':
return {
label: t('common.resources.orders.fulfillment_status.fulfilled'),
label: t('resources.orders.attributes.fulfillment_status.fulfilled'),
icon: 'check',
color: 'green'
}

case 'approved:paid:not_required':
case 'approved:partially_refunded:not_required':
return {
label: t('common.resources.orders.status.approved'),
label: t('resources.orders.attributes.status.approved'),
icon: 'check',
color: 'green'
}

case 'approved:free:not_required':
return {
label: t('common.resources.orders.status.approved'),
label: t('resources.orders.attributes.status.approved'),
icon: 'check',
color: 'green'
}

case 'approved:partially_refunded:fulfilled':
return {
label: t('common.resources.orders.payment_status.partially_refunded'),
label: t(
'resources.orders.attributes.payment_status.partially_refunded'
),
icon: 'check',
color: 'green'
}
@@ -115,14 +117,14 @@ export function getOrderDisplayStatus(order: Order): OrderDisplayStatus {
case 'cancelled:unpaid:unfulfilled':
case 'cancelled:free:unfulfilled':
return {
label: t('common.resources.orders.status.cancelled'),
label: t('resources.orders.attributes.status.cancelled'),
icon: 'x',
color: 'gray'
}

case 'cancelled:refunded:fulfilled':
return {
label: t('common.resources.orders.status.cancelled'),
label: t('resources.orders.attributes.status.cancelled'),
icon: 'x',
color: 'gray'
}
@@ -131,14 +133,14 @@ export function getOrderDisplayStatus(order: Order): OrderDisplayStatus {
case 'pending:authorized:unfulfilled':
case 'pending:free:unfulfilled':
return {
label: t('common.resources.orders.status.pending'),
label: t('resources.orders.attributes.status.pending'),
icon: 'shoppingBag',
color: 'white'
}

default:
return {
label: `${t('common.resources.common.status.not_handled')}: (${combinedStatus})`,
label: `${t('common.not_handled')}: (${combinedStatus})`,
icon: 'warning',
color: 'white'
}
@@ -169,13 +171,13 @@ export function getOrderTransactionName(

export function getOrderStatusName(status: Order['status']): string {
const dictionary: Record<typeof status, string> = {
approved: t('common.resources.orders.status.approved'),
cancelled: t('common.resources.orders.status.cancelled'),
draft: t('common.resources.orders.status.draft'),
editing: t('common.resources.orders.status.editing'),
pending: t('common.resources.orders.status.pending'),
placed: t('common.resources.orders.status.placed'),
placing: t('common.resources.orders.status.placing')
approved: t('resources.orders.attributes.status.approved'),
cancelled: t('resources.orders.attributes.status.cancelled'),
draft: t('resources.orders.attributes.status.draft'),
editing: t('resources.orders.attributes.status.editing'),
pending: t('resources.orders.attributes.status.pending'),
placed: t('resources.orders.attributes.status.placed'),
placing: t('resources.orders.attributes.status.placing')
}

return dictionary[status]
@@ -185,21 +187,23 @@ export function getOrderPaymentStatusName(
status: Order['payment_status']
): string {
const dictionary: Record<typeof status, string> = {
authorized: t('common.resources.orders.payment_status.authorized'),
paid: t('common.resources.orders.payment_status.paid'),
unpaid: t('common.resources.orders.payment_status.unpaid'),
free: t('common.resources.orders.payment_status.free'),
voided: t('common.resources.orders.payment_status.voided'),
refunded: t('common.resources.orders.payment_status.refunded'),
authorized: t('resources.orders.attributes.payment_status.authorized'),
paid: t('resources.orders.attributes.payment_status.paid'),
unpaid: t('resources.orders.attributes.payment_status.unpaid'),
free: t('resources.orders.attributes.payment_status.free'),
voided: t('resources.orders.attributes.payment_status.voided'),
refunded: t('resources.orders.attributes.payment_status.refunded'),
partially_authorized: t(
'common.resources.orders.payment_status.partially_authorized'
'resources.orders.attributes.payment_status.partially_authorized'
),
partially_paid: t(
'resources.orders.attributes.payment_status.partially_paid'
),
partially_paid: t('common.resources.orders.payment_status.partially_paid'),
partially_refunded: t(
'common.resources.orders.payment_status.partially_refunded'
'resources.orders.attributes.payment_status.partially_refunded'
),
partially_voided: t(
'common.resources.orders.payment_status.partially_voided'
'resources.orders.attributes.payment_status.partially_voided'
)
}

@@ -210,10 +214,16 @@ export function getOrderFulfillmentStatusName(
status: Order['fulfillment_status']
): string {
const dictionary: Record<typeof status, string> = {
unfulfilled: t('common.resources.orders.fulfillment_status.unfulfilled'),
in_progress: t('common.resources.orders.fulfillment_status.in_progress'),
fulfilled: t('common.resources.orders.fulfillment_status.fulfilled'),
not_required: t('common.resources.orders.fulfillment_status.not_required')
unfulfilled: t(
'resources.orders.attributes.fulfillment_status.unfulfilled'
),
in_progress: t(
'resources.orders.attributes.fulfillment_status.in_progress'
),
fulfilled: t('resources.orders.attributes.fulfillment_status.fulfilled'),
not_required: t(
'resources.orders.attributes.fulfillment_status.not_required'
)
}

return dictionary[status]
10 changes: 5 additions & 5 deletions packages/app-elements/src/dictionaries/promotions.ts
Original file line number Diff line number Diff line change
@@ -13,7 +13,7 @@ export function getPromotionDisplayStatus(
if (promotion.disabled_at != null) {
return {
status: 'disabled',
label: t('common.resources.promotions.status.disabled'),
label: t('resources.promotions.attributes.status.disabled'),
icon: 'minus',
color: 'lightGray'
}
@@ -30,7 +30,7 @@ export function getPromotionDisplayStatus(
) {
return {
status: 'used',
label: t('common.resources.promotions.status.expired'),
label: t('resources.promotions.attributes.status.expired'),
icon: 'flag',
color: 'gray'
}
@@ -40,23 +40,23 @@ export function getPromotionDisplayStatus(
case 'past':
return {
status: 'expired',
label: t('common.resources.promotions.status.expired'),
label: t('resources.promotions.attributes.status.expired'),
icon: 'flag',
color: 'gray'
}

case 'upcoming':
return {
status: 'upcoming',
label: t('common.resources.promotions.status.upcoming'),
label: t('resources.promotions.attributes.status.upcoming'),
icon: 'calendarBlank',
color: 'gray'
}

case 'active':
return {
status: 'active',
label: t('common.resources.promotions.status.active'),
label: t('resources.promotions.attributes.status.active'),
icon: 'pulse',
color: 'green'
}
Loading