diff --git a/src/Gallery.js b/src/Gallery.js index 15b5864..d0cf164 100755 --- a/src/Gallery.js +++ b/src/Gallery.js @@ -28,12 +28,6 @@ class Gallery extends Component { this.onResize(); } - componentWillReceiveProps (np) { - if (this.state.currentImage > np.images.length - 1) { - this.setState({currentImage: np.images.length - 1}); - } - } - componentDidUpdate () { if (!this._gallery) return; if (this.getContainerWidth() @@ -56,6 +50,10 @@ class Gallery extends Component { return Math.floor(width); } + getCurrentImageIndex() { + return Math.min(this.state.currentImage, this.props.images.length - 1) + } + openLightbox (index, event) { if (event) { event.preventDefault(); @@ -89,19 +87,19 @@ class Gallery extends Component { gotoPrevious () { if (this.props.currentImageWillChange) { - this.props.currentImageWillChange.call(this, this.state.currentImage - 1); + this.props.currentImageWillChange.call(this, this.getCurrentImageIndex() - 1); } this.setState({ - currentImage: this.state.currentImage - 1 + currentImage: this.getCurrentImageIndex() - 1 }); } gotoNext () { if (this.props.currentImageWillChange) { - this.props.currentImageWillChange.call(this, this.state.currentImage + 1); + this.props.currentImageWillChange.call(this, this.getCurrentImageIndex() + 1); } this.setState({ - currentImage: this.state.currentImage + 1 + currentImage: this.getCurrentImageIndex() + 1 }); } @@ -202,7 +200,7 @@ class Gallery extends Component { { expect(arg2.target).toBeDefined(); expect(arg2.altKey).toBeDefined(); }); + + it("should switch lightbox image when current image is no longer present", () => { + const { rerender } = render(); + const [, secondItem] = screen.getAllByTestId( + "grid-gallery-item_thumbnail" + ); + fireEvent.click(secondItem); + rerender(); + + expect(getLightboxImage()).toHaveAttribute("src", image1.src); + }); }); describe("Selection", () => {