Is there a way to revalidate a layout page route from a client side component that is nested under that route? For example, I have a layout that holds a table of records and a dynamic route to view each of those records. The dynamic record route has a form that when submitted should cause the layout page to revalidate so when we navigate back to that route the table will have the updated record data. What I'm experiencing is that 'no-store' on the layout page request does not seem to work (perhaps it is due to soft/hard navigation) and revalidatePath does not do anything when invoked in the form's onSubmit, which I thought could be due to being invoked in a client side component.

Ex:
/Layout.tsx

export async function Layout() {
  const tableData = await fetch('table-endpoint', cache: 'no-store')

  return <Table data={tableData} /> // click on an item in the table to navigate to /[id] route
}

/[id].tsx

'use client'

export function Record({ data }) {
 const [form, setForm] = React.useState(data)

 const onSubmit = async () => {
  const newData = await fetch('update-endpoint') // PUT request
  setData(form) 
 }  

  return <Form onSubmit={onSubmit} />
}

After submitting the form, navigating back to Layout I expect to see the new data in the Table, but it will still display the data from before the update request was made. So, how do I revalidate the data in the table in Layout?