generateur_v3/frontend/src/routes/room/create/+page.svelte

<script lang="ts">
  import { createRoom } from "../../../requests/room.request";
  import { getContext } from "svelte";
  import { goto } from "$app/navigation";
  import InputWithLabel from "../../../components/forms/InputWithLabel.svelte";

  let name = "";
  let pseudo = "";
  const { isAuth } = getContext("auth");
</script>

<div class="container">
  <div class="form">
    <h1>Créer une salle</h1>
    <InputWithLabel label="Nom de la salle" bind:value={name} />
    {#if !$isAuth}
      <InputWithLabel label="Votre pseudo" bind:value={pseudo} />
    {/if}
    <button
      class="primary-btn"
      on:click={() => {
        console.log('(NAME)', name)
		createRoom({ name }, !$isAuth ? pseudo : null).then((r) => {
            if(!$isAuth){
                sessionStorage.setItem('reconnect', r.member)
            }
			goto(`/room/${r.room}`);
		});
	}}
    >
      Valider
    </button>
  </div>
</div>

<style lang="scss">
  h1 {
    font-size: 3em;
    margin-top: 20px;
  }

  .form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: max-content;
  }

  .container {
    display: flex;
    justify-content: center;
  }
</style>