How to test state management(Recoil) using react jest? - reactjs

Question

How do I test recoil using react jest?
I expect below test is going to be success but it gives me fail.
Any way to render the status of isLogin: false using jest?
// src/state/user.ts
import { atom } from "recoil";
export type UserType = {
isLogin: boolean;
};
const userState = atom<UserType>({
key: "user",
default: {
isLogin: true,
},
});
export default userState;
// src/pages/user/User.tsx
import { useNavigate, useParams } from "react-router-dom";
import { useRecoilValue } from "recoil";
import userState from "../../state/user";
export default function User() {
const navigate = useNavigate();
const { id } = useParams();
const { isLogin } = useRecoilValue(userState);
if (!isLogin) {
return <div>Login 후 이용 가능합니다.</div>;
}
return (
<div>
{id}
<button
type="button"
onClick={() => {
navigate("/");
}}
>
Go to Home
</button>
</div>
);
}
// src/pages/user/User.test.tsx
import { MemoryRouter } from "react-router-dom";
import { render, screen, renderHook, act } from "#testing-library/react";
import { RecoilRoot, useSetRecoilState } from "recoil";
import User from "./User";
import type { UserType } from "../../state/user";
import userState from "../../state/user";
const userStateMock = (user: UserType) => {
const { result } = renderHook(() => useSetRecoilState(userState), {
wrapper: RecoilRoot,
});
act(() => {
result.current(user);
});
return result;
};
describe("<User />", () => {
const renderUserComponent = () =>
render(
<RecoilRoot>
<MemoryRouter>
<User />
</MemoryRouter>
</RecoilRoot>
);
describe("When user hasn't logged in", () => {
it("Should render warning message", () => {
userStateMock({
isLogin: false,
});
renderUserComponent();
expect(screen.getByText(/Login 후 이용 가능합니다./)).toBeDefined();
});
});
});
Result of the test