forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-02-27 12:16:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Renamed SortingDropdown to OrderingDropdown, for consistency

Browse Source
This commit is contained in:
Alejandro Celaya
2021-12-25 10:31:48 +01:00
parent 6213067f35
commit 994f31b7e5
14 changed files with 57 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/utils/OrderingDropdown.scss Normal file
View File

@@ -0,0 +1,8 @@
.ordering-dropdown__menu--link.ordering-dropdown__menu--link {
min-width: 11rem;
}
.ordering-dropdown__sort-icon {
margin: 3.5px 0 0;
float: right;
}

12
src/utils/SortingDropdown.tsx → src/utils/OrderingDropdown.tsx
View File

@@ -4,9 +4,9 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSortAmountUp as sortAscIcon, faSortAmountDown as sortDescIcon } from '@fortawesome/free-solid-svg-icons';
import classNames from 'classnames';
import { determineOrderDir, Order, OrderDir } from './helpers/ordering';
import './SortingDropdown.scss';
import './OrderingDropdown.scss';
export interface SortingDropdownProps<T extends string = string> {
export interface OrderingDropdownProps<T extends string = string> {
items: Record<T, string>;
order: Order<T>;
onChange: (orderField?: T, orderDir?: OrderDir) => void;
@@ -14,8 +14,8 @@ export interface SortingDropdownProps<T extends string = string> {
right?: boolean;
}
export function SortingDropdown<T extends string = string>(
{ items, order, onChange, isButton = true, right = false }: SortingDropdownProps<T>,
export function OrderingDropdown<T extends string = string>(
{ items, order, onChange, isButton = true, right = false }: OrderingDropdownProps<T>,
) {
const handleItemClick = (fieldKey: T) => () => {
const newOrderDir = determineOrderDir(fieldKey, order.field, order.dir);
@@ -36,7 +36,7 @@ export function SortingDropdown<T extends string = string>(
</DropdownToggle>
<DropdownMenu
right={right}
className={classNames('w-100', { 'sorting-dropdown__menu--link': !isButton })}
className={classNames('w-100', { 'ordering-dropdown__menu--link': !isButton })}
>
{toPairs(items).map(([ fieldKey, fieldValue ]) => (
<DropdownItem key={fieldKey} active={order.field === fieldKey} onClick={handleItemClick(fieldKey as T)}>
@@ -44,7 +44,7 @@ export function SortingDropdown<T extends string = string>(
{order.field === fieldKey && (
<FontAwesomeIcon
icon={order.dir === 'ASC' ? sortAscIcon : sortDescIcon}
className="sorting-dropdown__sort-icon"
className="ordering-dropdown__sort-icon"
/>
)}
</DropdownItem>

8
src/utils/SortingDropdown.scss
View File

@@ -1,8 +0,0 @@
.sorting-dropdown__menu--link.sorting-dropdown__menu--link {
min-width: 11rem;
}
.sorting-dropdown__sort-icon {
margin: 3.5px 0 0;
float: right;
}