diff --git a/Cargo.lock b/Cargo.lock index 756ca7d2a..dcdbeea40 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -5871,7 +5871,7 @@ dependencies = [ [[package]] name = "prisma-client-rust" version = "0.6.8" -source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f#2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f" +source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=e0af63224dcdb00a14c0aeade878894be8304cfc#e0af63224dcdb00a14c0aeade878894be8304cfc" dependencies = [ "base64 0.13.1", "bigdecimal", @@ -5904,7 +5904,7 @@ dependencies = [ [[package]] name = "prisma-client-rust-cli" version = "0.6.8" -source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f#2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f" +source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=e0af63224dcdb00a14c0aeade878894be8304cfc#e0af63224dcdb00a14c0aeade878894be8304cfc" dependencies = [ "directories", "flate2", @@ -5924,7 +5924,7 @@ dependencies = [ [[package]] name = "prisma-client-rust-macros" version = "0.6.8" -source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f#2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f" +source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=e0af63224dcdb00a14c0aeade878894be8304cfc#e0af63224dcdb00a14c0aeade878894be8304cfc" dependencies = [ "convert_case 0.6.0", "proc-macro2", @@ -5936,7 +5936,7 @@ dependencies = [ [[package]] name = "prisma-client-rust-sdk" version = "0.6.8" -source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f#2e9ca1da3c94a14ed65eb5ef534a164bb4802a3f" +source = "git+https://github.com/Brendonovich/prisma-client-rust?rev=e0af63224dcdb00a14c0aeade878894be8304cfc#e0af63224dcdb00a14c0aeade878894be8304cfc" dependencies = [ "convert_case 0.5.0", "dmmf", diff --git a/interface/app/$libraryId/Explorer/AssignTagMenuItems.tsx b/interface/app/$libraryId/Explorer/ContextMenu/Object/AssignTagMenuItems.tsx similarity index 100% rename from interface/app/$libraryId/Explorer/AssignTagMenuItems.tsx rename to interface/app/$libraryId/Explorer/ContextMenu/Object/AssignTagMenuItems.tsx diff --git a/interface/app/$libraryId/Explorer/ContextMenu/Object/Items.tsx b/interface/app/$libraryId/Explorer/ContextMenu/Object/Items.tsx index 4e3c0deab..eaf6fa3cf 100644 --- a/interface/app/$libraryId/Explorer/ContextMenu/Object/Items.tsx +++ b/interface/app/$libraryId/Explorer/ContextMenu/Object/Items.tsx @@ -2,7 +2,7 @@ import { ArrowBendUpRight, TagSimple } from 'phosphor-react'; import { FilePath, ObjectKind, Object as ObjectType, useLibraryMutation } from '@sd/client'; import { ContextMenu } from '@sd/ui'; import { showAlertDialog } from '~/components'; -import AssignTagMenuItems from '../../AssignTagMenuItems'; +import AssignTagMenuItems from './AssignTagMenuItems'; export const RemoveFromRecents = ({ object }: { object: ObjectType }) => { const removeFromRecents = useLibraryMutation('files.removeAccessTime'); diff --git a/interface/app/$libraryId/Explorer/Inspector/index.tsx b/interface/app/$libraryId/Explorer/Inspector/index.tsx index e1e7e3d8e..a4f6ce40f 100644 --- a/interface/app/$libraryId/Explorer/Inspector/index.tsx +++ b/interface/app/$libraryId/Explorer/Inspector/index.tsx @@ -18,7 +18,7 @@ import { } from '@sd/client'; import { Button, Divider, DropdownMenu, Tooltip, tw } from '@sd/ui'; import { useIsDark } from '~/hooks'; -import AssignTagMenuItems from '../AssignTagMenuItems'; +import AssignTagMenuItems from '../ContextMenu/Object/AssignTagMenuItems'; import FileThumb from '../FilePath/Thumb'; import FavoriteButton from './FavoriteButton'; import Note from './Note'; diff --git a/interface/app/$libraryId/Explorer/View/index.tsx b/interface/app/$libraryId/Explorer/View/index.tsx index bfe5d9395..5cdf9d99b 100644 --- a/interface/app/$libraryId/Explorer/View/index.tsx +++ b/interface/app/$libraryId/Explorer/View/index.tsx @@ -37,7 +37,7 @@ import { useExplorerViewContext } from '../ViewContext'; import { useExplorerConfigStore } from '../config'; -import { ExplorerLayoutMode, getExplorerStore } from '../store'; +import { getExplorerStore, useExplorerStore } from '../store'; import GridView from './GridView'; import ListView from './ListView'; import MediaView from './MediaView'; @@ -114,34 +114,21 @@ export interface ExplorerViewProps, 'multiSelect' | 'selectable' | 'isRenaming' | 'setIsRenaming' | 'setIsContextMenuOpen' > { - layout: ExplorerLayoutMode; className?: string; - emptyNotice?: JSX.Element | { icon?: Icon | ReactNode; message?: ReactNode } | null; + emptyNotice?: JSX.Element; } export default memo( ({ - layout, className, emptyNotice, ...contextProps }: ExplorerViewProps) => { + const { layoutMode } = useExplorerStore(); + const [isContextMenuOpen, setIsContextMenuOpen] = useState(false); const [isRenaming, setIsRenaming] = useState(false); - const emptyNoticeIcon = (icon?: Icon) => { - const Icon = - icon ?? - { - grid: GridFour, - media: MonitorPlay, - columns: Columns, - rows: Rows - }[layout]; - - return ; - }; - useKeyDownHandlers({ items: contextProps.items, selected: contextProps.selected, @@ -176,26 +163,12 @@ export default memo( } as ExplorerViewContext } > - {layout === 'grid' && } - {layout === 'rows' && } - {layout === 'media' && } + {layoutMode === 'grid' && } + {layoutMode === 'rows' && } + {layoutMode === 'media' && } - ) : emptyNotice === null ? null : isValidElement(emptyNotice) ? ( - emptyNotice ) : ( -
- {emptyNotice && 'icon' in emptyNotice - ? isValidElement(emptyNotice.icon) - ? emptyNotice.icon - : emptyNoticeIcon(emptyNotice.icon as Icon) - : emptyNoticeIcon()} - -

- {emptyNotice && 'message' in emptyNotice - ? emptyNotice.message - : 'This list is empty'} -

-
+ emptyNotice )} @@ -206,6 +179,41 @@ export default memo( } ) as (props: ExplorerViewProps) => JSX.Element; +export const EmptyNotice = ({ + icon, + message +}: { + icon?: Icon | ReactNode; + message?: ReactNode; +}) => { + const { layoutMode } = useExplorerStore(); + + const emptyNoticeIcon = (icon?: Icon) => { + const Icon = + icon ?? + { + grid: GridFour, + media: MonitorPlay, + columns: Columns, + rows: Rows + }[layoutMode]; + + return ; + }; + + return ( +
+ {icon + ? isValidElement(icon) + ? icon + : emptyNoticeIcon(icon as Icon) + : emptyNoticeIcon()} + +

{message !== undefined ? message : 'This list is empty'}

+
+ ); +}; + const useKeyDownHandlers = ({ items, selected, diff --git a/interface/app/$libraryId/Explorer/index.tsx b/interface/app/$libraryId/Explorer/index.tsx index c9c104421..9a7f4e46d 100644 --- a/interface/app/$libraryId/Explorer/index.tsx +++ b/interface/app/$libraryId/Explorer/index.tsx @@ -8,7 +8,7 @@ import ContextMenu from './ContextMenu'; import DismissibleNotice from './DismissibleNotice'; import { Inspector } from './Inspector'; import ExplorerContextMenu from './ParentContextMenu'; -import View, { ExplorerViewProps } from './View'; +import View, { EmptyNotice, ExplorerViewProps } from './View'; import { useExplorerStore } from './store'; import { useExplorerSearchParams } from './util'; @@ -73,7 +73,6 @@ export default function Explorer(props: Props) { {props.items && props.items.length > 0 && } } emptyNotice={ - props.emptyNotice || { - icon: FolderNotchOpen, - message: 'This folder is empty' - } + props.emptyNotice || ( + + ) } /> diff --git a/interface/app/$libraryId/overview/index.tsx b/interface/app/$libraryId/overview/index.tsx index 962f13ff4..12c1ba65f 100644 --- a/interface/app/$libraryId/overview/index.tsx +++ b/interface/app/$libraryId/overview/index.tsx @@ -16,7 +16,6 @@ import { useItems } from './data'; export const Component = () => { const explorerStore = useExplorerStore(); - const page = usePageLayout(); const [selectedCategory, setSelectedCategory] = useState('Recents'); @@ -41,7 +40,6 @@ export const Component = () => {
{ top={68} className={explorerStore.layoutMode === 'rows' ? 'min-w-0' : undefined} contextMenu={selectedItem && } - emptyNotice={null} /> {explorerStore.showInspector && ( diff --git a/interface/app/$libraryId/tag/$id.tsx b/interface/app/$libraryId/tag/$id.tsx index 93696d67a..dbaa402d7 100644 --- a/interface/app/$libraryId/tag/$id.tsx +++ b/interface/app/$libraryId/tag/$id.tsx @@ -5,6 +5,7 @@ import { useZodRouteParams } from '~/hooks'; import Explorer from '../Explorer'; import { ExplorerContext } from '../Explorer/Context'; import { DefaultTopBarOptions } from '../Explorer/TopBarOptions'; +import { EmptyNotice } from '../Explorer/View'; import { TopBarPortal } from '../TopBar/Portal'; export const Component = () => { @@ -35,10 +36,7 @@ export const Component = () => { } /> } /> );