antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-02 02:43:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Lint all files

Browse source
This commit is contained in:
jeffvli 2023-07-01 19:10:05 -07:00
parent 22af76b4d6
commit 30e52ebb54
334 changed files with 76519 additions and 75932 deletions
Download patch file Download diff file Expand all files Collapse all files

234
src/renderer/features/sidebar/components/collapsed-sidebar.tsx
View file

@ -3,27 +3,27 @@ import { motion } from 'framer-motion';
import { useMemo } from 'react';
import { IconType } from 'react-icons';
import {
RiUserVoiceLine,
RiMenuFill,
RiFolder3Line,
RiPlayListLine,
RiAlbumLine,
RiHome6Line,
RiMusic2Line,
RiHome6Fill,
RiAlbumFill,
RiMusic2Fill,
RiUserVoiceFill,
RiFlag2Fill,
RiFolder3Fill,
RiPlayListFill,
RiSearchLine,
RiSearchFill,
RiPlayFill,
RiPlayLine,
RiSettings2Fill,
RiSettings2Line,
RiFlag2Line,
RiUserVoiceLine,
RiMenuFill,
RiFolder3Line,
RiPlayListLine,
RiAlbumLine,
RiHome6Line,
RiMusic2Line,
RiHome6Fill,
RiAlbumFill,
RiMusic2Fill,
RiUserVoiceFill,
RiFlag2Fill,
RiFolder3Fill,
RiPlayListFill,
RiSearchLine,
RiSearchFill,
RiPlayFill,
RiPlayLine,
RiSettings2Fill,
RiSettings2Line,
RiFlag2Line,
} from 'react-icons/ri';
import { generatePath, NavLink } from 'react-router-dom';
import styled from 'styled-components';
@ -36,110 +36,110 @@ import { SidebarItemType, useGeneralSettings, useWindowSettings } from '/@/rende
import { Platform } from '/@/renderer/types';
const SidebarContainer = styled(motion.div)<{ windowBarStyle: Platform }>`
display: flex;
flex-direction: column;
height: 100%;
max-height: ${(props) =>
props.windowBarStyle === Platform.WEB || props.windowBarStyle === Platform.LINUX
? 'calc(100vh - 149px)'
: 'calc(100vh - 119px)'}; // Playerbar (90px), titlebar (65px), windowbar (30px)
user-select: none;
display: flex;
flex-direction: column;
height: 100%;
max-height: ${(props) =>
props.windowBarStyle === Platform.WEB || props.windowBarStyle === Platform.LINUX
? 'calc(100vh - 149px)'
: 'calc(100vh - 119px)'}; // Playerbar (90px), titlebar (65px), windowbar (30px)
user-select: none;
`;
const sidebarItemMap = {
[AppRoute.HOME]: {
activeIcon: RiHome6Fill,
icon: RiHome6Line,
},
[AppRoute.LIBRARY_ALBUMS]: {
activeIcon: RiAlbumFill,
icon: RiAlbumLine,
},
[AppRoute.LIBRARY_ALBUM_ARTISTS]: {
activeIcon: RiUserVoiceFill,
icon: RiUserVoiceLine,
},
[AppRoute.PLAYLISTS]: {
activeIcon: RiPlayListFill,
icon: RiPlayListLine,
},
[AppRoute.LIBRARY_SONGS]: {
activeIcon: RiMusic2Fill,
icon: RiMusic2Line,
},
[AppRoute.LIBRARY_FOLDERS]: {
activeIcon: RiFolder3Fill,
icon: RiFolder3Line,
},
[AppRoute.LIBRARY_GENRES]: {
activeIcon: RiFlag2Fill,
icon: RiFlag2Line,
},
[generatePath(AppRoute.SEARCH, { itemType: LibraryItem.SONG })]: {
activeIcon: RiSearchFill,
icon: RiSearchLine,
},
[AppRoute.SETTINGS]: {
activeIcon: RiSettings2Fill,
icon: RiSettings2Line,
},
[AppRoute.NOW_PLAYING]: {
activeIcon: RiPlayFill,
icon: RiPlayLine,
},
[AppRoute.HOME]: {
activeIcon: RiHome6Fill,
icon: RiHome6Line,
},
[AppRoute.LIBRARY_ALBUMS]: {
activeIcon: RiAlbumFill,
icon: RiAlbumLine,
},
[AppRoute.LIBRARY_ALBUM_ARTISTS]: {
activeIcon: RiUserVoiceFill,
icon: RiUserVoiceLine,
},
[AppRoute.PLAYLISTS]: {
activeIcon: RiPlayListFill,
icon: RiPlayListLine,
},
[AppRoute.LIBRARY_SONGS]: {
activeIcon: RiMusic2Fill,
icon: RiMusic2Line,
},
[AppRoute.LIBRARY_FOLDERS]: {
activeIcon: RiFolder3Fill,
icon: RiFolder3Line,
},
[AppRoute.LIBRARY_GENRES]: {
activeIcon: RiFlag2Fill,
icon: RiFlag2Line,
},
[generatePath(AppRoute.SEARCH, { itemType: LibraryItem.SONG })]: {
activeIcon: RiSearchFill,
icon: RiSearchLine,
},
[AppRoute.SETTINGS]: {
activeIcon: RiSettings2Fill,
icon: RiSettings2Line,
},
[AppRoute.NOW_PLAYING]: {
activeIcon: RiPlayFill,
icon: RiPlayLine,
},
};
export const CollapsedSidebar = () => {
const { windowBarStyle } = useWindowSettings();
const { sidebarItems } = useGeneralSettings();
const { windowBarStyle } = useWindowSettings();
const { sidebarItems } = useGeneralSettings();
const sidebarItemsWithRoute: (SidebarItemType & {
activeIcon: IconType;
icon: IconType;
})[] = useMemo(() => {
if (!sidebarItems) return [];
const sidebarItemsWithRoute: (SidebarItemType & {
activeIcon: IconType;
icon: IconType;
})[] = useMemo(() => {
if (!sidebarItems) return [];
const items = sidebarItems
.filter((item) => !item.disabled)
.map((item) => ({
...item,
...sidebarItemMap[item.route as keyof typeof sidebarItemMap],
}));
const items = sidebarItems
.filter((item) => !item.disabled)
.map((item) => ({
...item,
...sidebarItemMap[item.route as keyof typeof sidebarItemMap],
}));
return items;
}, [sidebarItems]);
return items;
}, [sidebarItems]);
return (
<SidebarContainer windowBarStyle={windowBarStyle}>
<ScrollArea
scrollHideDelay={0}
scrollbarSize={8}
>
<DropdownMenu position="right-start">
<DropdownMenu.Target>
<CollapsedSidebarItem
activeIcon={<RiMenuFill size="25" />}
component={UnstyledButton}
icon={<RiMenuFill size="25" />}
label="Menu"
/>
</DropdownMenu.Target>
<DropdownMenu.Dropdown>
<AppMenu />
</DropdownMenu.Dropdown>
</DropdownMenu>
{sidebarItemsWithRoute.map((item) => (
<CollapsedSidebarItem
key={item.id}
activeIcon={<item.activeIcon size="25" />}
component={NavLink}
icon={<item.icon size="25" />}
label={item.label}
route={item.route}
to={item.route}
/>
))}
</ScrollArea>
</SidebarContainer>
);
return (
<SidebarContainer windowBarStyle={windowBarStyle}>
<ScrollArea
scrollHideDelay={0}
scrollbarSize={8}
>
<DropdownMenu position="right-start">
<DropdownMenu.Target>
<CollapsedSidebarItem
activeIcon={<RiMenuFill size="25" />}
component={UnstyledButton}
icon={<RiMenuFill size="25" />}
label="Menu"
/>
</DropdownMenu.Target>
<DropdownMenu.Dropdown>
<AppMenu />
</DropdownMenu.Dropdown>
</DropdownMenu>
{sidebarItemsWithRoute.map((item) => (
<CollapsedSidebarItem
key={item.id}
activeIcon={<item.activeIcon size="25" />}
component={NavLink}
icon={<item.icon size="25" />}
label={item.label}
route={item.route}
to={item.route}
/>
))}
</ScrollArea>
</SidebarContainer>
);
};