Swap tabler-icons for react-icons

This commit is contained in:
jeffvli
2022-07-30 16:57:16 -07:00
parent 1eed976747
commit 95ff874702
14 changed files with 82 additions and 165 deletions
@@ -1,6 +1,6 @@
import { Dispatch } from 'react';
import { ActionIcon, Menu, MenuProps } from '@mantine/core';
import { LayoutGrid, LayoutList, Table } from 'tabler-icons-react';
import { RiLayoutGridFill, RiLayoutTopFill } from 'react-icons/ri';
export enum ViewType {
Detail = 'detail',
@@ -23,30 +23,18 @@ export const ViewTypeButton = ({
<Menu {...menuProps}>
<Menu.Target>
<ActionIcon variant="transparent">
{type === ViewType.Grid ? (
<LayoutGrid />
) : type === ViewType.Detail ? (
<LayoutList />
) : (
<Table />
)}
{type === ViewType.Grid ? <RiLayoutGridFill /> : <RiLayoutTopFill />}
</ActionIcon>
</Menu.Target>
<Menu.Dropdown>
<Menu.Item
icon={<LayoutGrid size={14} />}
icon={<RiLayoutGridFill />}
onClick={() => handler(ViewType.Grid)}
>
Grid
</Menu.Item>
<Menu.Item
icon={<LayoutList size={14} />}
onClick={() => handler(ViewType.Detail)}
>
Detail
</Menu.Item>
<Menu.Item
icon={<Table size={14} />}
icon={<RiLayoutTopFill />}
onClick={() => handler(ViewType.Table)}
>
Table
@@ -3,7 +3,6 @@ import { useState } from 'react';
import { Button, Group, Menu } from '@mantine/core';
import { useSetState } from '@mantine/hooks';
import AutoSizer from 'react-virtualized-auto-sizer';
import { CaretDown } from 'tabler-icons-react';
import i18n from 'i18n/i18n';
import { albumsApi } from 'renderer/api/albumsApi';
import { VirtualInfiniteGrid } from 'renderer/components/virtual-grid/VirtualInfiniteGrid';
@@ -66,37 +65,29 @@ export const LibraryAlbumsRoute = () => {
</Menu.Target>
<Menu.Dropdown>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() => setFilters({ sortBy: AlbumSort.TITLE })}
>
Title
</Menu.Item>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() => setFilters({ sortBy: AlbumSort.YEAR })}
>
<Menu.Item onClick={() => setFilters({ sortBy: AlbumSort.YEAR })}>
Year
</Menu.Item>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() => setFilters({ sortBy: AlbumSort.RATING })}
>
Rating
</Menu.Item>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() => setFilters({ sortBy: AlbumSort.DATE_RELEASED })}
>
Date Released
</Menu.Item>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() => setFilters({ sortBy: AlbumSort.DATE_ADDED })}
>
Date Added
</Menu.Item>
<Menu.Item
rightSection={<CaretDown size={12} />}
onClick={() =>
setFilters({ sortBy: AlbumSort.DATE_ADDED_REMOTE })
}