mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-01 18:33:33 +00:00
restructure files onto electron-vite boilerplate
This commit is contained in:
parent
91ce2cd8a1
commit
1cf587bc8f
457 changed files with 9927 additions and 11705 deletions
|
|
@ -1,5 +1,6 @@
|
|||
import { Outlet } from 'react-router-dom';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { Titlebar } from '/@/renderer/features/titlebar/components/titlebar';
|
||||
|
||||
const WindowsTitlebarContainer = styled.div`
|
||||
|
|
|
|||
|
|
@ -1,20 +1,21 @@
|
|||
import { lazy } from 'react';
|
||||
import { HotkeyItem, useHotkeys } from '@mantine/hooks';
|
||||
import isElectron from 'is-electron';
|
||||
import { lazy } from 'react';
|
||||
import { useNavigate } from 'react-router';
|
||||
import styled from 'styled-components';
|
||||
import {
|
||||
useWindowSettings,
|
||||
useSettingsStore,
|
||||
useHotkeySettings,
|
||||
useGeneralSettings,
|
||||
useSettingsStoreActions,
|
||||
} from '/@/renderer/store/settings.store';
|
||||
import { Platform, PlaybackType } from '/@/renderer/types';
|
||||
|
||||
import { CommandPalette } from '/@/renderer/features/search/components/command-palette';
|
||||
import { MainContent } from '/@/renderer/layouts/default-layout/main-content';
|
||||
import { PlayerBar } from '/@/renderer/layouts/default-layout/player-bar';
|
||||
import { HotkeyItem, useHotkeys } from '@mantine/hooks';
|
||||
import { CommandPalette } from '/@/renderer/features/search/components/command-palette';
|
||||
import { useCommandPalette } from '/@/renderer/store';
|
||||
import {
|
||||
useGeneralSettings,
|
||||
useHotkeySettings,
|
||||
useSettingsStore,
|
||||
useSettingsStoreActions,
|
||||
useWindowSettings,
|
||||
} from '/@/renderer/store/settings.store';
|
||||
import { Platform, PlaybackType } from '/@/renderer/types';
|
||||
|
||||
if (!isElectron()) {
|
||||
useSettingsStore.getState().actions.setSettings({
|
||||
|
|
@ -56,7 +57,7 @@ export const DefaultLayout = ({ shell }: DefaultLayoutProps) => {
|
|||
const { opened, ...handlers } = useCommandPalette();
|
||||
const { bindings } = useHotkeySettings();
|
||||
const navigate = useNavigate();
|
||||
const localSettings = isElectron() ? window.electron.localSettings : null;
|
||||
const localSettings = isElectron() ? window.api.localSettings : null;
|
||||
const settings = useGeneralSettings();
|
||||
const { setSettings } = useSettingsStoreActions();
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import { AnimatePresence } from 'framer-motion';
|
||||
|
||||
import { FullScreenPlayer } from '/@/renderer/features/player/components/full-screen-player';
|
||||
import { useFullScreenPlayerStore } from '/@/renderer/store';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import { useRef } from 'react';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { ResizeHandle } from '/@/renderer/features/shared';
|
||||
import { CollapsedSidebar } from '/@/renderer/features/sidebar/components/collapsed-sidebar';
|
||||
import { Sidebar } from '/@/renderer/features/sidebar/components/sidebar';
|
||||
|
|
@ -24,13 +25,13 @@ export const LeftSidebar = ({ isResizing, startResizing }: LeftSidebarProps) =>
|
|||
return (
|
||||
<SidebarContainer id="sidebar">
|
||||
<ResizeHandle
|
||||
ref={sidebarRef}
|
||||
$isResizing={isResizing}
|
||||
$placement="right"
|
||||
onMouseDown={(e) => {
|
||||
e.preventDefault();
|
||||
startResizing('left');
|
||||
}}
|
||||
ref={sidebarRef}
|
||||
/>
|
||||
{collapsed ? <CollapsedSidebar /> : <Sidebar />}
|
||||
</SidebarContainer>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,16 @@
|
|||
import { lazy, Suspense, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import { throttle } from 'lodash';
|
||||
import { lazy, Suspense, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import { Outlet, useLocation } from 'react-router';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { Spinner } from '/@/renderer/components';
|
||||
import { FullScreenOverlay } from '/@/renderer/layouts/default-layout/full-screen-overlay';
|
||||
import { LeftSidebar } from '/@/renderer/layouts/default-layout/left-sidebar';
|
||||
import { RightSidebar } from '/@/renderer/layouts/default-layout/right-sidebar';
|
||||
import { AppRoute } from '/@/renderer/router/routes';
|
||||
import { useAppStoreActions, useSidebarStore } from '/@/renderer/store';
|
||||
import { useGeneralSettings } from '/@/renderer/store/settings.store';
|
||||
import { constrainSidebarWidth, constrainRightSidebarWidth } from '/@/renderer/utils';
|
||||
import { LeftSidebar } from '/@/renderer/layouts/default-layout/left-sidebar';
|
||||
import { FullScreenOverlay } from '/@/renderer/layouts/default-layout/full-screen-overlay';
|
||||
import { RightSidebar } from '/@/renderer/layouts/default-layout/right-sidebar';
|
||||
import { Spinner } from '/@/renderer/components';
|
||||
import { constrainRightSidebarWidth, constrainSidebarWidth } from '/@/renderer/utils';
|
||||
|
||||
const SideDrawerQueue = lazy(() =>
|
||||
import('/@/renderer/layouts/default-layout/side-drawer-queue').then((module) => ({
|
||||
|
|
@ -41,9 +42,9 @@ const MainContentContainer = styled.div<{
|
|||
|
||||
export const MainContent = ({ shell }: { shell?: boolean }) => {
|
||||
const location = useLocation();
|
||||
const { collapsed, leftWidth, rightWidth, rightExpanded } = useSidebarStore();
|
||||
const { collapsed, leftWidth, rightExpanded, rightWidth } = useSidebarStore();
|
||||
const { setSideBar } = useAppStoreActions();
|
||||
const { sideQueueType, showQueueDrawerButton } = useGeneralSettings();
|
||||
const { showQueueDrawerButton, sideQueueType } = useGeneralSettings();
|
||||
const [isResizing, setIsResizing] = useState(false);
|
||||
const [isResizingRight, setIsResizingRight] = useState(false);
|
||||
|
||||
|
|
@ -114,8 +115,8 @@ export const MainContent = ({ shell }: { shell?: boolean }) => {
|
|||
startResizing={startResizing}
|
||||
/>
|
||||
<RightSidebar
|
||||
ref={rightSidebarRef}
|
||||
isResizing={isResizingRight}
|
||||
ref={rightSidebarRef}
|
||||
startResizing={startResizing}
|
||||
/>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import styled from 'styled-components';
|
||||
|
||||
import { Playerbar } from '/@/renderer/features/player';
|
||||
import { useGeneralSettings } from '/@/renderer/store/settings.store';
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@ import { AnimatePresence, motion, Variants } from 'framer-motion';
|
|||
import { forwardRef, Ref } from 'react';
|
||||
import { useLocation } from 'react-router';
|
||||
import styled from 'styled-components';
|
||||
import { SidebarPlayQueue, DrawerPlayQueue } from '/@/renderer/features/now-playing';
|
||||
|
||||
import { DrawerPlayQueue, SidebarPlayQueue } from '/@/renderer/features/now-playing';
|
||||
import { ResizeHandle } from '/@/renderer/features/shared';
|
||||
import { AppRoute } from '/@/renderer/router/routes';
|
||||
import { useGeneralSettings, useSidebarStore, useWindowSettings } from '/@/renderer/store';
|
||||
|
|
@ -93,49 +94,49 @@ export const RightSidebar = forwardRef(
|
|||
ref: Ref<HTMLDivElement>,
|
||||
) => {
|
||||
const { windowBarStyle } = useWindowSettings();
|
||||
const { rightWidth, rightExpanded } = useSidebarStore();
|
||||
const { rightExpanded, rightWidth } = useSidebarStore();
|
||||
const { sideQueueType } = useGeneralSettings();
|
||||
const location = useLocation();
|
||||
const showSideQueue = rightExpanded && location.pathname !== AppRoute.NOW_PLAYING;
|
||||
|
||||
return (
|
||||
<AnimatePresence
|
||||
key="queue-sidebar"
|
||||
presenceAffectsLayout
|
||||
initial={false}
|
||||
key="queue-sidebar"
|
||||
mode="sync"
|
||||
presenceAffectsLayout
|
||||
>
|
||||
{showSideQueue && (
|
||||
<>
|
||||
{sideQueueType === 'sideQueue' ? (
|
||||
<RightSidebarContainer
|
||||
key="queue-sidebar"
|
||||
animate="open"
|
||||
custom={rightWidth}
|
||||
exit="closed"
|
||||
id="sidebar-queue"
|
||||
initial="closed"
|
||||
key="queue-sidebar"
|
||||
variants={queueSidebarVariants}
|
||||
>
|
||||
<ResizeHandle
|
||||
ref={ref}
|
||||
$isResizing={isResizingRight}
|
||||
$placement="left"
|
||||
onMouseDown={(e) => {
|
||||
e.preventDefault();
|
||||
startResizing('right');
|
||||
}}
|
||||
ref={ref}
|
||||
/>
|
||||
<SidebarPlayQueue />
|
||||
</RightSidebarContainer>
|
||||
) : (
|
||||
<QueueDrawer
|
||||
key="queue-drawer"
|
||||
animate="open"
|
||||
custom={windowBarStyle}
|
||||
exit="closed"
|
||||
id="drawer-queue"
|
||||
initial="closed"
|
||||
key="queue-drawer"
|
||||
variants={queueDrawerVariants}
|
||||
>
|
||||
<DrawerPlayQueue />
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import { useCallback } from 'react';
|
|||
import { TbArrowBarLeft } from 'react-icons/tb';
|
||||
import { useLocation } from 'react-router';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { DrawerPlayQueue } from '/@/renderer/features/now-playing';
|
||||
import { AppRoute } from '/@/renderer/router/routes';
|
||||
import { useAppStore, useSidebarStore } from '/@/renderer/store';
|
||||
|
|
@ -104,14 +105,14 @@ export const SideDrawerQueue = () => {
|
|||
>
|
||||
{isQueueDrawerButtonVisible && (
|
||||
<QueueDrawerArea
|
||||
key="queue-drawer-button"
|
||||
animate="visible"
|
||||
exit="hidden"
|
||||
initial="hidden"
|
||||
variants={queueDrawerButtonVariants}
|
||||
whileHover={{ opacity: 1, scale: 2, transition: { duration: 0.5 } }}
|
||||
key="queue-drawer-button"
|
||||
onMouseEnter={handleEnterDrawerButton}
|
||||
onMouseLeave={handleLeaveDrawerButton}
|
||||
variants={queueDrawerButtonVariants}
|
||||
whileHover={{ opacity: 1, scale: 2, transition: { duration: 0.5 } }}
|
||||
>
|
||||
<TbArrowBarLeft size={12} />
|
||||
</QueueDrawerArea>
|
||||
|
|
@ -119,11 +120,10 @@ export const SideDrawerQueue = () => {
|
|||
|
||||
{drawer && (
|
||||
<QueueDrawer
|
||||
key="queue-drawer"
|
||||
animate="open"
|
||||
exit="closed"
|
||||
initial="closed"
|
||||
variants={queueDrawerVariants}
|
||||
key="queue-drawer"
|
||||
onMouseLeave={() => {
|
||||
// The drawer will close due to the delay when setting isReorderingQueue
|
||||
setTimeout(() => {
|
||||
|
|
@ -131,6 +131,7 @@ export const SideDrawerQueue = () => {
|
|||
drawerHandler.close();
|
||||
}, 50);
|
||||
}}
|
||||
variants={queueDrawerVariants}
|
||||
>
|
||||
<DrawerPlayQueue />
|
||||
</QueueDrawer>
|
||||
|
|
|
|||
|
|
@ -1,19 +1,21 @@
|
|||
import { useCallback, useState } from 'react';
|
||||
import isElectron from 'is-electron';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { RiCheckboxBlankLine, RiCloseLine, RiSubtractLine } from 'react-icons/ri';
|
||||
import styled from 'styled-components';
|
||||
import { useCurrentStatus, useQueueStatus } from '/@/renderer/store';
|
||||
import { useWindowSettings } from '/@/renderer/store/settings.store';
|
||||
import { Platform, PlayerStatus } from '/@/renderer/types';
|
||||
|
||||
import appIcon from '../../../assets/icons/32x32.png';
|
||||
import macCloseHover from './assets/close-mac-hover.png';
|
||||
import macClose from './assets/close-mac.png';
|
||||
import macMaxHover from './assets/max-mac-hover.png';
|
||||
import macMax from './assets/max-mac.png';
|
||||
import macMinHover from './assets/min-mac-hover.png';
|
||||
import macMin from './assets/min-mac.png';
|
||||
import appIcon from '../../../assets/icons/32x32.png';
|
||||
|
||||
const localSettings = isElectron() ? window.electron.localSettings : null;
|
||||
import { useCurrentStatus, useQueueStatus } from '/@/renderer/store';
|
||||
import { useWindowSettings } from '/@/renderer/store/settings.store';
|
||||
import { Platform, PlayerStatus } from '/@/renderer/types';
|
||||
|
||||
const localSettings = isElectron() ? window.api.localSettings : null;
|
||||
|
||||
const WindowsContainer = styled.div`
|
||||
display: flex;
|
||||
|
|
@ -61,7 +63,7 @@ const PlayerStatusContainer = styled.div`
|
|||
white-space: nowrap;
|
||||
`;
|
||||
|
||||
const browser = isElectron() ? window.electron.browser : null;
|
||||
const browser = isElectron() ? window.api.browser : null;
|
||||
const close = () => browser?.exit();
|
||||
const minimize = () => browser?.minimize();
|
||||
const maximize = () => browser?.maximize();
|
||||
|
|
@ -92,21 +94,21 @@ const WindowsControls = ({ controls, title }: WindowBarControlsProps) => {
|
|||
</PlayerStatusContainer>
|
||||
<WindowsButtonGroup>
|
||||
<WindowsButton
|
||||
role="button"
|
||||
onClick={handleMinimize}
|
||||
role="button"
|
||||
>
|
||||
<RiSubtractLine size={19} />
|
||||
</WindowsButton>
|
||||
<WindowsButton
|
||||
role="button"
|
||||
onClick={handleMaximize}
|
||||
role="button"
|
||||
>
|
||||
<RiCheckboxBlankLine size={13} />
|
||||
</WindowsButton>
|
||||
<WindowsButton
|
||||
$exit
|
||||
role="button"
|
||||
onClick={handleClose}
|
||||
role="button"
|
||||
>
|
||||
<RiCloseLine size={19} />
|
||||
</WindowsButton>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue