× TypeError: categories is not iterable

i try to show by using for ... of statement but is show me error not iterable , i did't what is here is my code categoryAction.js

import axios from "../config/axios"
import { categoryConstant } from "./constant"
export const getAllCategory = () =>{
    return async dispatch => {
         dispatch ({ type: categoryConstant.GET_ALL_CATEGORY_REQUEST} );
          const res = await axios.get(`/category/getcategory`)
         console.log(res);
         if(res.status === 200){
             const {categoryList} = res.data;
            dispatch({
                type: categoryConstant.GET_ALL_CATEGORY_SUCCESS,
                payload: { categories: categoryList }
               });
          }else{
             dispatch({
                 type: categoryConstant.GET_ALL_CATEGORY_FAILURE,
                 payload:{error: res.data.error }
             })
         }

    }
}

categoryReducer.js

import { categoryConstant } from "../actions/constant";
const initState = {
  categories: [],
  error: null,
  loading: false,
};
export default (state = initState, action) => {
  switch (action.type) {
    case categoryConstant.GET_ALL_CATEGORY_REQUEST:
        state ={
              ...state,
              loading: true
            }
      break;
    case categoryConstant.GET_ALL_CATEGORY_SUCCESS:
      state = {
        ...state,
        categories: action.payload.categories,
        loading: false
      }
      break;
  }
  return state;
};

category/index.js

import React, { useEffect,useState } from "react";
import Layout from "../../components/Layout";
import { Container, Row, Col, Modal,Button } from "react-bootstrap";
import "../../css/category.css";
import { useDispatch, useSelector } from "react-redux";
import { getAllCategory } from "../../actions";
import Input from "../../components/UI/Input";
/**
 * @author
 * @function Category
 **/
const Category = (props) => {
  const [show, setShow] = useState(false);
  const {catagoryName, setCategoryName} = useState('');
  const {parentCategoryId, setParentCategoryId } = useState('');
  const {categoryImage, setCategoryImage}= useState('');
  const category = useSelector(state => state.category);
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(getAllCategory());
  }, []);

  const handleClose = () => setShow(false);
  const handleShow = () => setShow(true);

    const renderCategories = (categories) => {
          let myCategories = [];
          for(let category of Object.entries(categories)){
            myCategories.push(
              <li>
                {category.name}
                {category.children.length > 0 ? (<ul>{renderCategories(category.children)}</ul>): null }
              </li>
            );
          }

          return myCategories;
       }
  const createCategory = (categories ,options=[]) =>{
       for (let category of categories){
          options.push({ value: category._id, name: category.name})
           if (category.childen.length >0){
              createCategory(category.childen, options)
           }
       }
       return options;
  }
  return (
    <Layout sidebar>
      <Container>
        <Row>
          <Col md={12}>
            <div className="category">
              Category
              <button className="btn bnt-primary" onClick={handleShow}>add</button>
            </div>
          </Col>
        </Row>
        <Row> 
          <Col md={12}>
            <ul>
               {renderCategories(category) && renderCategories(category.categories) }
             </ul>
          </Col>
        </Row>
      </Container>
      <Modal show={show} onHide={handleClose} animation={false}>
        <Modal.Header closeButton>
          <Modal.Title>Add new category</Modal.Title>
        </Modal.Header>
        <Modal.Body>
            <Input
               value={catagoryName}
               placeholder ={'category name'}
               onChange ={(e ) => setCategoryName(e.target.value)}
            />
            <select>
              <option> select cate</option>
              {
               createCategory(category) &&
               createCategory(category.categories).map(option =>
                <option key={option.value} value ={option.value}>{option.name} </option>
                  )
              }
            </select>
        </Modal.Body>
        <Modal.Footer>
          <Button variant="secondary" onClick={handleClose}>
            Close
          </Button>
          <Button variant="primary" onClick={handleClose}>
            Save Changes
          </Button>
        </Modal.Footer>
      </Modal>
    </Layout>
  );
};
export default Category;

enzymejs / enzyme

× TypeError: categories is not iterable #2446