import { spawnNewFunctionDraftDigith, spawnNewSignalDraftDigith } from "src/ui/Scrowl/scrowlStore";

type Props = {
  // TODO
}

export function Controls(props: Props) {
  return (
    <aside>
      <article>
        <header>Controls</header>

        <div style={{ display: "flex", gap: "0.5rem", "flex-wrap": "wrap" }}>
          <button 
            class="outline secondary" 
            onClick={spawnNewFunctionDraftDigith}
            style={{ padding: "2px 8px", "font-size": "0.8rem", width: "auto" }}
          >
            +fn
          </button>
          
          <button 
            class="outline secondary" 
            onClick={spawnNewSignalDraftDigith}
            style={{ padding: "2px 8px", "font-size": "0.8rem", width: "auto" }}
          >
            +signal
          </button>
        </div>

        <footer>
          <small>Language v0.1.0</small>
        </footer>
      </article>
    </aside>
  );
}