import type { FC } from "hono/jsx"

export const Terminal: FC = async () => (
  <>
    <link rel="stylesheet" href="/css/terminal.css" />
    <link rel="stylesheet" href="/css/editor.css" />

    <div id="command-line">
      <span id="command-prompt">&gt;</span>
      <textarea
        id="command-cursor"
        readonly={true}
        tabIndex={-1}
        rows={1}
      />
      <textarea
        type="text"
        id="command-textbox"
        autocomplete="off"
        autocorrect="off"
        autocapitalize="off"
        spellcheck={false}
        rows={1}
      />
      <textarea
        id="command-hint"
        readonly={true}
        tabIndex={-1}
        rows={1}
      />
    </div>

    <ul id="scrollback">
      <li class="center">**** NOSE PLUTO V{new Date().getMonth() + 1}.{new Date().getDate()} ****</li>
      <li class="center">VRAM <span id="vram-size">000KB</span></li>
    </ul>
  </>
)