How should we handle queries that require a user's password/username?

[transmissions11]

I'm using E2EE encryption for a project I'm working on, and I want to retrieve the user's contacts and decrypt them, and then use ReactQuery to manage refetching, etc.

However, I'm not sure if I'm taking the right approach here?

import { useQuery } from "react-query";
import { requestAndDecryptUserContacts } from "../api/Users";
import { useAuth } from "../context/UserContext";

const userContactFetcher = async (_, username, decryptionKey) => {
  requestAndDecryptUserContacts(username, decryptionKey);
};

export default function useContacts() {
  const { decryptionKey, username } = useAuth();

  return useQuery(
    ["contacts", { decryptionKey, username }],
    userContactFetcher
  );
}

It feels odd to have the password + username in the query key? I was wondering if I should make userContactFetcher a closure and use the decryptionKey and username variables in there?

[tannerlinsley]

How about using the optional queryVariables parameter to send your decryption key through to the query function?

import { useQuery } from 'react-query'
import { requestAndDecryptUserContacts } from '../api/Users'
import { useAuth } from '../context/UserContext'

const userContactFetcher = (_, username, decryptionKey) =>
  requestAndDecryptUserContacts(username, decryptionKey)

export default function useContacts() {
  const { decryptionKey, username } = useAuth()

  return useQuery(['contacts', username], decryptionKey, userContactFetcher)
}

[transmissions11]

This makes sense, thank you! Should I do this with the username too, as users will never view another user's contacts?

[tannerlinsley]

Yes that should be fine. Oh and also I had a typo, the optional variables has to be an array of items, anyway, so this is how you should do it now:

useQuery('contacts', [username, decryptionKey], userContactFetcher)

This also means that you should make sure to clear the query cache when a user logs out, in case they log out of one user and into another, and see a cached copy of the last users contacts ;)

[transmissions11]

Thanks for all your help! Will do!