renamed varaiable and refactoring

This commit is contained in:
abhinav-grd 2021-09-27 13:39:28 +05:30
parent a9d6419607
commit d7d8b3d3aa
3 changed files with 33 additions and 29 deletions

View file

@ -9,7 +9,7 @@ import { IconWithMessage } from './SelectedFileOptions';
interface Props { interface Props {
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void; setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
collectionSortBy: COLLECTION_SORT_BY; activeSortBy: COLLECTION_SORT_BY;
} }
export default function CollectionSort(props: Props) { export default function CollectionSort(props: Props) {
const collectionSortOptions = CollectionSortOptions(props); const collectionSortOptions = CollectionSortOptions(props);

View file

@ -7,8 +7,8 @@ import styled from 'styled-components';
import constants from 'utils/strings/constants'; import constants from 'utils/strings/constants';
import { MenuItem, MenuLink } from './CollectionOptions'; import { MenuItem, MenuLink } from './CollectionOptions';
interface Props { interface OptionProps {
collectionSortBy: COLLECTION_SORT_BY; activeSortBy: COLLECTION_SORT_BY;
setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void; setCollectionSortBy: (sortBy: COLLECTION_SORT_BY) => void;
} }
@ -17,12 +17,10 @@ const TickWrapper = styled.span`
margin-left: 5px; margin-left: 5px;
`; `;
const CollectionSortOptions = (props: Props) => { const SortByOptionCreator =
const { setCollectionSortBy, collectionSortBy: activeSortBy } = props; ({ setCollectionSortBy, activeSortBy }: OptionProps) =>
const SortByOption = (props: { (props: { sortBy: COLLECTION_SORT_BY; children: any }) =>
sortBy: COLLECTION_SORT_BY; (
children: any;
}) => (
<MenuItem> <MenuItem>
<Row> <Row>
<Label width="20px"> <Label width="20px">
@ -35,13 +33,19 @@ const CollectionSortOptions = (props: Props) => {
<Value width="165px"> <Value width="165px">
<MenuLink <MenuLink
onClick={() => setCollectionSortBy(props.sortBy)} onClick={() => setCollectionSortBy(props.sortBy)}
variant={activeSortBy === props.sortBy && 'success'}> variant={
activeSortBy === props.sortBy && 'success'
}>
{props.children} {props.children}
</MenuLink> </MenuLink>
</Value> </Value>
</Row> </Row>
</MenuItem> </MenuItem>
); );
const CollectionSortOptions = (props: OptionProps) => {
const SortByOption = SortByOptionCreator(props);
return ( return (
<Popover id="collection-sort-options" style={{ borderRadius: '10px' }}> <Popover id="collection-sort-options" style={{ borderRadius: '10px' }}>
<Popover.Content <Popover.Content

View file

@ -269,7 +269,7 @@ export default function Collections(props: CollectionProps) {
</CollectionContainer> </CollectionContainer>
<CollectionSort <CollectionSort
setCollectionSortBy={setCollectionSortBy} setCollectionSortBy={setCollectionSortBy}
collectionSortBy={collectionSortBy} activeSortBy={collectionSortBy}
/> />
</CollectionBar> </CollectionBar>
</> </>