Как из функции вытащить готовый результат в текст? JS

Я новичок, поэтому не понимаю как сделать так, чтобы из map() передавать данные в функцию, а потом в этот же map() перетащить готовый результат.

У меня есть map(), в res.date есть данные по дате каждого дня, мне нужно его перевести из Unix Timestamp.

{dataReq.days?.map(res =>
<SimpleCell onClick={() => setDay(res)} key={Math.random()} className='button_days'>
   <Text>{}</Text>
   <img width={40} src={Sunny} alt="Sun"/>
   <Text>{Math.round(res.temperature.celsius)}</Text>
</SimpleCell>
)}

Я это делаю через функцию, вместо "day?.date" мне нужно передавать еще и "res.date"

 useEffect(() => {
        function timeConverter() {
            const a = new Date(day?.date * 1000);
            const months = ['Янв','Фев','Март','Апр','Май','Июнь','Июль','Авг','Сен','Окт','Нояб','Дек'];
            const month = months[a.getMonth()];
            const date = a.getDate();
            const time = date + ' ' + month;
            setDate(time);
        }
        timeConverter();
    }, [[], day])

Я пробовал вставить функцию, в которой передаю props, но как я понял, так делать вообще нельзя.

<Text>{timeConverter(res.date)}</Text>

Вот как это должно выглядеть: сверху над иконкой погоды, должна быть дата, которую я должен получать из функции.

Весь код:

import React, {useEffect, useState} from "react";
import Sunny from '../../assets/img/Sunny.png';
import Wind from '../../assets/img/wind.png';
import Rain from '../../assets/img/rain.png';
import Humidity from '../../assets/img/humidity.png';
import '../../assets/css/home/base.scss';
import {SimpleCell, ScreenSpinner, Text, Title, HorizontalScroll} from "@vkontakte/vkui";
import api from "../../modules/apiRequest";
import {useRecoilValue} from "recoil";
import {getIdCity} from "../../storage/selectors/idCity";
import Winter from "../../assets/img/Winter.png";


const Home = ({ }) => {

    const idCity = useRecoilValue(getIdCity);
    const [dataReq, setDataReq] = useState([]);
    const [spinner, setSpinner] = useState(<ScreenSpinner state="loading"/>)
    const [day, setDay] = useState(null);
    const [date, setDate] = useState(false);

    useEffect(() => {
        function timeConverter(props) {
            const a = new Date(day?.date * 1000);
            const months = ['Янв','Фев','Март','Апр','Май','Июнь','Июль','Авг','Сен','Окт','Нояб','Дек'];
            const month = months[a.getMonth()];
            const date = a.getDate();
            const time = date + ' ' + month;
            setDate(time);
        }
        timeConverter();
    }, [[], day])


    useEffect(() => {
        const fetchData = async() => {
            const req = await api(`current/${idCity?.id ? idCity?.id : 1}`,`GET`);
            setDataReq(req.data);
            setSpinner(null)
        }
        fetchData();
    }, [idCity])

    const test = () => {
        if (day.condition.indexOf('снег') !== -1)
            return <img src={Winter} alt="Winter"/>
        else if (day.condition.indexOf('солнечно') !== -1)
            return <img src={Sunny} alt="Sunny"/>
    }

  return (
    <>
        {spinner}
        <div className='wrapper'>
            <div className='MainSection'>
                <div className='up_info'>
                    <img width={200} src={Sunny} alt="Sunny"/>
                    <Title style={{ fontSize: 64 }}>{Math.round(day ? day.temperature?.celsius : dataReq.temperature?.celsius)}°</Title>
                </div>
                <div className='down_info'>
                    <Text style={{ textAlign: 'center', marginBottom: 2 }}>{day ? day?.condition : dataReq?.condition}</Text>
                </div>
            </div>
            <div style={{ display: 'flex', justifyContent: 'center' }}>
                <div className='additionalSection'>
                    <div style={{ display: 'flex', alignItems: 'center' }}>
                        <img width={20} src={Rain} alt="Rain"/>
                        <Text>6%</Text>
                    </div>
                    <div style={{ display: 'flex', alignItems: 'center' }}>
                        <img width={20} src={Humidity} alt="Wind"/>
                        <Text>{Math.round(day ? day?.humidity : dataReq?.humidity)}%</Text>
                    </div>
                    <div style={{ display: 'flex', alignItems: 'center' }}>
                        <img width={20} src={Wind} alt="Noun"/>
                        <Text>{Math.round(day ? day?.wind?.speed : dataReq?.wind?.speed)}</Text>
                    </div>
                </div>
            </div>
            <div style={{ display: 'flex', justifyContent: 'center' }}>
                <div className='weatherDays'>
                    <div className='title_days'>
                        <Text>{day ? date : 'Сегодня'}</Text>
                    </div>
                        <HorizontalScroll>
                            <div style={{ display: 'flex', gap: 5 }}>
                                <SimpleCell onClick={() => setDay(null)} className='button_days'>

                                    <img width={40} src={Sunny} alt="Sun"/>
                                    <Text>{Math.round(dataReq.temperature?.celsius)}</Text>
                                </SimpleCell>
                                {dataReq.days?.map(res =>
                                    <SimpleCell onClick={() => setDay(res)} key={Math.random()} className='button_days'>
                                        <Text>{}</Text>
                                        <img width={40} src={Sunny} alt="Sun"/>
                                        <Text>{Math.round(res.temperature.celsius)}</Text>
                                    </SimpleCell>
                                )}
                            </div>
                        </HorizontalScroll>
                </div>
            </div>
        </div>
    </>
  );
};

export default Home;