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

переделать компонент footer под FSD #169

Merged
merged 30 commits into from
Jan 11, 2024

Conversation

ArturKhelshtein
Copy link
Collaborator

перенесен компонент Footer в widgets
перенесен компонент SubscribeFormв entities
перенесены компоненты Logo, icons(вероятно дальше удалить надо будет) в shared

сделаны моки для получения данных с сервера для футера и хедера

@ArturKhelshtein ArturKhelshtein linked an issue Dec 25, 2023 that may be closed by this pull request
3 tasks
Copy link
Collaborator

@Segodnya Segodnya left a comment

Choose a reason for hiding this comment

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

Посмотрел. Мне кажется есть что можно поправить. Ребята посмотрят и может еще чего найдут

Copy link
Collaborator

Choose a reason for hiding this comment

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

import { type FC, type FormEvent } from 'react'

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

примеры смотрел, там было без ’type' поискал, нашел ответ только у chatGpt «import { type FC }: В TypeScript до версии 3.8, для объявления типов использовалось ключевое слово type. import { type FC } подразумевает, что FC является типом, который был объявлен в модуле React и экспортирован с использованием type. Отметим, что начиная с TypeScript 3.8, type стало необязательным для объявления типов, и теперь можно объявлять типы без его использования. Таким образом, если вы используете новые версии TypeScript и React, import { FC } будет более предпочтительным способом импорта типа функционального компонента React.»

@@ -36,7 +36,9 @@ const SubscribeForm: FC<TSubscribeForm> = ({ className, type, onSubmit }) => {
{/* @TODO: Добавить компонент Label
https://github.com/Studio-Yandex-Practicum/maxboom_frontend/issues/102 */}
<span className={`${styles.label} ${classNameLabel}`}>Подписаться на рассылку</span>
<span className={`${styles.caption}`}>Мы не будем присылать вам спам. Только скидки и выгодные предложения</span>
<span className={`${styles.caption}`}>
Copy link
Collaborator

Choose a reason for hiding this comment

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

Давай уберем эти стрёмные обратные кавычки там, где они не нужны, чтоб код чище был

Copy link
Collaborator

Choose a reason for hiding this comment

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

Я бы в целом предложил с помощью classnames значительно упростить стилизацию тут и повысить читаемость. Типа такого:
const labelClassName = classNames({
[styles.label_footer]: type === 'footer',
[styles.label_subscribe]: type === 'subscribe',
});

const formClassName = classNames({
[styles.form_footer]: type === 'footer',
[styles.form_subscribe]: type === 'subscribe',
});

const containerClassName = classNames(styles.container, {
[styles.container_footer]: type === 'footer',
[styles.container_subscribe]: type === 'subscribe',
[className]: className,
});

className={containerClassName}
className={classNames(styles.label, labelClassName)}
className={classNames(styles.form, formClassName)}

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

прошу пояснений к части classNames @Segodnya

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

*замечание принято, будет занесено в лист исправлений. в данном PR этот компонент не менялся (только импорты)

@@ -0,0 +1,30 @@
import { FC } from 'react'
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
import { FC } from 'react'
import { type FC } from 'react'


const Logo: FC<TLogoProps> = ({ image, title, url, width, height }) => {
return (
<div className={`${styles.container}`}>
Copy link
Collaborator

Choose a reason for hiding this comment

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

тоже обратные кавычки ни к чему здесь совсем, можно убрать

import SubscribeForm from '@/entities/SubscribeForm/SubscribeForm'
import styles from './footer.module.scss'

console.log(coreBaseData.footer)
Copy link
Collaborator

Choose a reason for hiding this comment

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

ой-ёй :) давай уберём

Copy link
Collaborator

@aimenin aimenin left a comment

Choose a reason for hiding this comment

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

Можно выделить компонент
Добавить storybook для новых компонентов

</p>
<ul className={styles.footer__payments}>
{coreBaseData.footer.additional_logos.map(logo => (
<li className={styles['footer__payment-nav']} key={logo.title}>
Copy link
Collaborator

Choose a reason for hiding this comment

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

можно выделить в компонент

JuliaAvramenko and others added 16 commits January 10, 2024 10:36
…create-widget-make-order

#128-development-created-CartPage
…change-ReviewsBlock-according-to-fsd

Enhancement 145 change reviews block according to fsd
…-Practicum/maxboom_frontend into enhancement-160-footer-FSD
…-Practicum/maxboom_frontend into enhancement-160-footer-FSD
…-Practicum/maxboom_frontend into enhancement-160-footer-FSD
…add-storybooks-to-reviewsBlock

#180-enhancement-add-storybooks-to-reviewsBlock
Copy link
Collaborator

@aimenin aimenin left a comment

Choose a reason for hiding this comment

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

👍

* refactor: Выделить из Header отдельную feature - SearchProduct #171

* hotfix: fix CamelCase issue with SCSS module files

* refactor: Заменил querySelector на useRef

* documentation: add stories for SearchProduct, SearchResult, SearchItem
Copy link
Collaborator

@Segodnya Segodnya left a comment

Choose a reason for hiding this comment

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

👍. Я уже вмержил обновленный header с выделенной фичей поиска в мастер. поэтому когда будешь разрешать конфликт будь внимательней. если будут вопросы что/как расконфликтить - пиши :)

@Segodnya
Copy link
Collaborator

search выпилен и вместо него SearchProduct
а Logo лучше оставить твое, думаю

@ArturKhelshtein ArturKhelshtein merged commit 1ec0120 into master Jan 11, 2024
1 check passed
@ArturKhelshtein ArturKhelshtein deleted the enhancement-160-footer-FSD branch January 12, 2024 07:00
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.

Переделка компонента footer по fsd
4 participants