.map function not working ReactJS

1

This is the error being shown

TypeError: comments.map is not a function

import React, { Component } from 'react';
import { Card , CardImg , CardTitle , CardBody , CardText } from 'reactstrap';

function RenderDishDetail({dish}){
	console.log("render DishDetail called")
	return(
		<div className="col-12 col-md-5 m-1">
		   	<Card>
		       	<CardImg width="100%" src={dish.image} alt={dish.name} />
				<CardBody>
		            <CardTitle>{dish.name}</CardTitle>
		            <CardText>{dish.description}</CardText>
		       	</CardBody>
		    </Card>  
		</div>
	);
}

function RenderComments(comments){
	console.log("render comments called")	
	console.log(comments);
	const comment = comments.map((unit) =>{
		return(
			<div>
				<p>{unit.comment}</p>
				<p>-- {unit.author} , {unit.date[0]}{unit.date[1]}{unit.date[2]}{unit.date[3]}{unit.date[4]}{unit.date[5]}{unit.date[6]}{unit.date[7]}{unit.date[8]}{unit.date[9]}</p>
			</div>
		);
	})
}


const DishDetail = (props) => {
	const dish = props.selectdish;
	console.log("dish detail main called")
	if(dish==null){
			console.log("Dish is null");	
			return(
				<div></div>
			)
	}
	else{
		console.log("Dish is not null");	
		return(
			<div className="container">
				<div className="row">
					<RenderDishDetail dish={props.selectdish} />
					<RenderComments dish={props.selectdish.comments} /> 
				</div>
			</div>			
		);
	}		
}

export default DishDetail;

This is the way dishes are saved:

export const DISHES =
    [
        {
        id: 0,
        name:'Uthappizza',
        image: 'assets/images/uthappizza.png',
        category: 'mains',
        label:'Hot',
        price:'4.99',
        description:'A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
        comments: [
            {
            id: 0,
            rating: 5,
            comment: "Imagine all the eatables, living in conFusion!",
            author: "John Lemon",
            date: "2012-10-16T17:57:28.556094Z"
            },
            {
            id: 1,
            rating: 4,
            comment: "Sends anyone to heaven, I wish I could get my mother-in-law to eat it!",
            author: "Paul McVites",
            date: "2014-09-05T17:57:28.556094Z"
            },

Console.log is showing:

{dish: Array(5)}
dish: Array(5)
0: {id: 0, rating: 5, comment: "Imagine all the eatables, living in conFusion!", author: "John Lemon", date: "2012-10-16T17:57:28.556094Z"}
1: {id: 1, rating: 4, comment: "Sends anyone to heaven, I wish I could get my mother-in-law to eat it!", author: "Paul McVites", date: "2014-09-05T17:57:28.556094Z"}
2: {id: 2, rating: 3, comment: "Eat it, just eat it!", author: "Michael Jaikishan", date: "2015-02-13T17:57:28.556094Z"}
3: {id: 3, rating: 4, comment: "Ultimate, Reaching for the stars!", author: "Ringo Starry", date: "2013-12-02T17:57:28.556094Z"}
4: {id: 4, rating: 2, comment: "It's your birthday, we're gonna party!", author: "25 Cent", date: "2011-12-02T17:57:28.556094Z"}
length: 5
__proto__: Array(0)
__proto__: Object
2

One hint that may point you in the right direction: map is a method that exists on arrays. Is comments an array or something different?