Resource refetch doesn't trigger effect

        const user = useUser();
    createEffect(() => {
        console.log(user.name, user.email);
        if (user.name) Crisp.user.setNickname(user.name);
        if (user.email) Crisp.user.setEmail(user.email);
    });

        const user = useUser();
    createEffect(() => {
        console.log(user.name, user.email);
        if (user.name) Crisp.user.setNickname(user.name);
        if (user.email) Crisp.user.setEmail(user.email);
    });

function useUser() {
    const [user, { mutate, refetch }] = createResource(() =>
        api
            .get<{
                id: string;
                role: "GUEST" | "USER";
                email: string | null;
                name: string | null;
                teamId: string | null;
            }>("/user/me")
            .then((r) => r.data)
    );

    return {
        refetch,
        get email() {
            return user()?.email;
        },
        get name() {
            return user()?.name;
        },
    };
}

function useUser() {
    const [user, { mutate, refetch }] = createResource(() =>
        api
            .get<{
                id: string;
                role: "GUEST" | "USER";
                email: string | null;
                name: string | null;
                teamId: string | null;
            }>("/user/me")
            .then((r) => r.data)
    );

    return {
        refetch,
        get email() {
            return user()?.email;
        },
        get name() {
            return user()?.name;
        },
    };
}