frontend/src/routes/+page.svelte

<script>
    import { onMount } from "svelte";
    const url ="https://huggingface.co/datasets/triple-t/dummy/raw/main/stabilityai_stable-diffusion.json"

    let discussions = [];
    function fetchData(){
        fetch(url)
        .then(response => response.json())
        .then(json => {
            discussions = json;
            console.log(discussions);
        })  
    }
    onMount(()=>{
        fetchData();
    })
</script>



<div class="grid grid-rows-4 grid-flow-col gap-4 p-3">
        {#each discussions as item}
        {#if item.data.images.length > 0}
            <div>
                <h1>{item.data.prompt}</h1>
                <!-- svelte-ignore a11y-missing-attribute -->
                <img src={item.data.images[0]} class="max-w-[20rem]"/>
            </div>
        {/if}
        {/each}
        
  </div>