I pass the boolean parameter usingAsSignUp into queryFn.
Unfortunately, usingAsSignUp always results in undefined! How do I get its value? usingAsSignUp is the state set by useEffect in the using component.
RTK query createApi and queryFn:
export const firebaseApi = createApi({
reducerPath: "firebaseApi",
baseQuery: fakeBaseQuery(),
tagTypes: ["Auth"], //Optional, https://redux-toolkit.js.org/rtk-query/api/createApi#tagtypes
endpoints: (builder) => ({
authenticateWithFirebase: builder.mutation({
async queryFn({ email, password, usingAsSignUp }) {
try {
const auth = getAuth(firebaseApp);
const userCredential = usingAsSignUp ?
await createUserWithEmailAndPassword(auth, email, password) :
await signInWithEmailAndPassword(auth, email, password);
return {
data: {
uid: userCredential?.user?.uid,
email: userCredential?.user?.email,
usingAsSignUp: usingAsSignUp,
},
};
} catch (e) {
return { error: e };
}
},
providesTags: ["Auth"], //Optional, https://redux-toolkit.js.org/rtk-query/api/createApi#providestags
}),
}),
});
export const { useAuthenticateWithFirebaseMutation } = firebaseApi;
Use useEffectUse components to set the state passed to queryFn:
import { useAuthenticateWithFirebaseMutation } from "../../persistence/apiSlices";
const [signup, setSignup] = useState(true);
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const location = useLocation();
const [authenticateNow, result, data] = useAuthenticateWithFirebaseMutation();
useEffect(() => {
location.pathname === "/login" ? setSignup(false) : setSignup(true);
}, [location.pathname] );
async function onSubmitACB() {
await authenticateNow({ email, password, signup });
}
You are passing a boolean parameter
usingAsSignUpto theauthenticateWithFirebasemutation endpoint'squeryFn, but it always results inundefined. This may be because you are not passing parameters from the component correctly.To fix this error, you need to pass the
usingAsSignUpvalue as asignupto theauthenticateWithFirebaseendpoint'squeryFnin yourfirebaseApiConfiguring.await authenticateNow({ email, password, usingAsSignUp: signup });