Dynamically construct Preact routes from configuration - Typescript error

44 views Asked by At

I am testing a multi-lingual setup with different root folders for each country. There is some code-based configuration of this information that I want to reference when constructing the Preact routes.

Here's a few of the key pieces from the code:

import { configuration } from "./components/configuration";
import { Router, lazy } from "preact-iso";

const Home = lazy(() => import("./pages/public/Home"));

return (
   <Router>
       {
           configuration.countries.map((country) => (
               <Home path={country.rootPath} culture={country.culture} />
           ))
       }
   </Router>
):

This actually seems to work fine and Preact is routing the URLs correctly, but I have the following Typescript error that I don't know how to resolve:

Type 'Element[]' is missing the following properties from type 'VNode<{}>': type, props, key ts(2739)

EDIT: I created a simplified version of the Home page and the issue still occurs.

import { h, FunctionComponent } from "preact";

interface Props {
    culture: string;
};

const Home: FunctionComponent<Props> = ({ culture }) => {

    return (
        <h1>Home {culture}</h1>
    );
};

export default Home;
0

There are 0 answers