Skip to content

Commit 2dd9c40

Browse files
adambarathadambarath
committed
modules/layout
1 parent 1a4896a commit 2dd9c40

File tree

12 files changed

+247
-178
lines changed

12 files changed

+247
-178
lines changed

‎src/locales/client.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
"use client"
44
import { createI18nClient } from 'next-international/client'
55

6-
export const { useI18n, useScopedI18n, I18nProviderClient } = createI18nClient({
6+
export const { useI18n, useScopedI18n, I18nProviderClient, I18nClientContext, useCurrentLocale } = createI18nClient({
77
us: () => import('./us'),
88
hu: () => import('./hu')
9+
}, {
10+
segmentName: "countryCode"
911
})

‎src/locales/hu.ts‎

Lines changed: 34 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,38 @@
11
export default {
2-
"generic.somethingwrong": "Hiba történt",
3-
"nav.title": "Üzlet",
4-
hello: "Hello",
5-
welcome: "Hello {name}!",
6-
"about.you": "Hello {name}! You have {age} yo",
7-
"scope.test": "A scope",
8-
"scope.more.test": "A scope",
9-
"scope.more.param": "A scope with {param}",
10-
"scope.more.and.more.test": "A scope",
2+
"generic.somethingwrong": "Valami hiba történt",
3+
"nav.title": "Bolt",
4+
"nav.search": "Keresés",
5+
"nav.account": "Fiók",
6+
"nav.cart": "Kosár",
7+
8+
"cart.dropdown.cart": "Kosár ({count})",
9+
"cart.dropdown.quantity": "Mennyiség: ",
10+
"cart.dropdown.remove": "Eltávolítás",
11+
"cart.dropdown.subtotal": "Részösszeg",
12+
"cart.dropdown.gotocart": "Ugrás a kosárhoz",
13+
"cart.dropdown.empty": "A bevásárló táskád üres",
14+
"cart.dropdown.gotoall": "Ugrás az összes termék oldalra",
15+
"cart.dropdown.explore": "Termékek felfedezése",
16+
17+
"sidemenu.menu": "Menü",
18+
"sidemenu.home": "Kezdőlap",
19+
"sidemenu.store": "Bolt",
20+
"sidemenu.search": "Keresés",
21+
"sidemenu.account": "Fiók",
22+
"sidemenu.cart": "Kosár",
23+
24+
"store.created_at": "Legújabb érkezések",
25+
"store.price_asc": "Ár: Növekvő",
26+
"store.price_desc": "Ár: Csökkenő",
27+
"store.sort": "Rendezés",
28+
"store.all": "Minden termék",
29+
"store.": "",
30+
31+
"footer.store": "Medusa Bolt",
32+
"footer.categories": "Kategóriák",
33+
"footer.collections": "Kollekciók",
34+
"footer.rights": "Minden jog fenntartva.",
35+
1136
"scope.more.stars#one": "1 star on GitHub",
1237
"scope.more.stars#other": "{count} stars on GitHub",
1338
"missing.translation.in.fr": "This should work",

‎src/locales/server.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
// locales/server.ts
33
import { createI18nServer } from 'next-international/server'
44

5-
export const { getI18n, getScopedI18n, getStaticParams } = createI18nServer({
5+
export const { getI18n, getScopedI18n, getStaticParams, getCurrentLocale } = createI18nServer({
66
us: () => import('./us'),
77
hu: () => import('./hu')
8+
}, {
9+
segmentName: "countryCode"
810
})

‎src/locales/us.ts‎

Lines changed: 41 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,45 @@
11
export default {
22
"generic.somethingwrong": "Something went wrong",
33
"nav.title": "Store",
4-
hello: "Hello",
5-
welcome: "Hello {name}!",
6-
"about.you": "Hello {name}! You have {age} yo",
7-
"scope.test": "A scope",
8-
"scope.more.test": "A scope",
9-
"scope.more.param": "A scope with {param}",
10-
"scope.more.and.more.test": "A scope",
11-
"scope.more.stars#one": "1 star on GitHub",
12-
"scope.more.stars#other": "{count} stars on GitHub",
13-
"missing.translation.in.fr": "This should work",
14-
"cows#one": "A cow",
15-
"cows#other": "{count} cows",
4+
"nav.search": "Search",
5+
"nav.account": "Account",
6+
"nav.cart": "Cart",
7+
8+
"cart.dropdown.cart": "Cart ({count})",
9+
"cart.dropdown.quantity": "Quantity: ",
10+
"cart.dropdown.remove": "Remove",
11+
"cart.dropdown.subtotal": "Subtotal",
12+
"cart.dropdown.gotocart": "Go to cart",
13+
"cart.dropdown.empty": "Your shopping bag is empty",
14+
"cart.dropdown.gotoall": "Go to all products page",
15+
"cart.dropdown.explore": "Explore products",
16+
17+
"sidemenu.menu": "Menu",
18+
"sidemenu.home": "Home",
19+
"sidemenu.store": "Store",
20+
"sidemenu.search": "Search",
21+
"sidemenu.account": "Account",
22+
"sidemenu.cart": "Cart",
23+
24+
"store.created_at": "Latest Arrivals",
25+
"store.price_asc": "Price: Low -> High",
26+
"store.price_desc": "Price: High -> Low",
27+
"store.sort": "Sort by",
28+
"store.all": "All products",
29+
"store.": "",
30+
31+
"search.searchresults": "Search Results for:",
32+
"search.clear": "Clear",
33+
"search.noresults": "No results.",
34+
"search.": "",
35+
36+
"product.select": "Select",
37+
"product.": "",
38+
"product.": "",
39+
40+
"footer.store": "Medusa Store",
41+
"footer.categories": "Categories",
42+
"footer.collections": "Collections",
43+
"footer.rights": "All rights reserved.",
44+
1645
} as const

‎src/modules/layout/components/cart-dropdown/index.tsx‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,25 @@ import { Button } from "@medusajs/ui"
66
import { useParams, usePathname } from "next/navigation"
77
import { Fragment, useEffect, useRef, useState } from "react"
88

9+
import { useI18n, useScopedI18n } from "../../../../locales/client"
910
import { formatAmount } from "@lib/util/prices"
1011
import DeleteButton from "@modules/common/components/delete-button"
1112
import LineItemOptions from "@modules/common/components/line-item-options"
1213
import LineItemPrice from "@modules/common/components/line-item-price"
1314
import LocalizedClientLink from "@modules/common/components/localized-client-link"
1415
import Thumbnail from "@modules/products/components/thumbnail"
1516

16-
const CartDropdown = ({
17+
export default function CartDropdown({
1718
cart: cartState,
1819
}: {
1920
cart?: Omit<Cart, "beforeInsert" | "afterLoad"> | null
20-
}) => {
21+
}) {
2122
const [activeTimer, setActiveTimer] = useState<NodeJS.Timer | undefined>(
2223
undefined
2324
)
2425
const [cartDropdownOpen, setCartDropdownOpen] = useState(false)
2526

27+
const t = useScopedI18n("cart.dropdown")
2628
const { countryCode } = useParams()
2729

2830
const open = () => setCartDropdownOpen(true)
@@ -82,7 +84,11 @@ const CartDropdown = ({
8284
className="hover:text-ui-fg-base"
8385
href="/cart"
8486
data-testid="nav-cart-link"
85-
>{`Cart (${totalItems})`}</LocalizedClientLink>
87+
>
88+
{t("cart", {
89+
count: totalItems,
90+
})}
91+
</LocalizedClientLink>
8692
</Popover.Button>
8793
<Transition
8894
show={cartDropdownOpen}
@@ -142,7 +148,7 @@ const CartDropdown = ({
142148
data-testid="cart-item-quantity"
143149
data-value={item.quantity}
144150
>
145-
Quantity: {item.quantity}
151+
{t("quantity")} {item.quantity}
146152
</span>
147153
</div>
148154
<div className="flex justify-end">
@@ -159,7 +165,7 @@ const CartDropdown = ({
159165
className="mt-1"
160166
data-testid="cart-item-remove-button"
161167
>
162-
Remove
168+
{t("remove")}
163169
</DeleteButton>
164170
</div>
165171
</div>
@@ -168,7 +174,7 @@ const CartDropdown = ({
168174
<div className="p-4 flex flex-col gap-y-4 text-small-regular">
169175
<div className="flex items-center justify-between">
170176
<span className="text-ui-fg-base font-semibold">
171-
Subtotal{" "}
177+
{t("subtotal")}{" "}
172178
<span className="font-normal">(excl. taxes)</span>
173179
</span>
174180
<span
@@ -189,7 +195,7 @@ const CartDropdown = ({
189195
size="large"
190196
data-testid="go-to-cart-button"
191197
>
192-
Go to cart
198+
{t("gotocart")}
193199
</Button>
194200
</LocalizedClientLink>
195201
</div>
@@ -200,12 +206,12 @@ const CartDropdown = ({
200206
<div className="bg-gray-900 text-small-regular flex items-center justify-center w-6 h-6 rounded-full text-white">
201207
<span>0</span>
202208
</div>
203-
<span>Your shopping bag is empty.</span>
209+
<span>{t("empty")}</span>
204210
<div>
205211
<LocalizedClientLink href="/store">
206212
<>
207-
<span className="sr-only">Go to all products page</span>
208-
<Button onClick={close}>Explore products</Button>
213+
<span className="sr-only">{t("gotoall")}</span>
214+
<Button onClick={close}>{t("explore")}</Button>
209215
</>
210216
</LocalizedClientLink>
211217
</div>
@@ -218,5 +224,3 @@ const CartDropdown = ({
218224
</div>
219225
)
220226
}
221-
222-
export default CartDropdown

‎src/modules/layout/components/side-menu/index.tsx‎

Lines changed: 27 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,22 @@ import { Region } from "@medusajs/medusa"
66
import { Text, clx, useToggleState } from "@medusajs/ui"
77
import { Fragment } from "react"
88

9+
import { useI18n, useScopedI18n } from "../../../../locales/client"
910
import LocalizedClientLink from "@modules/common/components/localized-client-link"
1011
import CountrySelect from "../country-select"
1112

12-
const SideMenuItems = {
13-
Home: "/",
14-
Store: "/store",
15-
Search: "/search",
16-
Account: "/account",
17-
Cart: "/cart",
18-
}
19-
2013
const SideMenu = ({ regions }: { regions: Region[] | null }) => {
2114
const toggleState = useToggleState()
15+
const t = useScopedI18n("sidemenu")
16+
const footerT = useScopedI18n("footer")
17+
18+
const SideMenuItems = [
19+
{ name: t("home"), href: "/" },
20+
{ name: t("store"), href: "/store" },
21+
{ name: t("search"), href: "/search" },
22+
{ name: t("account"), href: "/account" },
23+
{ name: t("cart"), href: "/cart" },
24+
]
2225

2326
return (
2427
<div className="h-full">
@@ -27,8 +30,11 @@ const SideMenu = ({ regions }: { regions: Region[] | null }) => {
2730
{({ open, close }) => (
2831
<>
2932
<div className="relative flex h-full">
30-
<Popover.Button data-testid="nav-menu-button" className="relative h-full flex items-center transition-all ease-out duration-200 focus:outline-none hover:text-ui-fg-base">
31-
Menu
33+
<Popover.Button
34+
data-testid="nav-menu-button"
35+
className="relative h-full flex items-center transition-all ease-out duration-200 focus:outline-none hover:text-ui-fg-base"
36+
>
37+
{t("menu")}
3238
</Popover.Button>
3339
</div>
3440

@@ -43,23 +49,26 @@ const SideMenu = ({ regions }: { regions: Region[] | null }) => {
4349
leaveTo="opacity-0"
4450
>
4551
<Popover.Panel className="flex flex-col absolute w-full pr-4 sm:pr-0 sm:w-1/3 2xl:w-1/4 sm:min-w-min h-[calc(100vh-1rem)] z-30 inset-x-0 text-sm text-ui-fg-on-color m-2 backdrop-blur-2xl">
46-
<div data-testid="nav-menu-popup" className="flex flex-col h-full bg-[rgba(3,7,18,0.5)] rounded-rounded justify-between p-6">
52+
<div
53+
data-testid="nav-menu-popup"
54+
className="flex flex-col h-full bg-[rgba(3,7,18,0.5)] rounded-rounded justify-between p-6"
55+
>
4756
<div className="flex justify-end" id="xmark">
4857
<button data-testid="close-menu-button" onClick={close}>
4958
<XMark />
5059
</button>
5160
</div>
5261
<ul className="flex flex-col gap-6 items-start justify-start">
53-
{Object.entries(SideMenuItems).map(([name, href]) => {
62+
{SideMenuItems.map((x) => {
5463
return (
55-
<li key={name}>
64+
<li key={x.name}>
5665
<LocalizedClientLink
57-
href={href}
66+
href={x.href}
5867
className="text-3xl leading-10 hover:text-ui-fg-disabled"
5968
onClick={close}
60-
data-testid={`${name.toLowerCase()}-link`}
69+
data-testid={`${x.name.toLowerCase()}-link`}
6170
>
62-
{name}
71+
{x.name}
6372
</LocalizedClientLink>
6473
</li>
6574
)
@@ -85,7 +94,8 @@ const SideMenu = ({ regions }: { regions: Region[] | null }) => {
8594
/>
8695
</div>
8796
<Text className="flex justify-between txt-compact-small">
88-
© {new Date().getFullYear()} Medusa Store. All rights
97+
© {new Date().getFullYear()} {footerT("store")}.{" "}
98+
{footerT("rights")}
8999
reserved.
90100
</Text>
91101
</div>

0 commit comments

Comments
 (0)