Incoherent data with multiple createServerData$ in routeData

export function routeData({ params }: RouteDataArgs) {
  const members = createServerData$(
    async (organisationId) => {
      const members = await prisma.membership.findMany({
        where: { organisationId },
        include: { user: true },
      });

      return members.map((m) => ({ ...m, ...m.user }));
    },
    { key: () => params.orgId }
  );

  const invitations = createServerData$(
    (organisationId) =>
      prisma.invitation.findMany({ where: { organisationId } }),
    { key: () => params.orgId }
  );

  return { members, invitations };
}

export default function ManageOrganisationMembers() {
  const { members, invitations } = useRouteData<typeof routeData>();
  const params = useParams();

  console.log(JSON.stringify(members(), null, 2));
  console.log(JSON.stringify(invitations(), null, 2));

  return (
    <Show when={members() && invitations()}>
      <Header>Users</Header>
      <Container>
        <h1>Members</h1>
        <Table
          data={members()!}
          ...
        />
        <h1 class="mt-10">Invitations</h1>
        <Table
          data={invitations()!}
          ...
        />
      </Container>
    </Show>
  );
}

export function routeData({ params }: RouteDataArgs) {
  const members = createServerData$(
    async (organisationId) => {
      const members = await prisma.membership.findMany({
        where: { organisationId },
        include: { user: true },
      });

      return members.map((m) => ({ ...m, ...m.user }));
    },
    { key: () => params.orgId }
  );

  const invitations = createServerData$(
    (organisationId) =>
      prisma.invitation.findMany({ where: { organisationId } }),
    { key: () => params.orgId }
  );

  return { members, invitations };
}

export default function ManageOrganisationMembers() {
  const { members, invitations } = useRouteData<typeof routeData>();
  const params = useParams();

  console.log(JSON.stringify(members(), null, 2));
  console.log(JSON.stringify(invitations(), null, 2));

  return (
    <Show when={members() && invitations()}>
      <Header>Users</Header>
      <Container>
        <h1>Members</h1>
        <Table
          data={members()!}
          ...
        />
        <h1 class="mt-10">Invitations</h1>
        <Table
          data={invitations()!}
          ...
        />
      </Container>
    </Show>
  );
}