Stop streaming in componentWillUnmount

[BibhuVijayan]

Currently recording never stop after component is unmounted. Should we stop recording after componentWillUnmount?

[Morsmetus]

Really need a way to do this but had no luck

[hackingbeauty]

Yes, stop recording after component is unmounted. In componentWillUnmount just set the state of ReactMic to recording={false}.

If you have multiple components that are interacting with React-Mic or React-Mic-Plus, you probably need to use Redux to stop recording when unmounting.

It's very simple. I can create a video lesson if required.

[Morsmetus]

Just to be clear, I am talking about red dot in browsers, recording works fine, but red dot won't go away without workaround.

It was really simple for static content, but in my case I needed to hide recording component after recording being stopped, so I had two states, one for view, and one for record, because only working solution was first make recording stop, and then close the recording view.

View was in modal and after closing modal even if I set record state to false in componentWillUnmount it was still showing a red dot. (Recording was fine, I am talking about the red dot) so only way I could get rid of red dot was to implement clickaway listener, and before clicking close from modal, set recording to false which was not a pretty solution, but working fine.

Thing is I had to move away from this lib anyways, because webm format was not played in IOS app and we needed mp3 format. I tried to use @cleandersonlobo/react-mic fork for it, but on his version red dot doesn't go away even if I do all the stuff I explained above.

[hackingbeauty]

Also, @cleandersonlobo/react-mic doesn't give you a cool visualization that works in Safari on iOS. So if you just want to record audio, with no visual effects, and have it work across devices...then @cleandersonlobo/react-mic could be a solution for you.

On Wed, Dec 11, 2019 at 8:02 AM Tornike Mamatsashvili < [email protected]> wrote:

It was really simple for static content, but in my case I needed to hide recording component after recording being stopped, so I had two states, one for view, and one for record, because only working solution was first make recording stop, and then close the recording view.

View was in modal and after closing modal even if I set record state to false in componentWillUnmount it was still showing a red dot. (Recording was fine, I am talking about the red dot) so only way I could get rid of red dot was to implement clickaway listener, and before clicking close from modal, set recording to false which was not a pretty solution, but working fine.

Thing is I had to move away from this lib anyways, because webm format was not played in IOS app and we needed mp3 format. I tried to use @cleandersonlobo/react-mic fork for it, but on his version red dot doesn't go away even if I do all the stuff I explained above.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/hackingbeauty/react-mic/issues/70?email_source=notifications&email_token=AAAE5H7TXYDY2GKH3SLEKULQYEFKDA5CNFSM4IFU5PU2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEGTUXTI#issuecomment-564612045, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAE5HYSOHAENPTOPEKBGT3QYEFKDANCNFSM4IFU5PUQ .

-- Mark M. Muskardin

[hackingbeauty]

@Morsmetus Red dot issue is fixed in React-Mic-Gold. Also, you can record in MP3 using React-Mic-Gold. You can find the premium upgrade here.

See demo here: https://voicerecordpro.com/#/record