Duplicate render of array items

[orhalimi]

**React Easy State version:**6.3.0
Platform: browser

Describe the bug
I am using react-easy-state to push a list of logs objects, limits to 30. The component however seems like rendering some of the items multiple times (more than 30 even due I see 30 items in the console).

I am using gameloop that push 3 logs objects every 2 seconds. I think that the speed/hierarchy prevents it from detect changed sometimes.

looks something like that:

let logObj={
            id: Date.now(), 
            cssClass: cssClass || eventCssClass, 
            customCss, 
            category: category|| eventCategory,
            message: customMessage || eventMessage,
}
logsStore.addEntry(logObj);

//--------------

const logsStore = store({
    logs:[],
    addEntry(logParams){
        logsStore.logs = [...logsStore.logs.slice(-30), logParams];
    },
});

///------------------

const logScreen = view(props => {
	const logEntries = logsStore.logs.map(logEntry=>(
		<div
			key={logEntry.id}
			data-key={logEntry.id}
			style={logEntry.customCss ? logEntry.customCss : {}}
			className={classnames('log-entry', {[logEntry.cssClass]:logEntry.cssClass})}
		>
			{logEntry.message}
		</div>));

	return (
		<div className="log-screen col-md-4">
			<p>Recent events:</p>
			<p>{	logEntries.length}</p>
			<div className="logs-container">
			{	logEntries}
			
			</div>
		</div>
	);
});

[orhalimi]

Update, the bug was that id: Date.now() would render the same for batch updates. Not sure why but change ot to unique id for key attribute solved it