Нужно создать папки: src/containers/Words/Word, src/containers/Words/Word/Details, src/containers/Words/Word/Option.
В каждой из низ нужен index.js файл для создания соответствующих компонентов.
Начнем с компонента Option. Он должен возвращать элемент Text.
Если свойство detailsKey не равно examples или defs:
- стили элемента:
fontSize-14,color-colors.black,fontFamily-RobotoRegular,textDecorationLine:underline;
внутренний текст - свойствоoptionкомпонента;
в конце внутреннего теста,, если свойствоlastOptionне равняетсяtrue.
В другом случае логика отображения будет несколько другой.
Для этого в папке Option создай файл helpers.js и экспортируй из него функцию optionTransform.
Эта функция принимает два аргумента: строк option и word. option должна быть разбита на массив.
Разбиение должно быть таким образом, что бы каждое вхождение word в option было отдельным элементом.
После надо каждое вхождение word в этом массиве обернуть элементом Text с fontFamily - RobotoBold
Если свойство detailsKey равно examples или defs:
- стили элемента:
fontSize-14,color-colors.black,fontFamily-RobotoRegular; - внутренний текст - результат вызова
optionTransformсо свойствамиoptionиword; - перед внутренним текстом нужно добавить
-.
Эта задача — часть курса по Full-Stack JavaScript.
Ты можешь задать свой вопрос в комментариях под постом.
Если ты уже решил задачу, то не стесняйся помочь другим.