Теперь добавим компонент, который будет элементом списка Lists.
Добавим его в папке src/containers/Lists/List.
Сначала добавим вспомогательный метод getWordsCount в файле src/containers/Lists/List/helpers.js.
Это метод первым аргументом будет получать список слов, а вторым - имя списка.
Возвращать он должен количество слов, у которых поле listKey равняется переданному имени списка.
Компонент List должен возвращать TouchableOpacity со стилями: backgroundColor - colors.white,
flexDirection - row, height - 55, borderRadius - 5, marginVertical - 7, marginHorizontal - 16,
paddingHorizontal - 10, shadowOpacity - 0.4, shadowRadius - 3, shadowOffset - {width: 0, height: 1},
shadowColor - colors.black, elevation - 3, borderWidth - 0.
У TouchableOpacity должно быть два дочерних элемента View - левая и правая часть.
Левая со стилями flex - 8, justifyContent - center и двумя дочерними элементами Text.
Первый Text должен отображать свойство listKey со стилями: fontSize - 16, color - colors.black, fontFamily - RobotoRegular.
Второй Text должен отображать moment свойства createAt в формате DD.MM.YYYY. Стили:
fontSize - 10, color - colors.blackOpacity80, fontFamily - RobotoRegular, fontWeight - 300, marginTop - 4.
Стили правой части: flex - 8, flexDirection - row, justifyContent - flex-end, alignItems - center,
Первый элемент правой части - компонент Icon со свойствами name - pencil и color - colors.blue.
Второй элемент правой части - текст, отображающий результат вызова getWordsCount со свойствами words и listKey.
Стили этой части fontSize - 15, color - colors.blue, fontFamily - RobotoRegular, marginLeft - 6.
Эта задача — часть курса по Full-Stack JavaScript.
Ты можешь задать свой вопрос в комментариях под постом.
Если ты уже решил задачу, то не стесняйся помочь другим.