@kindly/react-chat 2.38.4 → 2.38.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kindly/react-chat",
-  "version": "2.38.4",
+  "version": "2.38.6",
   "description": "Kindly Chat react component",
   "repository": "https://github.com/kindly-ai/kindly-chat/tree/main/packages/react-chat",
   "main": "dist/index.js",
@@ -54,7 +54,7 @@
     "redux-logger": "^3.0.6",
     "redux-thunk": "^2.3.0",
     "styled-components": "^5.3.1",
-    "uuid": "3.3.3"
+    "uuid": "^9.0.0"
   },
   "peerDependencies": {
     "pusher-js": ">=5.0.0",
@@ -126,5 +126,5 @@
     "silent": true,
     "webpackConfig": "./webpack.config.js"
   },
-  "gitHead": "916badf6d815a6b599ac35f76145d9193357d8aa"
+  "gitHead": "382718e0dde03cfb6361fb4273796cebdabf089e"
 }

package/stories/screens.stories/Options.stories.jsx

@@ -67,19 +67,105 @@ WithLanguageChoice.parameters = {
   },
 };
 
+const availableLanguages = [
+  {
+    code: 'en',
+    name: 'English',
+    active: true,
+  },
+  {
+    code: 'nb',
+    name: 'Norsk (bokmål)',
+    active: true,
+  },
+  {
+    code: 'aa',
+    name: 'Afar',
+    active: true,
+  },
+  {
+    code: 'af',
+    name: 'Afrikaans',
+    active: true,
+  },
+  {
+    code: 'ak',
+    name: 'Akana',
+    active: true,
+  },
+  {
+    code: 'an',
+    name: 'Aragonés',
+    active: true,
+  },
+  {
+    code: 'ar',
+    name: 'العربية',
+    active: true,
+  },
+  {
+    code: 'yi',
+    name: 'ייִדיש',
+    active: true,
+  },
+  {
+    code: 'yo',
+    name: 'Yorùbá',
+    active: true,
+  },
+  {
+    code: 'za',
+    name: 'Cuengh / Tôô / 壮语',
+    active: true,
+  },
+  {
+    code: 'zu',
+    name: 'isiZulu',
+    active: true,
+  },
+];
+
 export const LanguageChoice = Template.bind({});
-LanguageChoice.parameters = WithLanguageChoice.parameters;
+LanguageChoice.args = {
+  languageQuantity: 10,
+  initialStateModifierFromArgs: ({ languageQuantity }) => ({
+    chatbubble: {
+      active: true,
+      chatHasStarted: true,
+      currentLanguage: 'en',
+      optionsScreenOpen: true,
+    },
+    bot: {
+      languages: availableLanguages.slice(0, languageQuantity),
+    },
+  }),
+};
+LanguageChoice.argTypes = {
+  languageQuantity: {
+    control: { type: 'range', min: 2, max: availableLanguages.length - 1, step: 1 },
+  },
+};
+LanguageChoice.parameters = {
+  botSettings: {
+    ...defaultBotSettings,
+  },
+};
 LanguageChoice.play = async () => {
   const languageButton = await screen.findByText(defaultBotSettings.text.change_language_button.en);
   await userEvent.click(languageButton);
 };
 
 export const LanguageChoiceConfirm = Template.bind({});
-LanguageChoiceConfirm.parameters = WithLanguageChoice.parameters;
+LanguageChoiceConfirm.args = {
+  ...LanguageChoice.args,
+  languageQuantity: 2,
+};
+LanguageChoiceConfirm.argTypes = LanguageChoice.argTypes;
+LanguageChoiceConfirm.parameters = LanguageChoice.parameters;
 LanguageChoiceConfirm.play = async () => {
   const languageButton = await screen.findByText(defaultBotSettings.text.change_language_button.en);
   await userEvent.click(languageButton);
-  const norskButton = await screen.findByText(LanguageChoiceConfirm.parameters.botSettings.languages[1].name);
+  const norskButton = await screen.findByText(availableLanguages[1].name);
   await userEvent.click(norskButton);
 };