Using dynamic titles in +Head

[willcrichton]

I have an app with this structure:

/pages
  +Head.tsx
  /index
    +title.ts
  /blog
    +title.ts

I use both the static and dynamic title formats. So:

// /pages/index/+title.ts
export default "A static title!";

// /pages/blog/+title.ts
export default ctx => "A dynamic title!";

I want to generate social media tags based on the title. So I've been doing:

// /pages/+Head.tsx

import { usePageContext } from "vike-react/usePageContext";

export let Head = () => {
  let pageContext = usePageContext();
  let title = pageContext.config.title; // ?????
  return <meta property="og:title" content={title} />
}

However, even though Vike claims that pageContext.config.title is a string, in the dynamic case it's a function. This seems like one of two bugs:

1. Vike is supposed to resolve config.title to a string before reaching Head, and it doesn't.
2. The user is supposed to deal with resolving config.title to a string, and the type provided by Vike doesn't reflect that.

Is it one of those two cases? Or am I missing something?

[brillout]

It works as intended: pageContext.config is the defined config value, in your case a function.

For your use case, you have to resolve the function yourself.

I think the best would be that vike-react automtically sets <meta property="og:title"> upon defining +title.js. (PR welcome if that's something you'd be up for - it's quite a simple PR.)

[brillout]

the best would be that vike-react automtically sets <meta property="og:title"> upon defining +title.js

Done (vikejs/vike-react@024b6ad) and pre-released as 0.4.17-commit-024b6ad.

[willcrichton]

That is great, thank you! Can you also update the type of title in vike-react? Specifically here:

https://github.com/vikejs/vike-react/blob/024b6ad7527425389d0e06577609979e9803779d/packages/vike-react/src/types/Config.ts#L29-L30

I think it should be something like title?: string | (pageContext: PageContext) => string.

[brillout]

👍 Done (vikejs/vike-react@7fe7b04) and pre-released as 0.4.17-commit-7fe7b04.

Btw. would your company be up for sponsoring (#1350)? Sponsors make a massive difference.

[willcrichton]

Thank you for the quick turnaround! I work in academia so we do not have much funding for sponsorships. But I will try to help by submitting contributions in the future once I'm more familiar with Vike.