1 | import * as React from 'react';
|
2 | import PropTypes from 'prop-types';
|
3 | import { exactProp } from '@material-ui/utils';
|
4 | const useEnhancedEffect = typeof window !== 'undefined' && process.env.NODE_ENV !== 'test' ? React.useLayoutEffect : React.useEffect;
|
5 | /**
|
6 | * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).
|
7 | *
|
8 | * This component can be useful in a variety of situations:
|
9 | * - Escape hatch for broken dependencies not supporting SSR.
|
10 | * - Improve the time-to-first paint on the client by only rendering above the fold.
|
11 | * - Reduce the rendering time on the server.
|
12 | * - Under too heavy server load, you can turn on service degradation.
|
13 | */
|
14 |
|
15 | function NoSsr(props) {
|
16 | const {
|
17 | children,
|
18 | defer = false,
|
19 | fallback = null
|
20 | } = props;
|
21 | const [mountedState, setMountedState] = React.useState(false);
|
22 | useEnhancedEffect(() => {
|
23 | if (!defer) {
|
24 | setMountedState(true);
|
25 | }
|
26 | }, [defer]);
|
27 | React.useEffect(() => {
|
28 | if (defer) {
|
29 | setMountedState(true);
|
30 | }
|
31 | }, [defer]); // We need the Fragment here to force react-docgen to recognise NoSsr as a component.
|
32 |
|
33 | return /*#__PURE__*/React.createElement(React.Fragment, null, mountedState ? children : fallback);
|
34 | }
|
35 |
|
36 | process.env.NODE_ENV !== "production" ? NoSsr.propTypes = {
|
37 | // ----------------------------- Warning --------------------------------
|
38 | // | These PropTypes are generated from the TypeScript type definitions |
|
39 | // | To update them edit the d.ts file and run "yarn proptypes" |
|
40 | // ----------------------------------------------------------------------
|
41 |
|
42 | /**
|
43 | * You can wrap a node.
|
44 | */
|
45 | children: PropTypes.node,
|
46 |
|
47 | /**
|
48 | * If `true`, the component will not only prevent server-side rendering.
|
49 | * It will also defer the rendering of the children into a different screen frame.
|
50 | */
|
51 | defer: PropTypes.bool,
|
52 |
|
53 | /**
|
54 | * The fallback content to display.
|
55 | */
|
56 | fallback: PropTypes.node
|
57 | } : void 0;
|
58 |
|
59 | if (process.env.NODE_ENV !== 'production') {
|
60 | // eslint-disable-next-line
|
61 | NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes);
|
62 | }
|
63 |
|
64 | export default NoSsr; |
\ | No newline at end of file |