ЯсноПонятно24

Практикум Привет! Это поддержка Практикума 👋 Если что-то не получается — постараемся помочь. Пишите в чат или выберите другой способ связи Сб, 23 марта в 13:59 Добрый день. Вчера меня должны были перевести в когорту, которая стартовала раньше моей текущей когорты на 2 недели раньше. Платеж вчера прошел досрочный. Но доступ к материалам так и не открыли.13:59 Мы уже начали заниматься вашим вопросом, ответим в ближайшее время Прошу открыть доступ к материалам курса13:59 Как можно быстрее...Менеджеру написала утром... , но пока она не отвечает (возможно из-за выходного)...14:00 Мы с ней обговаривали, что на сл. неделе перевод уже делать бессмысленно ... потому что время уходит, 3 спринт у новой когорты уже с понедельника идет...14:01 Если не откроете доступ сейчас.. , а только в понедельник, прошу оставить меня тогда в текущей когорте...14:03 Практикум Добрый день! Подскажите, пожалуйста, ФИО менеджера, с которым вы разговаривали по поводу перевода :)14:19 Екатерина Казимирова14:24 Практикум Большое спасибо за информацию. Рекомендуем обратиться с этим вопросом к вашему куратору, он обязательно разберётся в ситуации и поможет найти решение :)14:39 Это называется, спасибо, что "не помогли"... я с куратором нашим и общалась... в чем вообще у вас смысл техподдержки14:46 ПрактикумНам жаль, что мы не можем вам помочь. Это организационный вопрос с переводом, за который ответственен куратор. 14:55 Выбрать способ связи Обзор тренажера Задайте вопрос YandexGPT Открыть виджет юзера Пригласить друзей Мои курсы index.tsx withAuth.tsx 27282425261617181920212223456789101112131415123 import './styles.css'; import {useState} from 'react'; import {ShareButton} from '../components/ShareButton/ShareButton'; import {LikeButton} from '../components/LikeButton/LikeButton'; export const App = () => { const [isAuth, setIsAuth] = useState<boolean>(false); const toggleLogin = () => { setIsAuth(!isAuth); …} В этом тренажёре вы потренируетесь использовать HOC для того, чтобы не дублировать одну логику в нескольких компонентах. Перед нам небольшая карточка с текстом, а под ней две кнопки Поставить лайк и Поделиться. Эти кнопки доступны, если человек авторизовался. В ином случае вместо них отображается сообщение Необходима авторизация. Чтобы авторизоваться, есть кнопка Войти . Таким образом, в коде у нас есть: Компонент LikeButton. Через props он получает статус авторизации isAuth, в зависимости от которого либо отображает кнопку Поставить лайк или сообщение needAuthText. Компонент ShareButton. Его поведение почти полностью идентично LikeButton , за исключением обработчика onClick. Компонент App. Он использует LikeButton и ShareButton , передавая в них статус авторизации и сообщение о ее необходимости. Вам нужно вынести логику проверки авторизации из LikeButton и ShareButton в HOC, для этого необходимо: Создать папку /src/hocs. В этой папке создать файл withAuth.tsx. В этом файле необходимо создать функцию-HOC withAuthButton. В компоненте App нужно с помощью withAuthButton создать два компонента WithAuthShareButton и WithAuthLikeButton. Их нужно использовать вместо ShareButton и LikeButton для отображения кнопок Поделиться и Поставить лайк.