pixelmund / svemix

The Full-Stack addition to SvelteKit. Write your server code inside svelte files, handle sessions, forms and SEO easily.
https://svemix.com
MIT License
337 stars 16 forks source link

Leverage SvelteKit's `stuff`? #35

Closed benmccann closed 2 years ago

benmccann commented 2 years ago

Hi, thanks for sharing some great ideas in Svemix! metadata support is something we've long wanted to add to SvelteKit and we've now enhanced stuff such that it can be used for those purposes. Would it make sense for Svemix to leverage it?

E.g. there's an example in the Svemix docs:

<script context="module" lang="ts" ssr>
    export const loader: Loader<Props, Locals> = async function ({ params }) {
        try {
            const post = await db.post.findUnique({
                where: { slug: params.slug },
                rejectOnNotFound: false
            });

            if (!post) {
                return {
                    status: 404,
                    error: 'Post not found'
                };
            }

            return {
                props: {
                    post
                }
            };
        } catch (error) {
            return {
                status: 500,
                error
            };
        }
    };

    export const metadata: MetaFunction<Props> = (props) => ({
        title: props?.post.title,
        description: props?.post?.content
    });
</script>

This could be written using SvelteKit's stuff as:

<script context="module" lang="ts" ssr>
    export const loader: Loader<Props, Locals> = async function ({ params }) {
        try {
            const post = await db.post.findUnique({
                where: { slug: params.slug },
                rejectOnNotFound: false
            });

            if (!post) {
                return {
                    status: 404,
                    error: 'Post not found'
                };
            }

            return {
                props: {
                    post
                },
                stuff: {
                    metadata: {
                        title: post.title,
                        description: post.content
                    }
                }
            };
        } catch (error) {
            return {
                status: 500,
                error
            };
        }
    };
</script>
pixelmund commented 2 years ago

Hey @benmccann, i think it makes sense to leverage SvelteKit's stuff here, at the time writing the metadata feature i think it wasn't possible accessing $page.stuff. This would also simplify some Svemix internals a lot.

pixelmund commented 2 years ago

Svemix now leverages shadow endpoints and the implementation of metadata has changed, you can now return it inside your loader and no need for an extra metadata function,