Source

components/with-client-side-only.js

  1. import { connect } from "react-redux";
  2. import { mapStateToProps, mapDispatchToProps } from './impl/client-side-only-impl';
  3. /**
  4. * This component calls the render prop with `clientSideRendered` = true if the client side is completely loaded, and false during SSR and initial bootup.
  5. *
  6. * Example
  7. * ```javascript
  8. * import { WithClientSideOnly } from '@quintype/components';
  9. * <WithClientSideOnly>
  10. * {({clientSideRendered}) => (
  11. * {clientSideRendered && <span>This will be shown only on the client side</span>}
  12. * )}
  13. * </WithClientSideOnly>
  14. * ```
  15. * @component
  16. * @category Other
  17. */
  18. export const WithClientSideOnly = connect(mapStateToProps, mapDispatchToProps)(WithClientSideOnlyBase);
  19. function WithClientSideOnlyBase({ clientSideRendered = false, children }) {
  20. return children({ clientSideRendered })
  21. }