stencil-community/stencil-router

Feature Request: pageTitle Prefix and Suffix

ladvoc opened this issue · 1 comments

Resources:
Before submitting an issue, please consult our docs.

Stencil version:

frontend@0.0.1 /Users/jacob/Developer/frontend
└── @stencil/core@0.15.0 

I'm submitting a ...
[ ] bug report
[x] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://stencil-worldwide.slack.com

Current behavior:
As websites and web apps often do, I append the name of my app to the end of the page title.
To accomplish this I manually append the app name:

// example-page.tsx
render() {
    return [
        <stencil-route-title pageTitle='Example Page - App Name'></stencil-route-title>,
        <h1>This is an example</h1>
    ];
}

Expected behavior:

However, this method is not ideal. It would be extremely useful if stencil-router has a pageTitlePrefix and pageTitleSuffix property.

Related code:

The pageTitleSuffix will be appended to the pageTitle string provided by stencil-route-title in each component.

// app-root.tsx
render() {
    return (
        <stencil-router pageTitleSuffix=" - App Name">
            <stencil-route-switch>
                <stencil-route url='/example' component='example-page' />
            </stencil-route-switch>
        </stencil-router>
    );
}

When visiting this route, the document title is still "Example Page - App Name."

// example-page.tsx
render() {
    return [
        <stencil-route-title pageTitle='Example Page'></stencil-route-title>,
        <h1>This is an example</h1>
    ];
}

@jacobgelman you can currently set <stencil-router titleSuffix=' - Whatever'> but there isn't a prefix version.