How to use the @webiny/app-security/hooks/useSecurity.useSecurity function in @webiny/app-security

if (!auth) {
        throw Error(
            `You must register a "security-authentication-provider" plugin to render Account form!`
        );
    }

    const { renderUserAccountForm } = auth;

    const [{ loading, user }, setState] = useReducer((prev, next) => ({ ...prev, ...next }), {
        loading: true,
        user: { data: {} }
    });

    const client = useApolloClient();
    const { showSnackbar } = useSnackbar();
    const security = useSecurity();

    const onSubmit = useHandler(null, () => async formData => {
        setState({ loading: true });
        const { data: response } = await client.mutate({
            mutation: UPDATE_CURRENT_USER,
            variables: { data: omit(formData, ["id"]) }
        });
        const { error } = response.security.updateCurrentUser;
        setState({ loading: false });
        if (error) {
            return showSnackbar(error.message, {
                actionText: "Close"
            });
        }

        security.refreshUser();

const UserInfo = () => {
    const security = useSecurity();

    if (!security || !security.user) {
        return null;
    }

    const { email, fullName, avatar } = security.user;

    return (