Unable to query data in a non route component

[teddy_stanowski]

I am unable to query data, the same way I am querying it through an index route. I am trying to create a sidebar widget for our blog and I keep getting undefined. Does this mean that data can only be queried through routes? I was able to query it in a promise but I can't seem to get that data out of a promise. See the code below using SvelteKit's load function.

<script context="module">
    import Prismic from "@prismicio/client";
    import Client from "../../../utils/client";

    export async function load() {
        const document = await Client.query(
            Prismic.Predicates.at("document.type", "blog_post")
        );
        return {
            props: {
                document,
            },
        };
    }
</script>

<script>
    export let document;
    console.log(document);
</script>

[Priyanka (Priyanka Maheshwari)]

Hello @teddy_stanowski

Thanks for posting this question to us.

You can not use load() function outside of the routes. It can only be used in a page or layout component. You can either fetch the data from the page or layout and pass the data as a prop to the sidebar component.

Let me know if you have any other doubts.

Thanks,
Priyanka