text: import React, {useEffect} from 'react';
  import {useHistory} from 'react-router-dom';
  import {useSelector, useDispatch} from 'react-redux';
  import RandomSearch from '@pages/random/RandomSearch';
  import {toast} from 'react-toastify';
  import {
      searchRandom,
      clearSearchRandom,
      setSearchForm
  } from '../../store/random';
  import Spinner from '../../components/spinner/Spinner';
  import {getErrorMsg} from '../../lib/commonUiUtils';
  
  /*
   * 난수 상단 검색 Container
   */
  function RandomSearchContainer() {
      const dispatch = useDispatch();
      const history = useHistory();
  
      const {searchForm} = useSelector((state) => state.random);
      const {loading: searchLoading, error: searchError} = useSelector(
          (state) => state.random.search
      );
      const onSearch = (_searchForm = searchForm) => {
          dispatch(
              searchRandom(
                  _searchForm.key,
                  _searchForm.randName,
                  _searchForm.isUser
              )
          );
      };
  
      const onChangeSearchForm = (newSearchForm) => {
          dispatch(setSearchForm(newSearchForm));
      };
  
      useEffect(() => {
          // 2021-10-06 screen 갱신 초기화
          if (history.action === 'PUSH') {
              const initSearchForm = {
                  key: '',
                  randName: '',
                  isUser: '',
                  page: 1,
                  size: null
              };
              onChangeSearchForm(initSearchForm);
              onSearch(initSearchForm);
          }
          if (history.action === 'POP') {
              onSearch();
          }
      }, []);
  
      useEffect(() => {
          if (!searchLoading && searchError) {
              toast.error(getErrorMsg(searchError, 'search'));
              dispatch(clearSearchRandom());
          }
      }, [searchError]);
  
      return (
          <>
              <RandomSearch
                  onSearch={onSearch}
                  searchForm={searchForm}
                  onChangeSearchForm={onChangeSearchForm}
              />
              <Spinner isLoading={searchLoading} />
          </>
      );
  }
  
  export default RandomSearchContainer;
  