From 97ee9e16bfd523695e272e5e7fe9c0f1f8d842ef Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Thu, 12 Dec 2024 12:13:09 +0200 Subject: [PATCH 1/7] fix: using nullish coalescing operator instead logical or --- src/components/accordion-with-image/AccordionWithImage.tsx | 2 +- src/components/async-autocomlete/AsyncAutocomplete.tsx | 2 +- .../offer-filter-block/offer-filter-list/OfferFilterList.tsx | 2 +- .../add-categories-modal/AddCategoriesModal.constants.ts | 2 +- .../categories-container/CategoriesContainer.constansts.tsx | 2 +- .../my-resources/lessons-container/LessonsContainer.tsx | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/accordion-with-image/AccordionWithImage.tsx b/src/components/accordion-with-image/AccordionWithImage.tsx index 1239796e5..5614254dd 100644 --- a/src/components/accordion-with-image/AccordionWithImage.tsx +++ b/src/components/accordion-with-image/AccordionWithImage.tsx @@ -21,7 +21,7 @@ const AccordionWithImage: FC = ({ items }) => { response.find( (option) => (valueField ? option[valueField] : option) === value - ) || null, + ) ?? null, [response, value, valueField] ) diff --git a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx index e1a8bb898..a411de05c 100644 --- a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx +++ b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx @@ -64,7 +64,7 @@ const OfferFilterList: FC = ({ - option || t('common.languages.allLanguages') + option ?? t('common.languages.allLanguages') } onChange={handleLanguagesChange} options={languageValues} diff --git a/src/containers/my-resources/add-categories-modal/AddCategoriesModal.constants.ts b/src/containers/my-resources/add-categories-modal/AddCategoriesModal.constants.ts index d2a75a309..0940eedc1 100644 --- a/src/containers/my-resources/add-categories-modal/AddCategoriesModal.constants.ts +++ b/src/containers/my-resources/add-categories-modal/AddCategoriesModal.constants.ts @@ -13,7 +13,7 @@ export const validations = (disallowedValues: string[]) => ({ name: (value: string) => { const trimmedValue = value.trim() return ( - emptyField({ value, helperText: textField(2, 35)(trimmedValue) }) || + emptyField({ value, helperText: textField(2, 35)(trimmedValue) }) ?? valueNotIn(trimmedValue, disallowedValues) ) } diff --git a/src/containers/my-resources/categories-container/CategoriesContainer.constansts.tsx b/src/containers/my-resources/categories-container/CategoriesContainer.constansts.tsx index 013020427..e69aeffaf 100644 --- a/src/containers/my-resources/categories-container/CategoriesContainer.constansts.tsx +++ b/src/containers/my-resources/categories-container/CategoriesContainer.constansts.tsx @@ -10,7 +10,7 @@ import { emptyField, textField } from '~/utils/validations/common' export const validation = (disallowedValues: string[]) => (value: string) => { const trimmedValue = value.trim() return Boolean( - emptyField({ value, helperText: textField(2, 35)(trimmedValue) }) || + emptyField({ value, helperText: textField(2, 35)(trimmedValue) }) ?? disallowedValues.includes(trimmedValue) ) } diff --git a/src/containers/my-resources/lessons-container/LessonsContainer.tsx b/src/containers/my-resources/lessons-container/LessonsContainer.tsx index d834a2eb6..12d394310 100644 --- a/src/containers/my-resources/lessons-container/LessonsContainer.tsx +++ b/src/containers/my-resources/lessons-container/LessonsContainer.tsx @@ -80,7 +80,7 @@ const LessonsContainer = () => { ) const deleteLesson = useCallback( - (id?: string) => ResourceService.deleteLesson(id || ''), + (id?: string) => ResourceService.deleteLesson(id ?? ''), [] ) From 660e9ce18b2cc48febecf386c14817dd3e1b9c1d Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Thu, 12 Dec 2024 12:14:48 +0200 Subject: [PATCH 2/7] fix: using an optional chain expression instead --- src/containers/chat/chat-item/ChatItem.tsx | 2 +- .../MyCooperationsDetails.tsx | 14 ++++++-------- src/containers/quiz/question-answer/Answer.tsx | 2 +- 3 files changed, 8 insertions(+), 10 deletions(-) diff --git a/src/containers/chat/chat-item/ChatItem.tsx b/src/containers/chat/chat-item/ChatItem.tsx index 397c1badd..325201e78 100644 --- a/src/containers/chat/chat-item/ChatItem.tsx +++ b/src/containers/chat/chat-item/ChatItem.tsx @@ -63,7 +63,7 @@ const ChatItem: FC = ({ const handleSelectedChat = () => { setSelectedChat(chat) - closeDrawer && closeDrawer() + closeDrawer?.() } const formattedTime = diff --git a/src/containers/my-cooperations/my-cooperations-details/MyCooperationsDetails.tsx b/src/containers/my-cooperations/my-cooperations-details/MyCooperationsDetails.tsx index c1b5b72fd..5dfa643d7 100644 --- a/src/containers/my-cooperations/my-cooperations-details/MyCooperationsDetails.tsx +++ b/src/containers/my-cooperations/my-cooperations-details/MyCooperationsDetails.tsx @@ -119,14 +119,12 @@ const MyCooperationsDetails = () => { updateInfo: updateInfo }) - const languages = - offer.languages && - offer.languages.map((item: string) => ( - - - {item} - - )) + const languages = offer.languages?.map((item: string) => ( + + + {item} + + )) const avatarSrc = displayedUser.photo && diff --git a/src/containers/quiz/question-answer/Answer.tsx b/src/containers/quiz/question-answer/Answer.tsx index 9e3fa9470..634d828f9 100644 --- a/src/containers/quiz/question-answer/Answer.tsx +++ b/src/containers/quiz/question-answer/Answer.tsx @@ -66,7 +66,7 @@ const Answer: FC = ({ _, checked ) => { - onCheckboxChange && onCheckboxChange(checked) + onCheckboxChange?.(checked) } const iconStyles = styles.icon(answerStatus) From e73b6db928a3a839fab6be88c17ca16721aa0b5b Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Thu, 12 Dec 2024 12:25:15 +0200 Subject: [PATCH 3/7] fix: extract nested ternary operation --- src/components/message/Message.styles.ts | 16 ++++++---- src/pages/find-offers/FindOffers.tsx | 38 +++++++++++++++--------- 2 files changed, 35 insertions(+), 19 deletions(-) diff --git a/src/components/message/Message.styles.ts b/src/components/message/Message.styles.ts index 70f8cb87d..48648365e 100644 --- a/src/components/message/Message.styles.ts +++ b/src/components/message/Message.styles.ts @@ -24,11 +24,17 @@ export const styles = { typography: TypographyVariantEnum.Body1, p: '8px 16px' }), - findMessageCard: (isMyMessage: boolean, isFiltered: boolean) => ({ - backgroundColor: isFiltered - ? `basic.${isMyMessage ? 'turquoiseDark' : 'turquoiseChat'}` - : `primary.${isMyMessage ? 500 : 100}` - }), + findMessageCard: (isMyMessage: boolean, isFiltered: boolean) => { + let backgroundColor + + if (isFiltered) { + backgroundColor = `basic.${isMyMessage ? 'turquoiseDark' : 'turquoiseChat'}` + } else { + backgroundColor = `primary.${isMyMessage ? 500 : 100}` + } + + return { backgroundColor } + }, date: (isMyMessage: boolean) => ({ typography: TypographyVariantEnum.Caption, color: `primary.${isMyMessage ? 100 : 500}`, diff --git a/src/pages/find-offers/FindOffers.tsx b/src/pages/find-offers/FindOffers.tsx index 1270c0e3c..ddb847f22 100644 --- a/src/pages/find-offers/FindOffers.tsx +++ b/src/pages/find-offers/FindOffers.tsx @@ -144,6 +144,29 @@ const FindOffers = () => { }) } + const renderOffersContent = () => { + if (offersLoading) { + return + } + + if (!items.length) { + return ( + + ) + } + + return ( + + ) + } + return ( @@ -192,20 +215,7 @@ const FindOffers = () => { price={price} /> - {offersLoading ? ( - - ) : !items.length && !offersLoading ? ( - - ) : ( - - )} + {renderOffersContent()} Date: Thu, 12 Dec 2024 14:31:03 +0200 Subject: [PATCH 4/7] fix --- .../offer-filter-block/offer-filter-list/OfferFilterList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx index a411de05c..e1a8bb898 100644 --- a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx +++ b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx @@ -64,7 +64,7 @@ const OfferFilterList: FC = ({ - option ?? t('common.languages.allLanguages') + option || t('common.languages.allLanguages') } onChange={handleLanguagesChange} options={languageValues} From 1b5cc9189200365dee9c25b02c2de8a574a26895 Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Thu, 12 Dec 2024 14:36:00 +0200 Subject: [PATCH 5/7] fix --- .../offer-filter-block/offer-filter-list/OfferFilterList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx index e1a8bb898..d8f2bc4f6 100644 --- a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx +++ b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx @@ -64,7 +64,7 @@ const OfferFilterList: FC = ({ - option || t('common.languages.allLanguages') + option?.trim() ? option : t('common.languages.allLanguages') } onChange={handleLanguagesChange} options={languageValues} From 15408363cb027487c6decec1150a85db3e3906de Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Thu, 12 Dec 2024 14:51:36 +0200 Subject: [PATCH 6/7] fix: adding ids to use in key instead indexes --- .../student-how-it-works/HowItWorksCards.js | 4 ++++ .../student-how-it-works/StudentHowItWorks.jsx | 4 ++-- src/pages/cookie-policy/CookiePolicy.jsx | 4 ++-- src/pages/cookie-policy/cookie-policy.constants.js | 8 ++++++++ 4 files changed, 16 insertions(+), 4 deletions(-) diff --git a/src/containers/student-home-page/student-how-it-works/HowItWorksCards.js b/src/containers/student-home-page/student-how-it-works/HowItWorksCards.js index f87eb7ed6..04dd6139a 100644 --- a/src/containers/student-home-page/student-how-it-works/HowItWorksCards.js +++ b/src/containers/student-home-page/student-how-it-works/HowItWorksCards.js @@ -5,21 +5,25 @@ import howItWorksStudentFourth from '~/assets/img/guest-home-page/howItWorksStud export const howItWorksCards = [ { + id: 1, image: howItWorksStudentSecond, title: 'studentHomePage.howItWorks.selectATutor.title', description: 'studentHomePage.howItWorks.selectATutor.description' }, { + id: 2, image: howItWorksStudentThird, title: 'studentHomePage.howItWorks.sendRequest.title', description: 'studentHomePage.howItWorks.sendRequest.description' }, { + id: 3, image: howItWorksStudentFourth, title: 'studentHomePage.howItWorks.startLearning.title', description: 'studentHomePage.howItWorks.startLearning.description' }, { + id: 4, image: howItWorksStudentFirst, title: 'studentHomePage.howItWorks.writeFeedback.title', description: 'studentHomePage.howItWorks.writeFeedback.description' diff --git a/src/containers/student-home-page/student-how-it-works/StudentHowItWorks.jsx b/src/containers/student-home-page/student-how-it-works/StudentHowItWorks.jsx index ae2905841..8147ed33a 100644 --- a/src/containers/student-home-page/student-how-it-works/StudentHowItWorks.jsx +++ b/src/containers/student-home-page/student-how-it-works/StudentHowItWorks.jsx @@ -18,9 +18,9 @@ const StudentHowItWorks = () => { const { path } = authRoutes.findOffers - const cards = howItWorksCards.map((item, index) => { + const cards = howItWorksCards.map((item) => { return ( - + { const { t } = useTranslation() - const cookieItems = cookieItemsData.map((item, index) => { + const cookieItems = cookieItemsData.map((item) => { return ( - + {t(item.title)} diff --git a/src/pages/cookie-policy/cookie-policy.constants.js b/src/pages/cookie-policy/cookie-policy.constants.js index faecb3fa8..fdaf57308 100644 --- a/src/pages/cookie-policy/cookie-policy.constants.js +++ b/src/pages/cookie-policy/cookie-policy.constants.js @@ -1,35 +1,43 @@ export const cookieItemsData = [ { + id: 1, title: 'cookiePolicyPage.whatAreCookies.title', description: 'cookiePolicyPage.whatAreCookies.description' }, { + id: 2, title: 'cookiePolicyPage.howWeUseCookies.title', description: 'cookiePolicyPage.howWeUseCookies.description' }, { + id: 3, title: 'cookiePolicyPage.disablingCookies.title', description: 'cookiePolicyPage.disablingCookies.description' }, { + id: 4, title: 'cookiePolicyPage.theCookiesWeSet.title', subtitle: 'cookiePolicyPage.theCookiesWeSet.account.title', description: 'cookiePolicyPage.theCookiesWeSet.account.description' }, { + id: 5, subtitle: 'cookiePolicyPage.theCookiesWeSet.login.title', description: 'cookiePolicyPage.theCookiesWeSet.login.description' }, { + id: 6, subtitle: 'cookiePolicyPage.theCookiesWeSet.site.title', description: 'cookiePolicyPage.theCookiesWeSet.site.description' }, { + id: 7, title: 'cookiePolicyPage.thirdPartyCookies.title', subtitle: 'cookiePolicyPage.thirdPartyCookies.subtitle', description: 'cookiePolicyPage.thirdPartyCookies.description' }, { + id: 8, title: 'cookiePolicyPage.moreInformation.title', subtitle: 'cookiePolicyPage.moreInformation.subtitle' } From 974884075bf1a90f8e3116be30d2a84fcd907c2f Mon Sep 17 00:00:00 2001 From: sandrvvu Date: Mon, 16 Dec 2024 12:05:34 +0200 Subject: [PATCH 7/7] refactor --- src/components/message/Message.styles.ts | 11 +++++------ .../offer-filter-list/OfferFilterList.tsx | 8 +++++--- src/pages/find-offers/FindOffers.tsx | 6 +++--- 3 files changed, 13 insertions(+), 12 deletions(-) diff --git a/src/components/message/Message.styles.ts b/src/components/message/Message.styles.ts index 48648365e..efb9a5b77 100644 --- a/src/components/message/Message.styles.ts +++ b/src/components/message/Message.styles.ts @@ -25,13 +25,12 @@ export const styles = { p: '8px 16px' }), findMessageCard: (isMyMessage: boolean, isFiltered: boolean) => { - let backgroundColor + const basicShade = isMyMessage ? 'turquoiseDark' : 'turquoiseChat' + const primaryShade = isMyMessage ? 500 : 100 - if (isFiltered) { - backgroundColor = `basic.${isMyMessage ? 'turquoiseDark' : 'turquoiseChat'}` - } else { - backgroundColor = `primary.${isMyMessage ? 500 : 100}` - } + const backgroundColor = isFiltered + ? `basic.${basicShade}` + : `primary.${primaryShade}` return { backgroundColor } }, diff --git a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx index d8f2bc4f6..d47815729 100644 --- a/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx +++ b/src/containers/find-offer/offer-filter-block/offer-filter-list/OfferFilterList.tsx @@ -60,12 +60,14 @@ const OfferFilterList: FC = ({ const handleFilterChange = (key: keyof FindOffersFilters) => () => updateFilterByKey(key) + const getOptionLabelForLanguage = (option: LanguageFilter | null): string => { + return option?.trim() ? option : t('common.languages.allLanguages') + } + const languagesFilter = ( - option?.trim() ? option : t('common.languages.allLanguages') - } + getOptionLabel={getOptionLabelForLanguage} onChange={handleLanguagesChange} options={languageValues} value={filters.language} diff --git a/src/pages/find-offers/FindOffers.tsx b/src/pages/find-offers/FindOffers.tsx index ddb847f22..3f0b95d39 100644 --- a/src/pages/find-offers/FindOffers.tsx +++ b/src/pages/find-offers/FindOffers.tsx @@ -144,7 +144,7 @@ const FindOffers = () => { }) } - const renderOffersContent = () => { + const offersContent = useMemo(() => { if (offersLoading) { return } @@ -165,7 +165,7 @@ const FindOffers = () => { viewMode={cardsView} /> ) - } + }, [offersLoading, items, updateInfo, cardsView, t]) return ( @@ -215,7 +215,7 @@ const FindOffers = () => { price={price} /> - {renderOffersContent()} + {offersContent}