I am trying to render a text on SSR based on a cookie and I want to avoid hydration issues. is there a good way to do that via getServerSideProps?

export const getServerSideProps = async (context) => {
const ssrCookies = context.req.headers.cookie
return { props: { ssrCookies } }
}

export default ParentComponent

<ParentComponent>
<AnotherComponent>
<LeafComponent>
<LastLeafComponent /> <-- this component needs it
</LeafComponent>
</AnotherComponent>
</ParentComponent>