63 lines
1.8 KiB
JavaScript
63 lines
1.8 KiB
JavaScript
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { ThumbnailEntry } from './ThumbnailEntry';
|
|
import ThumbnailEntryDragSource from './ThumbnailEntryDragSource.js';
|
|
import './StudyBrowser.styl';
|
|
|
|
class StudyBrowser extends Component {
|
|
static defaultProps = {
|
|
studies: [],
|
|
supportsDragAndDrop: true,
|
|
};
|
|
|
|
static propTypes = {
|
|
studies: PropTypes.array.isRequired,
|
|
supportsDragAndDrop: PropTypes.bool.isRequired,
|
|
onThumbnailClick: PropTypes.func,
|
|
onThumbnailDoubleClick: PropTypes.func,
|
|
};
|
|
|
|
render() {
|
|
const studies = this.props.studies;
|
|
|
|
const thumbnails = studies.map((study, studyIndex) => {
|
|
return study.thumbnails.map((thumb, thumbIndex) => {
|
|
if (this.props.supportsDragAndDrop) {
|
|
return (
|
|
<ThumbnailEntryDragSource
|
|
key={thumb.displaySetInstanceUid}
|
|
{...study}
|
|
{...thumb}
|
|
id={`${studyIndex}_${thumbIndex}`}
|
|
onClick={this.props.onThumbnailClick}
|
|
onDoubleClick={this.props.onThumbnailDoubleClick}
|
|
/>
|
|
);
|
|
} else {
|
|
return (
|
|
<div className="ThumbnailEntryContainer">
|
|
<ThumbnailEntry
|
|
key={thumb.displaySetInstanceUid}
|
|
{...study}
|
|
{...thumb}
|
|
id={`${studyIndex}_${thumbIndex}`}
|
|
onClick={this.props.onThumbnailClick}
|
|
onDoubleClick={this.props.onThumbnailDoubleClick}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
});
|
|
});
|
|
|
|
const components = thumbnails.flat();
|
|
return (
|
|
<div className="StudyBrowser">
|
|
<div className="scrollable-study-thumbnails">{components}</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export { StudyBrowser };
|