I am using latest Next.js App router.
I have two .ts files, one that holds an interface for my member data field types, and a second that holds the specific data values.
I import these onto my home page to render the correct images/names..etc... This works perfectly.
I then have folders/files inside my app folder as follows: app/family/[memberId].tsx
The memberId.tsx file holds the page that I want the data rendered into dependent on which member is clicked on.
Currently I am mapping each member into a slider using the familyMemberData that I have imported.
What I want to know is - What is the best way/conventions to dynamically render specific data per family member but using the same page layout? So when I click on Dave for example, the same page is loaded as when I click James, but only the data for the specific member is rendered.