Navigation Stack Issue with Incorrect Event Display

[quentin-76]

Which package manager are you using? (Yarn is recommended)

yarn

Summary

I'm encountering a stacking issue; here's my structure:

app/_layout
app/(tabs)/_layout
app/(tabs)/list/index.tsx
app/user/[id]/index.tsx
app/event/[id]/index.tsx

Here's my main layout:

return (
 <Stack screenOptions={{ headerShown: false }}>
    <Stack.Screen
      name="(tabs)"
      options={{
        headerShown: false,
      }}
    />
    <Stack.Screen
      getId={({ params }) => {
        return params?.id;
      }}
      name="event/[id]/index"
    />
  </Stack>
);

Working stacking scenario:
From the list (index: 0),
Push to event (index: 1),
From event, push to user (index: 2) (router.back() functions correctly and displays the event properly).

Non-working stacking scenario:
From the list (index: 0),
Push to event (index: 1),
From event, push to user (index: 2),
Then from user, I push to another event (index: 3).

PROBLEM: Now, when I perform router.back() to the first event (navigation index: 1), it displays the event from index 3.

Minimal reproducible example

return (
<Stack screenOptions={{ headerShown: false }}>
<Stack.Screen
name="(tabs)"
options={{
headerShown: false,
}}
/>
<Stack.Screen
getId={({ params }) => {
return params?.id;
}}
name="event/[id]/index"
/>

);

[quentin-76]

I added a console.log(id) of the id passed as a parameter in the Event page and when I return to index 1, I have several rerenders with the id of the event which was that of the index 3 and that of the event of index 1:

const { id } = useLocalSearchParams<{ id: string }>();

ID 7a77f55a-d16d-4220-bb26-4d92bb9610ed
ID 267c2d4d-f69d-4643-80de-24bd84674bfe

therefore, I am unable to retrieve the correct information based on the id