"use client";

import dynamic from "next/dynamic";

import { MapPanelSkeleton } from "@components/loading/MapComponentSkeletons";
import MapToolbar from "@components/olmap/core/Controls/Toolbar";

const DMALeakDetectionPanel = dynamic(
  () => import("@/components/olmap/DMALeakDetection/DMALeakDetectionPanel"),
  {
    loading: () => <MapPanelSkeleton variant="dma-leak-detection" />,
  },
);

export default function Home() {
  return (
    <>
      <MapToolbar
        queryType="scheme"
        schemeType="dma_leak_identification"
        hiddenButtons={["style"]}
      />
      <DMALeakDetectionPanel />
    </>
  );
}