Website/src/components/dashboard/SchematicInfo.svelte

<!--
  -   This file is a part of the SteamWar software.
  -
  -   Copyright (C) 2023 SteamWar.de-Serverteam
  -
  -   This program is free software: you can redistribute it and/or modify
  -   it under the terms of the GNU Affero General Public License as published by
  -   the Free Software Foundation, either version 3 of the License, or
  -   (at your option) any later version.
  -
  -   This program is distributed in the hope that it will be useful,
  -   but WITHOUT ANY WARRANTY; without even the implied warranty of
  -   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  -   GNU Affero General Public License for more details.
  -
  -   You should have received a copy of the GNU Affero General Public License
  -   along with this program.  If not, see <https://www.gnu.org/licenses/>.
  -->

<script lang="ts">
    import {createEventDispatcher} from "svelte";
    import {Spinner} from "flowbite-svelte";
    import SchematicInfoModal from "./SchematicInfoModal.svelte";
    import type {Player} from "@type/data.ts";
    import {schemRepo} from "@repo/schem.ts";
    import SWModal from "@components/styled/SWModal.svelte";

    const dispatch = createEventDispatcher();

    export let schematicId: number;
    export let user: Player;

    let schemInfo = getSchematicInfo(schematicId);

    function getSchematicInfo(id: number) {
        return $schemRepo.getSchematicInfo(id);
    }
</script>

{#await schemInfo}
    <SWModal title="Loading" open on:close={() => dispatch("reset")}>
        <Spinner />
    </SWModal>
{:then info}
    <SchematicInfoModal {user} {info} on:reset />
{:catch e}
    <SWModal title="Error" open on:close={() => dispatch("reset")}>
        <p>{e.message}</p>
        <button class="btn !ml-auto" slot="footer" on:click={() => dispatch("reset")}>Close</button>
    </SWModal>
{/await}