import React, { useState } from 'react';
import WmsMapModal from '@rytass/wms-map-react-components';
import { ViewMode } from '@rytass/wms-map-react-components/typings';

const App = () => {
  const [isOpen, setIsOpen] = useState(false);

  return (
    <div>
      <button onClick={() => setIsOpen(true)}>Open Map Editor</button>

      <WmsMapModal
        open={isOpen}
        onClose={() => setIsOpen(false)}
        viewMode={ViewMode.EDIT}
        onSave={mapData => {
          console.log('Saved map data:', mapData);
        }}
        onNodeClick={nodeInfo => {
          console.log('Node clicked:', nodeInfo);
        }}
      />
    </div>
  );
};

export default App;