feat: add function to register custom keysets [WIP]

src/components/__tests__/i18n.test.tsx

@@ -0,0 +1,98 @@
+import React from 'react';
+
+import {render, screen} from '../../../test-utils/utils';
+import {Dialog} from '../Dialog';
+import {Pagination} from '../Pagination';
+import {Lang, configure, registerCustomKeysets} from '../utils/configure';
+
+test('should render components with custom keysets', () => {
+    registerCustomKeysets('rs', {
+        Dialog: {
+            close: 'Затвори дијалог',
+        },
+        Pagination: {
+            button_previous: 'Претходно',
+            button_next: 'Следеће',
+            button_first: 'Прво',
+            label_select_size: 'Изаберите величину странице',
+            'label_input-placeholder': 'Стр.',
+            'label_page-of': 'из',
+        },
+    });
+    registerCustomKeysets('it', {
+        Dialog: {
+            close: 'Chiudere il dialogo',
+        },
+        Pagination: {
+            button_previous: 'Precedente',
+            button_next: 'Avanti',
+            button_first: 'Primo',
+            label_select_size: 'Seleziona la dimensione della pagina',
+            'label_input-placeholder': 'Pagina n.',
+            'label_page-of': 'di',
+        },
+    });
+
+    configure({lang: 'rs'});
+    render(<TestComponents />);
+    expect(screen.getByRole('button', {name: 'Затвори дијалог'})).toBeInTheDocument();
+    expect(screen.getByRole('button', {name: 'Претходно'})).toBeInTheDocument();
+
+    configure({lang: 'it'});
+    render(<TestComponents />);
+    expect(screen.getByRole('button', {name: 'Chiudere il dialogo'})).toBeInTheDocument();
+    expect(screen.getByRole('button', {name: 'Precedente'})).toBeInTheDocument();
+});
+
+test('should render components with bundled keysets after custom keysets registration', () => {
+    registerCustomKeysets('rs', {
+        Dialog: {
+            close: 'Затвори дијалог',
+        },
+        Pagination: {
+            button_previous: 'Претходно',
+            button_next: 'Следеће',
+            button_first: 'Прво',
+            label_select_size: 'Изаберите величину странице',
+            'label_input-placeholder': 'Стр.',
+            'label_page-of': 'из',
+        },
+    });
+
+    configure({lang: Lang.En});
+    render(<TestComponents />);
+    expect(screen.getByRole('button', {name: 'Close dialog'})).toBeInTheDocument();
+    expect(screen.getByRole('button', {name: 'Previous'})).toBeInTheDocument();
+});
+
+test('should override bundled keysets', () => {
+    registerCustomKeysets(Lang.En, {
+        Dialog: {
+            close: '[Overriden] Close dialog',
+        },
+        Pagination: {
+            button_previous: '[Overriden] Previous',
+            button_next: '[Overriden] Next',
+            button_first: '[Overriden] First',
+            label_select_size: '[Overriden] Select page size',
+            'label_input-placeholder': '[Overriden] Page #',
+            'label_page-of': '[Overriden] of',
+        },
+    });
+
+    configure({lang: Lang.En});
+    render(<TestComponents />);
+    expect(screen.getByRole('button', {name: '[Overriden] Close dialog'})).toBeInTheDocument();
+    expect(screen.getByRole('button', {name: '[Overriden] Previous'})).toBeInTheDocument();
+});
+
+function TestComponents(): React.ReactElement {
+    return (
+        <React.Fragment>
+            <Dialog onClose={() => {}} open={true}>
+                <Dialog.Header />
+            </Dialog>
+            <Pagination page={1} pageSize={1} onUpdate={() => {}} />
+        </React.Fragment>
+    );
+}

src/components/utils/configure.ts

@@ -1,10 +1,14 @@
+import type {KeysetData} from '@gravity-ui/i18n';
+
+import {i18n} from '../../i18n';
+
 export enum Lang {
     Ru = 'ru',
     En = 'en',
 }
 
 interface Config {
-    lang: `${Lang}`;
+    lang: Lang | string;
 }
 
 type Subscriber = (config: Config) => void;
@@ -22,6 +26,10 @@ export const configure = (newConfig: Partial<Config>) => {
     });
 };
 
+export const registerCustomKeysets = (language: string, data: KeysetData) => {
+    i18n.registerKeysets(language, data);
+};
+
 export const subscribeConfigure = (sub: Subscriber) => {
     subs.push(sub);