From 4c42d3c6a051c58d9b6c35bb462034a85120fce7 Mon Sep 17 00:00:00 2001 From: Saashkai Date: Thu, 12 Aug 2021 00:03:58 +0300 Subject: [PATCH 1/3] bug fix --- src/old/lib/utilities/sorting.ts | 16 ++++ .../materials/components/MaterialsView.tsx | 76 ++++++++----------- 2 files changed, 46 insertions(+), 46 deletions(-) create mode 100644 src/old/lib/utilities/sorting.ts diff --git a/src/old/lib/utilities/sorting.ts b/src/old/lib/utilities/sorting.ts new file mode 100644 index 000000000..847f91715 --- /dev/null +++ b/src/old/lib/utilities/sorting.ts @@ -0,0 +1,16 @@ +import { IPostType, IOrigin, IDirection } from '../types'; + +export const sortByAlphabet = ( + array: IPostType[] | IOrigin[] | IDirection[], + sortBy: string | undefined = 'name', +): any[] => { + return array?.sort((prev, current) => { + if (prev[sortBy] > current[sortBy]) { + return 1; + } + if (prev[sortBy] < current[sortBy]) { + return -1; + } + return 0; + }); +}; diff --git a/src/old/modules/materials/components/MaterialsView.tsx b/src/old/modules/materials/components/MaterialsView.tsx index 4c3281a8f..bc6f360b7 100644 --- a/src/old/modules/materials/components/MaterialsView.tsx +++ b/src/old/modules/materials/components/MaterialsView.tsx @@ -1,4 +1,5 @@ /* eslint-disable @typescript-eslint/no-shadow */ +/* eslint-disable @typescript-eslint/no-unsafe-assignment */ import { Box, Grid, Typography } from '@material-ui/core'; import { isEmpty, uniq } from 'lodash'; import React, { useEffect, useState } from 'react'; @@ -50,6 +51,7 @@ import { updateOrig, updateDir, } from '../../utilities/utilityFunctions'; +import { sortByAlphabet } from '../../../lib/utilities/sorting'; const MaterialsView: React.FC = () => { const { t } = useTranslation(); @@ -78,58 +80,42 @@ const MaterialsView: React.FC = () => { const classes = useStyles(); const materials = selectPostsByIds(postIds); const origins = useSelector(selectOrigins); - const originsInPlural: IOrigin[] = []; + let originsInPlural: IOrigin[] = []; if (origins.length) { - const el1: IOrigin = { ...origins[0] }; - const el2: IOrigin = { ...origins[1] }; - const el3: IOrigin = { ...origins[2] }; - - Object.defineProperty(el1, 'name', { - enumerable: false, - configurable: true, - writable: true, - value: `${t(langTokens.experts.expertOpinion, defaultPlural)}`, + originsInPlural = origins.map((origin) => { + const translations = { + '1': `${t(langTokens.experts.expertOpinion, defaultPlural)}`, + '3': `${t(langTokens.common.translation, defaultPlural)}`, + }; + const translatedOrigin = { ...origin }; + translatedOrigin.name = translations[origin.id] || origin.name; + return translatedOrigin; }); - Object.defineProperty(el3, 'name', { - enumerable: false, - configurable: true, - writable: true, - value: `${t(langTokens.common.translation, defaultPlural)}`, - }); - - originsInPlural.push(el1, el3, el2); + originsInPlural = sortByAlphabet(originsInPlural); } const postTypes = useSelector(selectPostTypes); - const postTypesInPlural: IPostType[] = []; + let postTypesInPlural: IPostType[] = []; if (postTypes.length) { - const el1: IPostType = { ...postTypes[0] }; - const el2: IPostType = { ...postTypes[1] }; - const el3: IPostType = { ...postTypes[2] }; - - Object.defineProperty(el1, 'name', { - enumerable: false, - configurable: true, - writable: true, - value: `${t(langTokens.common.article_1, defaultPlural)}`, - }); - Object.defineProperty(el2, 'name', { - enumerable: false, - configurable: true, - writable: true, - value: `${t(langTokens.common.video)}`, - }); - Object.defineProperty(el3, 'name', { - enumerable: false, - configurable: true, - writable: true, - value: `${t(langTokens.common.post, defaultPlural)}`, + postTypesInPlural = postTypes.map((postType) => { + const translations = { + '1': `${t(langTokens.common.article_1, defaultPlural)}`, + '2': `${t(langTokens.common.video)}`, + '3': `${t(langTokens.common.post, defaultPlural)}`, + }; + const translatedPostType = { ...postType }; + translatedPostType.name = translations[postType.id] || postType.name; + return translatedPostType; }); - - postTypesInPlural.push(el1, el3, el2); + postTypesInPlural = sortByAlphabet(postTypesInPlural); } const directions = useSelector(selectDirections); + let directionsInPlural: IDirection[] = []; + if (directions.length) { + directionsInPlural = directions.map((direction) => ({ ...direction })); + directionsInPlural = sortByAlphabet(directionsInPlural, 'label'); + } const propertiesLoaded = !isEmpty(postTypes) && !isEmpty(directions) && !isEmpty(origins); @@ -195,7 +181,6 @@ const MaterialsView: React.FC = () => { const queryType = getQueryTypeByFilterType(filterType); const checkedIds = Object.keys(checked).filter((key) => checked[key]); const isQuerySame = uniq(Object.values(checked)).length === 1; // removing the query if user checks/unchecks the last box - query.set(queryType, checkedIds.join(',')); if (!checkedIds.length || isQuerySame) { query.delete(queryType); @@ -264,7 +249,7 @@ const MaterialsView: React.FC = () => { let selectedDirections: | IDirection[] - | filtersStateEnum = directions?.filter((direction) => + | filtersStateEnum = directionsInPlural?.filter((direction) => selectedDirectionsString?.includes(direction.id.toString()), ); @@ -380,7 +365,6 @@ const MaterialsView: React.FC = () => { chipsListType: ChipFilterType | undefined, ) => { let filtersUpdatedByChips: undefined | CheckboxFormStateType; - if (chipsListType === 'ORIGIN') { filtersUpdatedByChips = { ...checkedFiltersOrigins }; } else if (chipsListType === 'POST_TYPE') { @@ -509,7 +493,7 @@ const MaterialsView: React.FC = () => { onFormChange={(checked) => setFilters(checked, FilterTypeEnum.DIRECTIONS) } - possibleFilters={directions} + possibleFilters={directionsInPlural} selectedFilters={selectedDirections} filterTitle={t(langTokens.common.byDirection).toLowerCase()} allTitle={t(langTokens.common.allDirections)} From 26624ebc45652afa11963a369af9e2f6bda6d3b9 Mon Sep 17 00:00:00 2001 From: Saashkai Date: Thu, 12 Aug 2021 12:15:20 +0300 Subject: [PATCH 2/3] removed sorting from origins and post types --- src/old/lib/utilities/sorting.ts | 4 ++-- .../materials/components/MaterialsView.tsx | 17 +++++++++++++---- 2 files changed, 15 insertions(+), 6 deletions(-) diff --git a/src/old/lib/utilities/sorting.ts b/src/old/lib/utilities/sorting.ts index 847f91715..4323b6096 100644 --- a/src/old/lib/utilities/sorting.ts +++ b/src/old/lib/utilities/sorting.ts @@ -1,9 +1,9 @@ import { IPostType, IOrigin, IDirection } from '../types'; export const sortByAlphabet = ( - array: IPostType[] | IOrigin[] | IDirection[], + array: IDirection[], sortBy: string | undefined = 'name', -): any[] => { +): IDirection[] => { return array?.sort((prev, current) => { if (prev[sortBy] > current[sortBy]) { return 1; diff --git a/src/old/modules/materials/components/MaterialsView.tsx b/src/old/modules/materials/components/MaterialsView.tsx index 8b86ea8c5..66a49aad6 100644 --- a/src/old/modules/materials/components/MaterialsView.tsx +++ b/src/old/modules/materials/components/MaterialsView.tsx @@ -83,7 +83,7 @@ const MaterialsView: React.FC = () => { let originsInPlural: IOrigin[] = []; if (origins.length) { - originsInPlural = origins.map((origin) => { + const translatedOrigins = origins.map((origin) => { const translations = { '1': `${t(langTokens.experts.expertOpinion, defaultPlural)}`, '3': `${t(langTokens.common.translation, defaultPlural)}`, @@ -92,12 +92,16 @@ const MaterialsView: React.FC = () => { translatedOrigin.name = translations[origin.id] || origin.name; return translatedOrigin; }); - originsInPlural = sortByAlphabet(originsInPlural); + originsInPlural = [ + translatedOrigins[0], + translatedOrigins[2], + translatedOrigins[1], + ]; } const postTypes = useSelector(selectPostTypes); let postTypesInPlural: IPostType[] = []; if (postTypes.length) { - postTypesInPlural = postTypes.map((postType) => { + const translatedPostTypes = postTypes.map((postType) => { const translations = { '1': `${t(langTokens.common.article_1, defaultPlural)}`, '2': `${t(langTokens.common.video)}`, @@ -107,7 +111,12 @@ const MaterialsView: React.FC = () => { translatedPostType.name = translations[postType.id] || postType.name; return translatedPostType; }); - postTypesInPlural = sortByAlphabet(postTypesInPlural); + + postTypesInPlural = [ + translatedPostTypes[0], + translatedPostTypes[2], + translatedPostTypes[1], + ]; } const directions = useSelector(selectDirections); From 4580a23e055b2de5c627f0d04adf5eef166c8a3c Mon Sep 17 00:00:00 2001 From: Saashkai Date: Thu, 12 Aug 2021 22:32:05 +0300 Subject: [PATCH 3/3] fixed according to comments in review --- .../materials/components/MaterialsView.tsx | 23 +++++++++++-------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/src/old/modules/materials/components/MaterialsView.tsx b/src/old/modules/materials/components/MaterialsView.tsx index 66a49aad6..752f674fb 100644 --- a/src/old/modules/materials/components/MaterialsView.tsx +++ b/src/old/modules/materials/components/MaterialsView.tsx @@ -80,8 +80,8 @@ const MaterialsView: React.FC = () => { const classes = useStyles(); const materials = selectPostsByIds(postIds); const origins = useSelector(selectOrigins); - let originsInPlural: IOrigin[] = []; - + const originsInPlural: IOrigin[] = []; + // here we translate origins and put them in proper order if (origins.length) { const translatedOrigins = origins.map((origin) => { const translations = { @@ -92,14 +92,15 @@ const MaterialsView: React.FC = () => { translatedOrigin.name = translations[origin.id] || origin.name; return translatedOrigin; }); - originsInPlural = [ + originsInPlural.push( translatedOrigins[0], translatedOrigins[2], translatedOrigins[1], - ]; + ); } const postTypes = useSelector(selectPostTypes); - let postTypesInPlural: IPostType[] = []; + const postTypesInPlural: IPostType[] = []; + // here we translate types and put them in proper order if (postTypes.length) { const translatedPostTypes = postTypes.map((postType) => { const translations = { @@ -112,18 +113,20 @@ const MaterialsView: React.FC = () => { return translatedPostType; }); - postTypesInPlural = [ + postTypesInPlural.push( translatedPostTypes[0], translatedPostTypes[2], translatedPostTypes[1], - ]; + ); } const directions = useSelector(selectDirections); - let directionsInPlural: IDirection[] = []; + const directionsInPlural: IDirection[] = []; + // here we sorted directions in alphabet order if (directions.length) { - directionsInPlural = directions.map((direction) => ({ ...direction })); - directionsInPlural = sortByAlphabet(directionsInPlural, 'label'); + const directionsToSort = directions.map((direction) => ({ ...direction })); + const sortedDirections = sortByAlphabet(directionsToSort, 'label'); + directionsInPlural.push(...sortedDirections); } const propertiesLoaded =