Replace remaining atomWithQuery with urql except paginated lists

frontend/src/components/SessionDetail/SessionDetail.tsx

@@ -13,11 +13,8 @@
 // limitations under the License.
 
 import { Alert } from "@vector-im/compound-web";
-import { useAtomValue } from "jotai";
-import { atomFamily } from "jotai/utils";
-import { atomWithQuery } from "jotai-urql";
-import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
+import { useQuery } from "urql";
 
 import { graphql } from "../../gql";
 import { Link } from "../../routing";
@@ -35,17 +32,6 @@ const QUERY = graphql(/* GraphQL */ `
   }
 `);
 
-const sessionFamily = atomFamily(
-  ({ userId, deviceId }: { userId: string; deviceId: string }) => {
-    const sessionQueryAtom = atomWithQuery({
-      query: QUERY,
-      getVariables: () => ({ userId, deviceId }),
-    });
-
-    return sessionQueryAtom;
-  },
-);
-
 // A type-safe way to ensure we've handled all session types
 const unknownSessionType = (type: never): never => {
   throw new Error(`Unknown session type: ${type}`);
@@ -55,11 +41,7 @@ const SessionDetail: React.FC<{
   deviceId: string;
   userId: string;
 }> = ({ deviceId, userId }) => {
-  const sessionFamilyAtomWithProps = useMemo(
-    () => sessionFamily({ deviceId, userId }),
-    [deviceId, userId],
-  );
-  const result = useAtomValue(sessionFamilyAtomWithProps);
+  const [result] = useQuery({ query: QUERY, variables: { deviceId, userId } });
   const { t } = useTranslation();
 
   const session = result.data?.session;

frontend/src/components/UserGreeting.tsx

@@ -13,10 +13,8 @@
 // limitations under the License.
 
 import { Heading, Text, Avatar } from "@vector-im/compound-web";
-import { useAtomValue } from "jotai";
-import { atomFamily } from "jotai/utils";
-import { atomWithQuery } from "jotai-urql";
 import { useTranslation } from "react-i18next";
+import { useQuery } from "urql";
 
 import { graphql } from "../gql";
 
@@ -38,17 +36,8 @@ const QUERY = graphql(/* GraphQL */ `
   }
 `);
 
-export const userGreetingFamily = atomFamily((userId: string) => {
-  const userGreeting = atomWithQuery({
-    query: QUERY,
-    getVariables: () => ({ userId }),
-  });
-
-  return userGreeting;
-});
-
 const UserGreeting: React.FC<{ userId: string }> = ({ userId }) => {
-  const result = useAtomValue(userGreetingFamily(userId));
+  const [result] = useQuery({ query: QUERY, variables: { userId } });
   const { t } = useTranslation();
 
   if (result.data?.user) {