TypeScript problem in NextJS / React. Apparent inconsistency across files

I'm working on a fairly long tutorial (link and source code at the end of post), and I'm struggling with a TypeScript error that I'm getting inside of the PostDetails.tsx page found inside of src > root_ > _pages.

Towards the end of the PostDetails another component called PostStats is rendered passing in 'post' and 'userId' as props.

The exact error looks like:

Type 'Document | undefined' is not assignable to type 'Document'.  Type 'undefined' is not assignable to type 'Document'.ts(2322)PostStats.tsx(9, 3): The expected type comes from property 'post' which is declared here on type       'IntrinsicAttributes & PostStatsProps'(property) post: Models.Document

The narrator seems to have extremely similar code to what I have, but doesn't seem to encounter that break. I'm still quite new to the TypeScript, NextJS, React stack as well as more complex applications like this. I've tried adjusting the way posts is written and tried to trace some of the type declarations, but I struggle to understand the problem.

Additionally, the document / Models.Document refers to appwrite (like firebase) which is used for storage in this project.

Any constructive criticism on how I've presented or asked my question is also fully welcome as I don't have a ton of experience asking questions here on StackOverflow.

Video source : https://www.youtube.com/watch?v=_W3R2VwRyF4&t=17613s&ab_channel=JavaScriptMastery

Git Source Code : https://github.com/adrianhajdin/social_media_app/tree/main

I tried removing the question marks on post inside of PostDetails, as well as making PostStatProps inside of the PostStats.tsx file look like so:

`type PostStatsProps = { post: Models.Document | undefined; userId: string;}`

both attempts simply worsened the break.

A lot of errors in this project so far have simply been a result of me missing stupid typos, so it may be another case of that, but of course I am not sure.