@peassoft/mnr-web-topline 4.0.1 → 4.1.0

package/dist/en/modules/ui-lang/index.d.ts

@@ -1,8 +1,4 @@
-import type { NonEmptyArray } from '../../types/helpers.js';
-type UiLangDescriptor = {
-    code: string;
-    name: string;
-};
-export declare function getSupportedUiLangs(): NonEmptyArray<UiLangDescriptor>;
-export declare function getDefaultUiLangForUser(): UiLangDescriptor;
-export {};
+import { type SupportedLanguage } from '@peassoft/mnr-langs';
+import type { ToplineUser } from '../../types/data.js';
+export declare function getPageLang(): SupportedLanguage;
+export declare function getInitialUiLang(user: ToplineUser): string;

package/dist/en/modules/ui-lang/index.js

@@ -1,20 +1,8 @@
-const supportedUiLangs = [{
-  code: 'en',
-  name: 'English'
-}, {
-  code: 'ru',
-  name: 'Русский'
-}];
-export function getSupportedUiLangs() {
-  return window.structuredClone(supportedUiLangs);
+import { defaultLanguage, validateLanguage } from '@peassoft/mnr-langs';
+export function getPageLang() {
+  const currPageLang = document.querySelector('html')?.lang;
+  return validateLanguage(currPageLang) || defaultLanguage;
 }
-export function getDefaultUiLangForUser() {
-  for (const lang of window.navigator.languages) {
-    const normalizedLangCode = lang.slice(0, 2).toLowerCase();
-    const matchedDescriptor = supportedUiLangs.find(x => x.code === normalizedLangCode);
-    if (matchedDescriptor) {
-      return window.structuredClone(matchedDescriptor);
-    }
-  }
-  return supportedUiLangs[0];
+export function getInitialUiLang(user) {
+  return user.uiLang ?? getPageLang();
 }

package/dist/en/parts/profile/ui/root/has-changes.js

@@ -1,5 +1,5 @@
 import getInitialUserName from './get-initial-user-name.js';
-import getInitialUiLang from './get-initial-ui-lang.js';
+import { getInitialUiLang } from '../../../../modules/ui-lang/index.js';
 export default function hasChanges(user, currData) {
   if (getInitialUserName(user) !== currData.userName) {
     return true;

package/dist/en/parts/profile/ui/root/index.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useMemo, useCallback } from 'react';
+import { supportedLanguagesDescriptors } from '@peassoft/mnr-langs';
 import { InputField } from '@peassoft/mnr-web-ui-kit/input-field/index.js';
 import { Select } from '@peassoft/mnr-web-ui-kit/select/index.js';
 import { TextButton } from '@peassoft/mnr-web-ui-kit/text-button/index.js';
 import { Button } from '@peassoft/mnr-web-ui-kit/button/index.js';
 import { ErrorMessage } from '@peassoft/mnr-web-ui-kit/error-message/index.js';
 import { createUserDataChangeBeacon } from '../../../../modules/user-data-change-beacon/index.js';
-import { getSupportedUiLangs } from '../../../../modules/ui-lang/index.js';
 import { updateUser } from '../../../../modules/local-db/index.js';
 import { innerToplineService, ToplineEventName } from '../../../../modules/topline-service/index.js';
 import saveUserData from '../../actions/save-user-data/index.js';
+import { getInitialUiLang } from '../../../../modules/ui-lang/index.js';
 import getInitialUserName from './get-initial-user-name.js';
-import getInitialUiLang from './get-initial-ui-lang.js';
 import hasChanges from './has-changes.js';
 export default function Root(props) {
   const {
@@ -23,7 +23,7 @@ export default function Root(props) {
   const [uiLang, setUiLang] = useState(getInitialUiLang(user));
   const [isInProgress, setIsInProgress] = useState(false);
   const [hasSavingError, setHasSavingError] = useState(false);
-  const uiLangOptions = useMemo(() => getSupportedUiLangs().map(langDescriptor => ({
+  const uiLangOptions = useMemo(() => supportedLanguagesDescriptors().map(langDescriptor => ({
     id: langDescriptor.code,
     value: langDescriptor.name
   })), []);

package/dist/en/parts/signup/actions/perform-signup/index.d.ts

@@ -1,9 +1,10 @@
+import type { SupportedLanguage } from '@peassoft/mnr-langs';
 import type { ToplineUser } from '../../../../types/data.js';
 export type UserData = {
     email: string;
     password: string;
     userName?: string;
-    uiLang?: string;
+    uiLang: SupportedLanguage;
 };
 export type ReturnValue = {
     user: ToplineUser | null;

package/dist/en/parts/signup/ui/signup/index.js

@@ -1,14 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useContext, useState, useCallback, useEffect, createRef } from 'react';
+import { useContext, useState, useCallback, useMemo, useEffect, createRef } from 'react';
+import { supportedLanguagesDescriptors } from '@peassoft/mnr-langs';
 import Modal from '../../../../shared/components/modal/index.js';
 import Alternative from '../../../../shared/components/alternative/index.js';
 import { InputField } from '@peassoft/mnr-web-ui-kit/input-field/index.js';
 import { Button } from '@peassoft/mnr-web-ui-kit/button/index.js';
 import { ErrorMessage } from '@peassoft/mnr-web-ui-kit/error-message/index.js';
+import { Select } from '@peassoft/mnr-web-ui-kit/select/index.js';
 import { ToplineContext } from '../../../shell/index.js';
 import { globalRefs } from '../../../../modules/focus-marshal/index.js';
 import validateEmail from '../../../../modules/validators/email.js';
 import validatePassword from '../../../../modules/validators/password.js';
+import { getPageLang } from '../../../../modules/ui-lang/index.js';
 import performSignup from '../../actions/perform-signup/index.js';
 export default function Signup(props) {
   const {
@@ -20,6 +23,7 @@ export default function Signup(props) {
   const [email, setEmail] = useState('');
   const [isEmailValid, setIsEmailValid] = useState(true);
   const [userName, setUserName] = useState('');
+  const [uiLang, setUiLang] = useState(getPageLang());
   const [password, setPassword] = useState('');
   const [isPasswordValid, setIsPasswordValid] = useState(true);
   const [passwordConfirmation, setPasswordConfirmation] = useState('');
@@ -29,8 +33,13 @@ export default function Signup(props) {
   const {
     handleUserChange
   } = useContext(ToplineContext);
+  const uiLangOptions = useMemo(() => supportedLanguagesDescriptors().map(langDescriptor => ({
+    id: langDescriptor.code,
+    value: langDescriptor.name
+  })), []);
   const handleEmailChange = useCallback(newValue => setEmail(newValue.trim()), []);
   const handleUserNameChange = useCallback(newValue => setUserName(newValue), []);
+  const handleUiLangChange = useCallback(val => setUiLang(val), []);
   const handlePasswordChange = useCallback(newValue => setPassword(newValue.trim()), []);
   const handlePasswordConfirmationChange = useCallback(newValue => setPasswordConfirmation(newValue.trim()), []);
   const handleEmailBlur = useCallback(() => setIsEmailValid(validateEmail(email)), [email]);
@@ -58,7 +67,7 @@ export default function Signup(props) {
       ...(userName ? {
         userName: userName.trim()
       } : {}),
-      uiLang: document.documentElement.lang
+      uiLang
     };
     const {
       user,
@@ -80,7 +89,7 @@ export default function Signup(props) {
       default:
         throw new Error('Unknown error of a login request');
     }
-  }, [email, password, passwordConfirmation, userName, onClose, handleUserChange]);
+  }, [email, uiLang, password, passwordConfirmation, userName, onClose, handleUserChange]);
   const handleTabOnLastElement = useCallback(() => globalRefs.modalFirstItem.current?.focus(), []);
   const handleShiftTabOnFirstElement = useCallback(() => lastElementRef.current?.focus(), [lastElementRef]);
   useEffect(() => globalRefs.modalFirstItem.current?.focus(), []);
@@ -107,6 +116,11 @@ export default function Signup(props) {
         label: "Your name",
         value: userName,
         onChange: handleUserNameChange
+      }), _jsx(Select, {
+        label: "Preferred language for user interface",
+        items: uiLangOptions,
+        selectedItemId: uiLang,
+        onChange: handleUiLangChange
       }), _jsx(InputField, {
         type: 'password',
         autocompleteAttribute: 'new-password',

package/dist/ru/modules/ui-lang/index.d.ts

@@ -1,8 +1,4 @@
-import type { NonEmptyArray } from '../../types/helpers.js';
-type UiLangDescriptor = {
-    code: string;
-    name: string;
-};
-export declare function getSupportedUiLangs(): NonEmptyArray<UiLangDescriptor>;
-export declare function getDefaultUiLangForUser(): UiLangDescriptor;
-export {};
+import { type SupportedLanguage } from '@peassoft/mnr-langs';
+import type { ToplineUser } from '../../types/data.js';
+export declare function getPageLang(): SupportedLanguage;
+export declare function getInitialUiLang(user: ToplineUser): string;

package/dist/ru/modules/ui-lang/index.js

@@ -1,20 +1,8 @@
-const supportedUiLangs = [{
-  code: 'en',
-  name: 'English'
-}, {
-  code: 'ru',
-  name: 'Русский'
-}];
-export function getSupportedUiLangs() {
-  return window.structuredClone(supportedUiLangs);
+import { defaultLanguage, validateLanguage } from '@peassoft/mnr-langs';
+export function getPageLang() {
+  const currPageLang = document.querySelector('html')?.lang;
+  return validateLanguage(currPageLang) || defaultLanguage;
 }
-export function getDefaultUiLangForUser() {
-  for (const lang of window.navigator.languages) {
-    const normalizedLangCode = lang.slice(0, 2).toLowerCase();
-    const matchedDescriptor = supportedUiLangs.find(x => x.code === normalizedLangCode);
-    if (matchedDescriptor) {
-      return window.structuredClone(matchedDescriptor);
-    }
-  }
-  return supportedUiLangs[0];
+export function getInitialUiLang(user) {
+  return user.uiLang ?? getPageLang();
 }

package/dist/ru/parts/profile/ui/root/has-changes.js

@@ -1,5 +1,5 @@
 import getInitialUserName from './get-initial-user-name.js';
-import getInitialUiLang from './get-initial-ui-lang.js';
+import { getInitialUiLang } from '../../../../modules/ui-lang/index.js';
 export default function hasChanges(user, currData) {
   if (getInitialUserName(user) !== currData.userName) {
     return true;

package/dist/ru/parts/profile/ui/root/index.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useMemo, useCallback } from 'react';
+import { supportedLanguagesDescriptors } from '@peassoft/mnr-langs';
 import { InputField } from '@peassoft/mnr-web-ui-kit/input-field/index.js';
 import { Select } from '@peassoft/mnr-web-ui-kit/select/index.js';
 import { TextButton } from '@peassoft/mnr-web-ui-kit/text-button/index.js';
 import { Button } from '@peassoft/mnr-web-ui-kit/button/index.js';
 import { ErrorMessage } from '@peassoft/mnr-web-ui-kit/error-message/index.js';
 import { createUserDataChangeBeacon } from '../../../../modules/user-data-change-beacon/index.js';
-import { getSupportedUiLangs } from '../../../../modules/ui-lang/index.js';
 import { updateUser } from '../../../../modules/local-db/index.js';
 import { innerToplineService, ToplineEventName } from '../../../../modules/topline-service/index.js';
 import saveUserData from '../../actions/save-user-data/index.js';
+import { getInitialUiLang } from '../../../../modules/ui-lang/index.js';
 import getInitialUserName from './get-initial-user-name.js';
-import getInitialUiLang from './get-initial-ui-lang.js';
 import hasChanges from './has-changes.js';
 export default function Root(props) {
   const {
@@ -23,7 +23,7 @@ export default function Root(props) {
   const [uiLang, setUiLang] = useState(getInitialUiLang(user));
   const [isInProgress, setIsInProgress] = useState(false);
   const [hasSavingError, setHasSavingError] = useState(false);
-  const uiLangOptions = useMemo(() => getSupportedUiLangs().map(langDescriptor => ({
+  const uiLangOptions = useMemo(() => supportedLanguagesDescriptors().map(langDescriptor => ({
     id: langDescriptor.code,
     value: langDescriptor.name
   })), []);

package/dist/ru/parts/signup/actions/perform-signup/index.d.ts

@@ -1,9 +1,10 @@
+import type { SupportedLanguage } from '@peassoft/mnr-langs';
 import type { ToplineUser } from '../../../../types/data.js';
 export type UserData = {
     email: string;
     password: string;
     userName?: string;
-    uiLang?: string;
+    uiLang: SupportedLanguage;
 };
 export type ReturnValue = {
     user: ToplineUser | null;

package/dist/ru/parts/signup/ui/signup/index.js

@@ -1,14 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useContext, useState, useCallback, useEffect, createRef } from 'react';
+import { useContext, useState, useCallback, useMemo, useEffect, createRef } from 'react';
+import { supportedLanguagesDescriptors } from '@peassoft/mnr-langs';
 import Modal from '../../../../shared/components/modal/index.js';
 import Alternative from '../../../../shared/components/alternative/index.js';
 import { InputField } from '@peassoft/mnr-web-ui-kit/input-field/index.js';
 import { Button } from '@peassoft/mnr-web-ui-kit/button/index.js';
 import { ErrorMessage } from '@peassoft/mnr-web-ui-kit/error-message/index.js';
+import { Select } from '@peassoft/mnr-web-ui-kit/select/index.js';
 import { ToplineContext } from '../../../shell/index.js';
 import { globalRefs } from '../../../../modules/focus-marshal/index.js';
 import validateEmail from '../../../../modules/validators/email.js';
 import validatePassword from '../../../../modules/validators/password.js';
+import { getPageLang } from '../../../../modules/ui-lang/index.js';
 import performSignup from '../../actions/perform-signup/index.js';
 export default function Signup(props) {
   const {
@@ -20,6 +23,7 @@ export default function Signup(props) {
   const [email, setEmail] = useState('');
   const [isEmailValid, setIsEmailValid] = useState(true);
   const [userName, setUserName] = useState('');
+  const [uiLang, setUiLang] = useState(getPageLang());
   const [password, setPassword] = useState('');
   const [isPasswordValid, setIsPasswordValid] = useState(true);
   const [passwordConfirmation, setPasswordConfirmation] = useState('');
@@ -29,8 +33,13 @@ export default function Signup(props) {
   const {
     handleUserChange
   } = useContext(ToplineContext);
+  const uiLangOptions = useMemo(() => supportedLanguagesDescriptors().map(langDescriptor => ({
+    id: langDescriptor.code,
+    value: langDescriptor.name
+  })), []);
   const handleEmailChange = useCallback(newValue => setEmail(newValue.trim()), []);
   const handleUserNameChange = useCallback(newValue => setUserName(newValue), []);
+  const handleUiLangChange = useCallback(val => setUiLang(val), []);
   const handlePasswordChange = useCallback(newValue => setPassword(newValue.trim()), []);
   const handlePasswordConfirmationChange = useCallback(newValue => setPasswordConfirmation(newValue.trim()), []);
   const handleEmailBlur = useCallback(() => setIsEmailValid(validateEmail(email)), [email]);
@@ -58,7 +67,7 @@ export default function Signup(props) {
       ...(userName ? {
         userName: userName.trim()
       } : {}),
-      uiLang: document.documentElement.lang
+      uiLang
     };
     const {
       user,
@@ -80,7 +89,7 @@ export default function Signup(props) {
       default:
         throw new Error('Unknown error of a login request');
     }
-  }, [email, password, passwordConfirmation, userName, onClose, handleUserChange]);
+  }, [email, uiLang, password, passwordConfirmation, userName, onClose, handleUserChange]);
   const handleTabOnLastElement = useCallback(() => globalRefs.modalFirstItem.current?.focus(), []);
   const handleShiftTabOnFirstElement = useCallback(() => lastElementRef.current?.focus(), [lastElementRef]);
   useEffect(() => globalRefs.modalFirstItem.current?.focus(), []);
@@ -107,6 +116,11 @@ export default function Signup(props) {
         label: "Ваше имя",
         value: userName,
         onChange: handleUserNameChange
+      }), _jsx(Select, {
+        label: "Предпочитаемый язык для пользовательского интерфейса",
+        items: uiLangOptions,
+        selectedItemId: uiLang,
+        onChange: handleUiLangChange
       }), _jsx(InputField, {
         type: 'password',
         autocompleteAttribute: 'new-password',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@peassoft/mnr-web-topline",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "Peassoft Topline widget for mem'n'rev web applications",
   "type": "module",
   "exports": {
@@ -42,7 +42,7 @@
     "@vitejs/plugin-react": "^5.1.4",
     "autoprefixer": "^10.3.4",
     "clean-webpack-plugin": "^4.0.0",
-    "copy-webpack-plugin": "^13.0.0",
+    "copy-webpack-plugin": "^14.0.0",
     "cpy-cli": "^7.0.0",
     "css-loader": "^7.1.2",
     "eslint": "^9.8.0",
@@ -67,6 +67,7 @@
   },
   "dependencies": {
     "@memnrev/web-error": "^0.4.1",
+    "@peassoft/mnr-langs": "^1.2.0",
     "email-validator": "^2.0.4",
     "md5": "^2.3.0",
     "react-error-boundary": "^6.0.0",

package/dist/en/parts/profile/ui/root/get-initial-ui-lang.d.ts

@@ -1,2 +0,0 @@
-import type { ToplineUser } from '../../../../types/data.js';
-export default function getInitialUiLang(user: ToplineUser): string;

package/dist/en/parts/profile/ui/root/get-initial-ui-lang.js

@@ -1,4 +0,0 @@
-import { getDefaultUiLangForUser } from '../../../../modules/ui-lang/index.js';
-export default function getInitialUiLang(user) {
-  return user.uiLang ?? getDefaultUiLangForUser().code;
-}

package/dist/ru/parts/profile/ui/root/get-initial-ui-lang.d.ts

@@ -1,2 +0,0 @@
-import type { ToplineUser } from '../../../../types/data.js';
-export default function getInitialUiLang(user: ToplineUser): string;

package/dist/ru/parts/profile/ui/root/get-initial-ui-lang.js

@@ -1,4 +0,0 @@
-import { getDefaultUiLangForUser } from '../../../../modules/ui-lang/index.js';
-export default function getInitialUiLang(user) {
-  return user.uiLang ?? getDefaultUiLangForUser().code;
-}