I'm calling a playlists API in layout.tsx and passing the results to the sidebar. The sidebar then maps the array into Link components that href to dynamic routes. However, when I click on a playlist link, it loads the main area but also triggers the API call in the layout again. I'm unsure how to prevent this redundant API call. All components are client. All directory structure -
📁 movies
┣ 📄 page.tsx
┣ 📄 layout.tsx
┣ 📄 sidebar.tsx
┗ 📁 [playlist_id]
┗ 📄 page.tsx


//sidebar.tsx

export default function Sidebar({ *categories* }) {
…
 <Link href={`/movies/${category.playlist_id}`}>