File size: 1,494 Bytes
0c20ea8 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
import { useState, useEffect } from "react";
import { Poi } from "../../redux/types/Poi";
import { convertModeObjectToArray } from "../../utils/convertModeObjectToArray";
import { FaWalking } from "react-icons/fa";
import { AiFillCar } from "react-icons/ai";
import { formatDate } from "../../utils/formatDate";
import { FaLocationDot } from "react-icons/fa6";
import { TbWorldLatitude, TbWorldLongitude } from "react-icons/tb";
import { BiTimeFive } from "react-icons/bi";
type DemographicsSectionProps = {
selectedPoi: Poi;
};
const DescriptionSection: React.FC<DemographicsSectionProps> = ({
selectedPoi,
}) => {
return (
<div className="sectionBasicInfoOne">
<div className="basicInfoLabelsOne">
<FaLocationDot style={{ fontSize: "25px", marginRight: "10px" }} />
{selectedPoi ? selectedPoi?.address : "unknown"}
</div>
<div className="basicInfoLabelsOne">
<TbWorldLatitude style={{ fontSize: "25px", marginRight: "10px" }} />
{selectedPoi ? selectedPoi?.lat : "unknown"}
</div>
<div className="basicInfoLabelsOne">
<TbWorldLongitude style={{ fontSize: "25px", marginRight: "10px" }} />
{selectedPoi ? selectedPoi?.lng : "unknown"}
</div>
<div className="basicInfoLabelsOne">
<BiTimeFive style={{ fontSize: "25px", marginRight: "10px" }} />
{selectedPoi ? formatDate(selectedPoi?.ts_updated) : "unknown"}
</div>
</div>
);
};
export default DescriptionSection;
|