Hello,

I have a quick question to ask about nextjs 13 revalid path function. I don't understand why my component (src/app/dashboard/@allExercisesGrid/page.tsx) is not rerendered after I call revalidatePath('/dashboard') in a server action file.

here is my src/app/dashboard/@allExercisesGrid/page.tsx

const AllExercisesGrid = async () => {
  const exercises = await db.select().from(exercise)

  return <ClientComponent x={exercises} /> 
};

export default AllExercisesGrid;

"use client";

import { useState } from "react";

export const ClientComponent = ({ x }: any) => {
  const [gridItems] = useState(x);

  return (
    <p>
      GridItem: {gridItems.length} x: {x.length}
    </p>
  );
};

here is the output i get after inserting elements one by one. Notice how the useState variable is not getting updated. Why is that and how can i fix this ?

GridItem: 59 x: 59
GridItem: 59 x: 60
GridItem: 59 x: 61
GridItem: 59 x: 62