react-insta-stories icon indicating copy to clipboard operation
react-insta-stories copied to clipboard

seeMore doesn't pause the story

Open koo27 opened this issue 5 years ago • 1 comments

The problem is related to the seeMore button. Basically it doesn't stop the progress of the story, and it keeps going to the next slide. Sometimes it doesn't happend, so myabe the issue is related to the 'onTouch' to block the slide (debouncePause).

~~A solution that works is to edit in the Story.tsx the const toggleMore adding a timeout of 300 ms to the props.action()~~

~~const toggleMore = (show: boolean) => {~~ ~~ setShowMore(show)~~ ~~ setTimeout(() => {~~ ~~ props.action(show ? 'pause' : 'play')~~ ~~ }, 300)~~ ~~};~~

EDIT: The solution above doesn't seem to work. Sometimes it still doesn't pause the story, but it seems to be completely random so far.

EDIT 2: I temporary solved by stopping the stories on the one with the SeeMore prop. In this way, the stories stuck on that specific story, but you are able to go to the next story by simply clicking on the screen. You can also swipe up and see the inner content of the SeeMore prop without any trouble. Obviously this doesn't solve the problem totally, since the story needs to stop without the user consent, but at least there won't be any bug.

If you want to go with this workaround, just add in Container.tsx file the following code in the first useEffect()

if (!pause && (typeof stories[currentId] === "object" && !stories[currentId].seeMore )) {

Basically I just added a statement on the type of the current story to check whether the story contains the seeMore prop.

koo27 avatar Dec 18 '19 16:12 koo27

Hi Mohit, I am facing issues in See more button: whenever I return after viewing the content in seeMore, I am getting an overhead close icon over my stories. Is this intentional? Regards Swayam

swayam2k15 avatar Jan 16 '20 04:01 swayam2k15