@nualang/nualang-ui-components 0.1.1371 → 0.1.1372

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -104,7 +104,8 @@ function Exercise({
104
104
  const [roleplaysOpen, setRoleplaysOpen] = useState(noRoleplays ? false : true);
105
105
  const noBots = name.toLowerCase() === "bots" && bots?.length === 0;
106
106
  const [botsOpen, setBotsOpen] = useState(noBots ? false : true);
107
- const [phraseListsOpen, setPhraseListsOpen] = useState(phraseLists && phraseLists.length > 0 ? true : false);
107
+ // Phrase lists aren't currently available to check during the first render so using the phrases instead
108
+ const [phraseListsOpen, setPhraseListsOpen] = useState(phrases && phrases.length > 0 ? true : false);
108
109
  const navigate = useNavigate();
109
110
  const params = useParams();
110
111
  const {
@@ -11,9 +11,7 @@ function getSteps() {
11
11
  function CreateTopic({
12
12
  t = text => text,
13
13
  onSubmit,
14
- handleSpeak,
15
14
  difficulties = ["A1", "A2", "B1", "B2", "C1", "C2"],
16
- voices = {},
17
15
  initialValues = {
18
16
  topicName: "",
19
17
  description: "",
@@ -34,8 +32,7 @@ function CreateTopic({
34
32
  fileSizeLimit,
35
33
  subscription = {
36
34
  isUpgradePossible: true
37
- },
38
- isUserInternal
35
+ }
39
36
  }) {
40
37
  const difficultyOptions = difficulties.map((d, idx) => {
41
38
  const keyId = `cretopicx_${randomId()}${idx}`;
@@ -50,12 +47,9 @@ function CreateTopic({
50
47
  onSubmit: onSubmit,
51
48
  t: t,
52
49
  difficultyOptions: difficultyOptions,
53
- handleSpeak: handleSpeak,
54
50
  learnLang: learnLang,
55
51
  fileSizeLimit: fileSizeLimit,
56
- subscription: subscription,
57
- voiceOptions: voices,
58
- isUserInternal: isUserInternal
52
+ subscription: subscription
59
53
  });
60
54
  }
61
55
  CreateTopic.propTypes = {};
@@ -1,8 +1,6 @@
1
- import { useEffect, useMemo } from "react";
2
1
  import { Grid, FormControl, FormControlLabel, FormLabel, Radio, RadioGroup, Typography, Tooltip } from "@mui/material";
3
2
  import { makeStyles } from "tss-react/mui";
4
3
  import * as Yup from "yup";
5
- import VoiceSelector from "../../../../Forms/VoiceSelector/VoiceSelector";
6
4
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
7
5
  const useStyles = makeStyles()(theme => ({
8
6
  group: {
@@ -16,72 +14,22 @@ function TopicSettings({
16
14
  errors,
17
15
  handleChange,
18
16
  handleBlur,
19
- subscription,
20
- learnLang,
21
- voiceOptions = {},
22
- handleSpeak,
23
- isUserInternal
17
+ subscription
24
18
  }) {
25
- const voicesArray = useMemo(() => {
26
- return Object.entries(voiceOptions).flatMap(([key, dialect]) => {
27
- if (!dialect?.voiceOptions || !Array.isArray(dialect.voiceOptions)) {
28
- return [];
29
- }
30
- return dialect.voiceOptions.filter(voice => voice?.name) // Validate required properties
31
- .map(voice => ({
32
- voice,
33
- dialect,
34
- key
35
- }));
36
- });
37
- }, [voiceOptions]);
38
19
  const {
39
20
  classes
40
21
  } = useStyles();
41
22
  const {
42
- visibility,
43
- shuffleEnabled,
44
- voice,
45
- voicePitch,
46
- voiceLanguageCode
23
+ visibility
47
24
  } = values;
48
- useEffect(() => {
49
- if (!voicesArray.length) {
50
- return;
51
- }
52
- const randomIndex = Math.floor(Math.random() * voicesArray.length);
53
- const randomVoiceObj = voicesArray[randomIndex];
54
- const {
55
- voice: randomVoice,
56
- dialect
57
- } = randomVoiceObj;
58
- let mounted = true;
59
- if (mounted && !values.voice) {
60
- handleChange({
61
- target: {
62
- name: "voice",
63
- value: randomVoice.name
64
- }
65
- });
66
- handleChange({
67
- target: {
68
- name: "voiceLanguageCode",
69
- value: dialect.languageCode
70
- }
71
- });
72
- }
73
- return () => {
74
- mounted = false;
75
- };
76
- }, [voicesArray, handleChange]);
77
25
  return /*#__PURE__*/_jsx(_Fragment, {
78
- children: /*#__PURE__*/_jsxs(Grid, {
26
+ children: /*#__PURE__*/_jsx(Grid, {
79
27
  container: true,
80
28
  sx: {
81
29
  width: "100%"
82
30
  },
83
31
  spacing: 2,
84
- children: [/*#__PURE__*/_jsx(Grid, {
32
+ children: /*#__PURE__*/_jsx(Grid, {
85
33
  size: 12,
86
34
  children: /*#__PURE__*/_jsxs(FormControl, {
87
35
  component: "fieldset",
@@ -121,117 +69,13 @@ function TopicSettings({
121
69
  })]
122
70
  })]
123
71
  })
124
- }), /*#__PURE__*/_jsx(Grid, {
125
- size: 12,
126
- children: /*#__PURE__*/_jsxs(FormControl, {
127
- component: "fieldset",
128
- children: [/*#__PURE__*/_jsx(FormLabel, {
129
- component: "legend",
130
- children: t("shuffle_phrases")
131
- }), /*#__PURE__*/_jsx(Typography, {
132
- color: "textSecondary",
133
- children: t("shuffle_phrases_desc")
134
- }), /*#__PURE__*/_jsxs(RadioGroup, {
135
- row: true,
136
- "aria-label": "shuffleEnabled",
137
- name: "shuffleEnabled",
138
- value: shuffleEnabled,
139
- onChange: handleChange,
140
- onBlur: handleBlur,
141
- helperText: touched.shuffleEnabled ? errors.shuffleEnabled : "",
142
- error: touched.shuffleEnabled && Boolean(errors.shuffleEnabled),
143
- children: [/*#__PURE__*/_jsx(FormControlLabel, {
144
- value: "enabled",
145
- control: /*#__PURE__*/_jsx(Radio, {}),
146
- label: t("enabled")
147
- }), /*#__PURE__*/_jsx(FormControlLabel, {
148
- value: "disabled",
149
- control: /*#__PURE__*/_jsx(Radio, {}),
150
- label: t("disabled")
151
- })]
152
- })]
153
- })
154
- }), learnLang !== "irish" && /*#__PURE__*/_jsxs(Grid, {
155
- size: 12,
156
- children: [/*#__PURE__*/_jsx(Typography, {
157
- gutterBottom: true,
158
- children: t("topic_voice_desc")
159
- }), /*#__PURE__*/_jsx(VoiceSelector, {
160
- id: "voice",
161
- name: "voice",
162
- "data-cy": "voice",
163
- margin: "normal",
164
- variant: "outlined",
165
- fullWidth: true,
166
- required: learnLang !== "irish",
167
- t: t,
168
- voices: voiceOptions,
169
- label: t("topic_voice"),
170
- value: voice,
171
- onChange: e => {
172
- if (e && e.target && e.target.value) {
173
- handleChange(e);
174
- const voiceSelected = e.target.value;
175
- const voiceOptionElem = document.getElementById(`voice-${voiceSelected}`);
176
- const languageCode = voiceOptionElem.getAttribute("data-language-code");
177
- handleChange({
178
- target: {
179
- name: "voice",
180
- value: voiceSelected
181
- }
182
- });
183
- handleSpeak({
184
- text: voiceSelected,
185
- learnLanguage: learnLang,
186
- voiceName: voiceSelected,
187
- languageCode
188
- });
189
- handleChange({
190
- target: {
191
- name: "voiceLanguageCode",
192
- value: languageCode
193
- }
194
- });
195
- handleChange({
196
- target: {
197
- name: "voicePitch",
198
- value: ""
199
- }
200
- });
201
- }
202
- },
203
- onVoicePitchChange: e => {
204
- if (e && e.target) {
205
- handleChange(e);
206
- handleSpeak({
207
- text: voiceLanguageCode ? t("voice_pitch_example", {
208
- name: voice,
209
- lng: voiceLanguageCode?.substring(0, 2)
210
- }) : voice,
211
- learnLanguage: learnLang,
212
- voiceName: voice,
213
- languageCode: voiceLanguageCode,
214
- pitch: e.target.value
215
- });
216
- }
217
- },
218
- onBlur: handleBlur,
219
- helperText: touched.voice ? errors.voice : "",
220
- error: touched.voice && Boolean(errors.voice),
221
- voicePitch: voicePitch,
222
- isUserInternal: isUserInternal
223
- })]
224
- })]
72
+ })
225
73
  })
226
74
  });
227
75
  }
228
76
  TopicSettings.propTypes = {};
229
77
  TopicSettings.label = "topic_settings";
230
78
  TopicSettings.validationSchema = Yup.object().shape({
231
- visibility: Yup.string().required("required"),
232
- shuffleEnabled: Yup.string().nullable(),
233
- voice: Yup.string().nullable(),
234
- voiceLanguageCode: Yup.string().nullable(),
235
- voicePitch: Yup.string().nullable()
79
+ visibility: Yup.string().required("required")
236
80
  });
237
81
  export default TopicSettings;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nualang/nualang-ui-components",
3
- "version": "0.1.1371",
3
+ "version": "0.1.1372",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "files": [