search

nhagen / react-intercom

A component to configure and enable Intercom in your react application
MIT License
237 stars 72 forks source link

Supply a prop to hide the messenger launcher #38

Closed mbifulco closed 6 years ago

mbifulco commented 7 years ago

Hi there - I'm working on an app where I'd like to hide the messenger launcher on mobile views, so that we can manage screen real estate a little more carefully on small devices. I'm not sure there's a way to do this with this package in its current state.

I'd love to be able to provide a prop to this component that hides the messenger launcher (per these docs).

RafikiTiki commented 6 years ago

You could pass a hide_default_luncher prop to <Intercom /> but you will need to configure Intercom as said in the docs (last paragraph):

  1. First, you’ll need to hide the Messenger for all of your customers. Just visit your Messenger settings page and deselect the options for turning the Messenger on.
  2. Next, you’ll need to think about which users you’d like to show the Messenger to (for example, your VIP customers).
  3. Finally, add the hide_default_launcher attribute to your intercomSettings object on your site. The value of the hide_default_launcher attribute should be true or false, depending on if you want to hide or show the launcher.

Another way is to use https://github.com/contra/react-responsive and wrap your Intercom component by <MediaQuery minWidth={phoneBreakpointWidth} /> so it'll render only on bigger screens. If you choose first approach you'll still need to figure out value of the hide_default_luncher on your own.

nhagen commented 6 years ago

Thanks @RafikiTiki for sharing a solution. @mbifulco if that isn't what you're looking for, I'm happy to reopen this thread.