diff --git a/new-lamassu-admin/src/pages/Customers/CustomerPhotos.js b/new-lamassu-admin/src/pages/Customers/CustomerPhotos.js
index ebf722f6..6bb8a19c 100644
--- a/new-lamassu-admin/src/pages/Customers/CustomerPhotos.js
+++ b/new-lamassu-admin/src/pages/Customers/CustomerPhotos.js
@@ -13,10 +13,14 @@ import PhotosCarousel from './components/PhotosCarousel'
const useStyles = makeStyles(styles)
-const CustomerPhotos = ({ photosData, set }) => {
+const CustomerPhotos = ({ photosData }) => {
const classes = useStyles()
const [photosDialog, setPhotosDialog] = useState(false)
+ const [photoClickedIndex, setPhotoClickIndex] = useState(null)
+ const orderedPhotosData = !R.isNil(photoClickedIndex)
+ ? R.compose(R.flatten, R.reverse, R.splitAt(photoClickedIndex))(photosData)
+ : photosData
return (
@@ -24,36 +28,45 @@ const CustomerPhotos = ({ photosData, set }) => {
{'Photos & files'}
- {R.map(
- it => (
-
- ),
- photosData
- )}
+ {photosData.map((elem, idx) => (
+
+ ))}
}
+ data={}
onDissmised={() => {
setPhotosDialog(false)
+ setPhotoClickIndex(null)
}}
/>
)
}
-export const PhotoCard = ({ date, src, setPhotosDialog }) => {
+export const PhotoCard = ({
+ idx,
+ date,
+ src,
+ setPhotosDialog,
+ setPhotoClickIndex
+}) => {
const classes = useStyles()
return (
setPhotosDialog(true)}>
+ onClick={() => {
+ setPhotoClickIndex(idx)
+ setPhotosDialog(true)
+ }}>
diff --git a/new-lamassu-admin/src/pages/Customers/CustomerPhotos.styles.js b/new-lamassu-admin/src/pages/Customers/CustomerPhotos.styles.js
index 88095ea3..a7fdffe4 100644
--- a/new-lamassu-admin/src/pages/Customers/CustomerPhotos.styles.js
+++ b/new-lamassu-admin/src/pages/Customers/CustomerPhotos.styles.js
@@ -17,7 +17,9 @@ const styles = {
objectFit: 'cover',
objectPosition: 'center',
width: 224,
- height: 200
+ height: 200,
+ borderTopLeftRadius: 4,
+ borderTopRightRadius: 4
},
photoCardChip: {
margin: [[0, 16, 0, 0]]