From 2e19c18a71aab2e2552c129baba88dcd3b6ff480 Mon Sep 17 00:00:00 2001
From: Anthony Geourjon <anthony.geourjon@tetras-libre.fr>
Date: Fri, 27 Jan 2023 17:38:06 +0100
Subject: [PATCH] WIP on accordion in a component
---
.../AnnotationManifestsAccordion.js | 76 +++++++++++++++++++
1 file changed, 76 insertions(+)
create mode 100644 src/components/AnnotationManifestsAccordion.js
diff --git a/src/components/AnnotationManifestsAccordion.js b/src/components/AnnotationManifestsAccordion.js
new file mode 100644
index 000000000..08f709010
--- /dev/null
+++ b/src/components/AnnotationManifestsAccordion.js
@@ -0,0 +1,76 @@
+import React, { Component } from 'react';
+import Accordion from '@material-ui/core/Accordion';
+import AccordionSummary from '@material-ui/core/AccordionSummary';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMoreSharp';
+import Typography from '@material-ui/core/Typography';
+import AccordionDetails from '@material-ui/core/AccordionDetails';
+import { MiradorMenuButton } from './MiradorMenuButton';
+import PlaylistAddIcon from '@material-ui/icons/PlaylistAdd';
+
+
+export class AnnotationManifestsAccordion extends Component {
+
+ constructor(props) {
+ super(props);
+ }
+
+ render() {
+
+ const {
+ classes,
+ annotation
+ } = this.props;
+
+ return (
+ (annotation.idIsManifest || annotation.manifestsInContent) && (
+ <div>
+ <Accordion>
+ <AccordionSummary
+ expandIcon={<ExpandMoreIcon/>}
+ >
+ <Typography className={classes.heading}>Manifests found :</Typography>
+ </AccordionSummary>
+ <AccordionDetails>
+ <Typography>
+ {annotation.idIsManifest && (
+ <div className={classes.manifestOpeningWrapper}>
+ <div>{annotation.id}</div>
+ <MiradorMenuButton
+ aria-haspopup="true"
+ aria-label={t('openManifestInOtherWindow', { manifest: annotation.id })}
+ titleAccess={t('openManifestInOtherWindow', { manifest: annotation.id })}
+ onClick={(e) => {
+ this.handleOpenManifestSideToSide(e, annotation.id);
+ }}
+ className={classes.manifestOpeningButton}
+ >
+ <PlaylistAddIcon/>
+ </MiradorMenuButton>
+ </div>
+ )}
+ {annotation.manifestsInContent && annotation.manifestsInContent.map(manifestId => (
+ <div className={classes.manifestOpeningWrapper}>
+ <div>{manifestId}</div>
+ <MiradorMenuButton
+ aria-haspopup="true"
+ aria-label={t('openManifestInOtherWindow')}
+ titleAccess={t('openManifestInOtherWindow')}
+ onClick={(e) => {
+ this.handleOpenManifestSideToSide(e, manifestId);
+ }}
+ className={classes.manifestOpeningButton}
+ >
+ <PlaylistAddIcon/>
+ </MiradorMenuButton>
+ </div>
+ ))}
+ </Typography>
+ </AccordionDetails>
+ </Accordion>
+ </div>
+
+ )
+ )
+ }
+
+}
--
GitLab