Resource in title renders "[object Object]" (SSR)

[KevinBLT]

I am fetching a translation of a string with a resource in a component using <Title>.

Similar to this (in short form):

import { Title } from "@solidjs/meta";
import { createResource, Suspense } from 'solid-js';

export function Text(props) {
  const [ value ] = createResource(props.id, (id) => new Promise(r => setTimeout(() => r('Hello title!'), 100)))

  return (
    <Suspense fallback='&nbsp;'>
      { value() }
    </Suspense>
  );
}

export default function Page() {
  return (
    <>
      <Title><Text id="test" /></Title>
    </>
  );
}

After using renderToStringAsync:

 <title data-sm="0-2-0-0-0-0-0-0-0-0-0-0-0-0-4-0-0-0-0-0">[object Object]</title>

hydrate() function will fix it when the page loads, though.

[KevinBLT]

@ryansolid Sorry to address this but it's important for me at the moment. Is this something I am doing wrong? I use this to fetch the title dynamically in the correct language and for the correct subject of the page. I think this is more or less a common use case (and important for SEO?)

[KevinBLT]

Is there a Solid SSR playground to share links?

[KevinBLT]

Example: https://stackblitz.com/edit/solid-start-bare-ts-mf6pfl?file=src%2Froutes%2Findex.tsx