Dynamic Component loader

// dynamic loading component example
import React, { useState } from 'react';
import './App.css';
import UIKit from './pages/UIKit';
import ExampleCrud from './pages/ExampleCrud';
import ExampleControlledFrom from './pages/ExampleControlledFrom';

function App() {
  const [section, setSection] = useState<number>(-1)

  function renderComponent() {
    switch(section) {
      case -1: return <div>Scegli la sezione</div>;
      case 0: return <UIKit/>;
      case 1: return <ExampleCrud/>;
      case 2: return <ExampleControlledFrom/>;
    }
  }

  return <div className="container mt-2">
    <button onClick={() => setSection(0)}>Uikit</button>
    <button onClick={() => setSection(1)}>Crud</button>
    <button onClick={() => setSection(2)}>Form</button>
    { section === -1 && <div>Scegli la sezione</div>}
    { section === 0 && <UIKit/>}
    { section === 1 && <ExampleCrud/>}
    { section === 2 && <ExampleControlledFrom />}

    {
      renderComponent()
    }
  </div>
}

export default App;