Skip to content

How to use error object in error page component with TypeScript? #56

@devopsix

Description

@devopsix

In a TypeScript project, I'd like to implement an error page like the one from the error page examples:

const NotFound = ({ error }) => (
  <div>
    <h1>Not found.</h1>
    <p>{error}</p>
  </div>
);

// ...

<GuardProvider error={NotFound}>
  // ...
</GuardProvider>

But this results in a TypeScript error:

TS2322: Type '({ error }: { error: any; }) => Element' is not assignable to type 'PageComponent'.
Type '({ error }: { error: any; }) => Element' is not assignable to type 'FunctionComponent<{}>'.
Types of parameters '__0' and 'props' are incompatible.

Am I doing something wrong?

Or does the way PageComponent is defined does not allow this because ComponentType is used without a type variable?

export declare type PageComponent = ComponentType | null | undefined | string | boolean | number;

Any help is much appreciated!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions