# Hooks (/themes/sdk/reference/i18n/hooks)

```ts
import { … } from '@poltura/theme-sdk/i18n';
```

## `useTranslations` [#usetranslations]

The platform's own texts, the strings the storefront ships for every theme.

```ts
useTranslations(namespace?: string): Translator
```

**Parameters**

- `namespace?: string`: The dotted prefix the keys are read under.

**Returns:** A function that reads one text by key.

**Example**

```tsx
import { useTranslations } from '@poltura/theme-sdk/i18n';

export function CartTitle() {
  const t = useTranslations('cart');
  return <h1>{t('title')}</h1>;
}
```

## `useRichTranslations` [#userichtranslations]

Platform texts whose marked passages the theme draws, such as the terms and privacy links in the sign-up consent.

```ts
useRichTranslations(namespace?: string): RichTranslator
```

**Parameters**

- `namespace?: string`: The dotted prefix the keys are read under.

**Returns:** A function that reads one text by key and draws its marked passages.

**Example**

```tsx
import { useRichTranslations } from '@poltura/theme-sdk/i18n';
import { Link } from '@poltura/theme-sdk/routing';

export function TermsConsent() {
  const t = useRichTranslations('auth.register');
  return (
    <span>
      {t('termsCheckboxLabel', {
        terms: (chunks) => <Link href='/legal/terms-of-service'>{chunks}</Link>,
        privacy: (chunks) => <Link href='/legal/privacy-policy'>{chunks}</Link>,
      })}
    </span>
  );
}
```

## `useLocale` [#uselocale]

The language the page renders in.

```ts
useLocale(): string
```

**Returns:** The BCP 47 tag of the page language, such as `hu-HU`.

**Example**

```tsx
import { useLocale } from '@poltura/theme-sdk/i18n';

export function Lang({ children }: { children: string }) {
  return <span lang={useLocale()}>{children}</span>;
}
```

## `useNow` [#usenow]

The current time, the same on the server and in the browser for the first render.

```ts
useNow(): Date
```

**Returns:** The instant the page renders at.

**Example**

```tsx
import { useFormat, useNow } from '@poltura/theme-sdk/i18n';

export function Today() {
  return <time>{useFormat().date(useNow())}</time>;
}
```

## `useTimeZone` [#usetimezone]

The store's time zone, which every store date renders in.

```ts
useTimeZone(): string
```

**Returns:** The IANA time zone, such as `Europe/Budapest`.

**Example**

```tsx
import { useTimeZone } from '@poltura/theme-sdk/i18n';

export function Zone() {
  return <small>{useTimeZone()}</small>;
}
```

## `useThemeText` [#usethemetext]

The theme's own texts in the page language, live while the merchant edits them.

```ts
useThemeText(namespace?: string): ThemeText
```

A key missing in the page language falls back to the theme's base language, then English, then the key itself. Store-wide placeholders such as `{store.name}` fill themselves.

**Parameters**

- `namespace?: string`: The dotted prefix the keys are read under.

**Returns:** A function that reads one text by key.

**Example**

```tsx
import { useThemeText } from '@poltura/theme-sdk/i18n';

export function Left({ count }: { count: number }) {
  const t = useThemeText('product');
  return <p>{t('left', { count })}</p>;
}
```

## `useFormat` [#useformat]

The formatter for the page language and the store's time zone.

```ts
useFormat(): Formatter
```

**Returns:** Functions that write money, numbers, dates and lists.

**Example**

```tsx
import { useFormat } from '@poltura/theme-sdk/i18n';
import type { Money } from '@poltura/theme-sdk/price';

export function Total({ total }: { total: Money }) {
  return <strong>{useFormat().money(total)}</strong>;
}
```

## `useLocales` [#uselocales]

The page language and the other languages the storefront offers, for a language switcher.

```ts
useLocales(): Locales
```

**Returns:** The current language and every available one.

**Example**

```tsx
import { useLocales } from '@poltura/theme-sdk/i18n';

export function Languages() {
  const { current, available } = useLocales();
  return (
    <ul>
      {available.map((locale) => (
        <li key={locale.tag} aria-current={locale.tag === current.tag}>
          {locale.label}
        </li>
      ))}
    </ul>
  );
}
```