How to use the react-hot-loader.cold function in react-hot-loader

state = { count: 0 };

  componentDidMount() {
    this.interval = setInterval(() => this.setState(prevState => ({ count: prevState.count + 1 })), 200);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  render() {
    return <div>#{this.state.count}</div>;
  }
}

export default cold(Counter);
//export default Counter;

  onComponentCreate: (type, name) => name.indexOf('styled') > 0 && cold(type),
});

  onComponentRegister: (type, name, file) => file.indexOf('node_modules') > 0 && cold(type),
  logLevel: 'no-errors-please',

dispatch(updateTestSuite(suite));
      },
      onRemoveSuite: async (path: string) => {
        dispatch(removeTestSuite(path));
      },
      onUpdateTest: async (path: string, test: Test) => {
        dispatch(updateTest({ path, test }));
      },
      setTestsRunning: async (running: boolean) => {
        dispatch(setTestsRunning(running));
      },
    },
  }),
)(FullEditorBase);

export const FullEditor = cold((props: ExternalProps) => (
  
    
  
));

import React from 'react';
import Button from '../../components/button';
import Input from '../../components/input';
import FontIcon from '../../components/font_icon';
import Tooltip, { tooltipFactory } from '../../components/tooltip';
import Chip from '../../components/chip';
import Avatar from '../../components/avatar';
import { cold } from 'react-hot-loader';

const ColdAvatar = cold(Avatar)

const TooltipFontIcon = tooltipFactory({ passthrough: false })(FontIcon);
const TooltipButton = Tooltip(Button);
const TooltipInput = Tooltip(Input);
const TooltipStrong = Tooltip(({ children, ...other }) => {
  delete other.theme;
  return <strong>{children}</strong>;
});
const TooltipStrongDirect = Tooltip('strong');
const ChipTooltip = Tooltip(Chip);

const TooltipTest = () =&gt; (
  <section>
    <h5>Tooltip</h5>
    <p>Give information on :hover</p>
    </section>

onComponentRegister: type =>
    (String(type).indexOf('useState') > 0 ||
      String(type).indexOf('useEffect') > 0) &&
    cold(type)
});

import React from 'react';
import Avatar from '../../components/avatar';
import GithubIcon from './github_icon';
import { cold } from 'react-hot-loader';

const ColdAvatar = cold(Avatar)

const AvatarTest = () => (
  <section>
    <h5>Avatars</h5>
    <p>Provide an image source or object, a font icon, children or a title to use its first letter.</p>
    
    } /&gt;
    <img alt="foobar" src="https://placeimg.com/80/80/animals">
    
    
    
    
  </section>