43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { Canvas } from "@react-three/fiber";
|
|
import { useParams } from "react-router-dom";
|
|
import VirtualTourWrapper from "../components/virtualTour/VirtualTourWrapper";
|
|
import { IAppartmentSphere } from "../types/apartmentSphere";
|
|
import _appartment from "../data/appartments.json";
|
|
import VirtualTourTopPanel from "../components/virtualTour/VirtualTourTopPanel";
|
|
import ButtomPanelCompassVirtualTour from "../components/virtualTour/ButtomPanelCompassVirualTour";
|
|
import VirtualTourSidebar from "../components/virtualTour/VirtualTourSidebar";
|
|
|
|
const appartments = _appartment as IAppartmentSphere[];
|
|
|
|
const VirtualTour = () => {
|
|
const [currentAppartment, setCurrentAppartment] =
|
|
useState<null | IAppartmentSphere>(null);
|
|
|
|
const { appartmentTypeId } = useParams();
|
|
|
|
useEffect(() => {
|
|
const _currentAppartment = appartments.find(
|
|
(app) => app.id === appartmentTypeId
|
|
);
|
|
if (_currentAppartment) {
|
|
setCurrentAppartment(_currentAppartment);
|
|
}
|
|
}, [appartmentTypeId]);
|
|
|
|
return (
|
|
<div className="overflow-hidden h-screen w-screen">
|
|
<VirtualTourTopPanel />
|
|
<VirtualTourSidebar currentAppartment={currentAppartment} />
|
|
<Canvas>
|
|
{currentAppartment && (
|
|
<VirtualTourWrapper appartment={currentAppartment} />
|
|
)}
|
|
</Canvas>
|
|
<ButtomPanelCompassVirtualTour />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default VirtualTour;
|