Помогите пожалуйста, начал изучать реакт, пытаюсь сделать часы в компоненте, в консоль время попадает, но на return не возвращает разметку в div
import React from 'react'
import './progressBar.scss'
export default function progressBar(props){
return(
<div className="progress-bar">
{clock()}
</div>
)
}
function clock(){
setInterval(()=>{
var date = new Date(),
hours = (date.getHours() < 10) ? '0' + date.getHours() : date.getHours(),
minutes = (date.getMinutes() < 10) ? '0' + date.getMinutes() : date.getMinutes(),
seconds = (date.getSeconds() < 10) ? '0' + date.getSeconds() : date.getSeconds();
console.log(hours + ':' + minutes + ':' + seconds)
return (
<p>{hours + ':' + minutes + ':' + seconds}</p>
)
},1000)
}