Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/category on main page #180

Merged
merged 8 commits into from
Dec 26, 2023
Merged

Conversation

jsapro
Copy link
Collaborator

@jsapro jsapro commented Dec 24, 2023

#179
change old catalog component on main page to new one

@jsapro jsapro requested a review from Karmyshkov December 24, 2023 19:43
@jsapro jsapro self-assigned this Dec 24, 2023
@jsapro jsapro merged commit 138cb73 into develop Dec 26, 2023
4 checks passed
@jsapro jsapro deleted the feature/category-on-main-page branch December 26, 2023 13:12

const findNumbersToShow = useCallback(() => {
if (isMobileScreen) {
setNumberToShow(6);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Можно return вместе с сеттером написать:

Suggested change
setNumberToShow(6);
return setNumberToShow(6);

};

useEffect(() => {
api.categoriesList().then((categories) => setCategories(categories));
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Можно сократить:

Suggested change
api.categoriesList().then((categories) => setCategories(categories));
api.categoriesList().then(setCategories);

return (
<>
<div className={styles.link}>
<TitleArrowLink title="Каталог" link="/catalog/" />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Чтобы не плодить обертки у компонента "TitleArrowLink" можно добавить props classnames и получить что-то вроде этого:

Suggested change
<TitleArrowLink title="Каталог" link="/catalog/" />
<TitleArrowLink title="Каталог" link="/catalog/" classnames={styles.link} />

В компоненте "TitleArrowLink" нужно будет доработать логику маленько:

Suggested change
<TitleArrowLink title="Каталог" link="/catalog/" />
const TitleArrowLink: React.FC<TitleArrowLinkProps> = ({ title, link, type, classnames }) => {
return (
<Link to={link} className={cn(styles.link, classnames)}>
<p
className={clsx(
styles.link__title,
type === 'catalogPage' && styles.link__title_type_smallFont
)}
>
{title}
</p>
<ArrowIcon
className={clsx(
styles.link__arrow,
type === 'catalogPage' && styles.link__arrow_type_small
)}
/>
</Link>
);
};

<p className={styles.catalogPromo__text} onClick={handleCategoryToggle}>
{numberToShow < 12 ? 'Развернуть' : 'Свернуть'}
</p>
<span
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Не верный элемент, нужно заменить на button. С клавиатуры не возможно будет сфокусироваться на этом элементе, почитай про доступность (https://developer.mozilla.org/ru/docs/Learn/Accessibility/HTML)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants