diff --git a/ui/src/album/AlbumListView.js b/ui/src/album/AlbumListView.js
index b62fc43d..c28ac05d 100644
--- a/ui/src/album/AlbumListView.js
+++ b/ui/src/album/AlbumListView.js
@@ -1,7 +1,9 @@
-import React from 'react'
+import React, { cloneElement, isValidElement, useState } from 'react'
import {
BooleanField,
Datagrid,
+ DatagridBody,
+ DatagridRow,
DateField,
NumberField,
Show,
@@ -30,6 +32,38 @@ const AlbumDetails = (props) => {
)
}
+const AlbumDatagridRow = ({ children, ...rest }) => {
+ const [visible, setVisible] = useState(false)
+ const childCount = React.Children.count(children)
+ return (
+ setVisible(true)}
+ onMouseLeave={() => setVisible(false)}
+ {...rest}
+ >
+ {React.Children.map(
+ children,
+ (child, index) =>
+ child &&
+ isValidElement(child) &&
+ (index < childCount - 1
+ ? child
+ : cloneElement(child, {
+ visible,
+ ...rest,
+ }))
+ )}
+
+ )
+}
+
+const AlbumDatagridBody = (props) => (
+ } />
+)
+const AlbumDatagrid = (props) => (
+ } />
+)
+
const AlbumListView = ({ hasShow, hasEdit, hasList, ...rest }) => {
const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md'))
const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs'))
@@ -48,7 +82,7 @@ const AlbumListView = ({ hasShow, hasEdit, hasList, ...rest }) => {
{...rest}
/>
) : (
- } rowClick={'show'} {...rest}>
+ } rowClick={'show'} {...rest}>
{isDesktop && }
@@ -56,7 +90,7 @@ const AlbumListView = ({ hasShow, hasEdit, hasList, ...rest }) => {
{isDesktop && }
-
+
)
}