import React from 'react' ; import * as Styled from './TimePanel.styles' ; import Clock from '../Clock/Clock' ; import CurrentDate from '../CurrentDate/CurrentDate' ; import { useActions } from '../../hooks/useActions' ; function returns { JSX . Element } const TimePanel = ( ) : JSX . Element => { const { openCalendarModal } = useActions ( ) ; const handleOpenCalendar = ( ) => openCalendarModal ( ) ; return ( < Styled . Container onClick = { handleOpenCalendar } > < Clock variant = { 'middleFont' } /> < CurrentDate variant = { 'middleFont' } / > < /Styled.Container>); } ; export default TimePanel ;