How to use the react-apollo.useApolloClient function in react-apollo

export function usePublishRevisionHandler({ page }) {
    const client = useApolloClient();
    const { showSnackbar } = useSnackbar();

    const publishRevision = async revision => {
        const { data: res } = await client.mutate({
            mutation: PUBLISH_REVISION,
            variables: { id: revision.id },
            refetchQueries: ["PbListPages"],
            update: (cache, { data }) => {
                // Don't do anything if there was an error during publishing!
                if (data.pageBuilder.publishRevision.error) {
                    return;
                }

                const getPageQuery = GET_PAGE();

                // Update revisions

const Install = ({ plugins, children, security }) => {
    const client = useApolloClient();
    const [ready, setReady] = useState(false);
    const [login, setLogin] = useState(false);
    const [user, setUser] = useState(null);
    const [current, setCurrentInstaller] = useState(null);
    const toInstall = useRef([]);
    const graph = useRef(null);

    const onUser = user => {
        setUser(user);
        setLogin(false);
        console.log("onUser", user);
    };

    const nextInstaller = () => {
        const currentIndex = !current
            ? -1

function Name({ file }: *) {
    const [editing, setEdit] = useState(false);
    const name = file.name || "";

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

    const { queryParams } = useFileManager();

    if (editing) {
        return (
            <form name=""> {
                    setEdit(false);
                    await client.mutate({
                        mutation: UPDATE_FILE,
                        variables: {
                            id: file.id,
                            data: { name }</form>

.pop();

    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"
            });
        }

const EditRevision = () => {
    const { showSnackbar } = useSnackbar();
    const client = useApolloClient();
    const { history } = useReactRouter();
    const { page } = usePageDetails();

    const unpublishedRevision = (get(page, "revisions") || []).find(
        item => !item.published && !item.locked
    );

    const editRevision = useCallback(() => {
        if (unpublishedRevision) {
            history.push(`/page-builder/editor/${unpublishedRevision.id}`);
        }
    });

    const copyAndEdit = useCallback(async () => {
        const [latestRevision] = page.revisions;
        const { data: res } = await client.mutate({

function Tags({ file }) {
    const client = useApolloClient();

    const [editing, setEdit] = useState(false);
    const [saving, setSaving] = useState(false);
    const initialTags = Array.isArray(file.tags) ? [...file.tags] : [];
    const [currentTags, setCurrentTags] = useState(initialTags);
    const { showSnackbar } = useSnackbar();

    const { queryParams } = useFileManager();

    if (editing) {
        return (
            <>

const ProfileDropdownRaw = ({
  walletProxy,
  wallet,
  data,
  identity,
  identityLoaded,
  onClose,
  onRewardsClick
}) => {
  const { id } = data.web3.primaryAccount
  const address = `ETH Address: ${formatHash(wallet)}`
  const devMode = store.get('developerMode')

  const client = useApolloClient()
  const [logout] = useMutation(LogoutMutation, {
    variables: { wallet }
  })

  return (
    <>
      <div>
      <div>
        <a href="#close"> {
            e.preventDefault()
            onClose()
          }}
        &gt;</a></div></div>

const I18NInstaller = ({ onInstalled }) => {
    const client = useApolloClient();
    const [loading, setLoading] = useState(false);
    const [error, setError] = useState(null);

    const onSubmit = useCallback(async form => {
        setLoading(true);
        setError(null);
        const { data: res } = await client.mutate({ mutation: INSTALL, variables: { data: form } });
        setLoading(false);
        const { error } = res.i18n.install;
        if (error) {
            setError(error.message);
            return;
        }

        onInstalled();
    }, []);

const DeletePage = props => {
    const client = useApolloClient();
    const { showSnackbar } = useSnackbar();
    const { history } = useReactRouter();
    const { showDialog } = useDialog();

    const title = get(props, "pageDetails.page.title", "N/A");

    const { showConfirmation } = useConfirmationDialog({
        title: "Delete page",
        message: (
            <p>
                You are about to delete the entire page and all of its revisions! <br>
                Are you sure you want to permanently delete the page <strong>{title}</strong>?
            </p>
        )
    });

const Install = ({ onInstalled }) => {
    const auth = getPlugins("security-authentication-provider")
        .filter(pl => pl.hasOwnProperty("renderInstallForm"))
        .pop();

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

    const { renderInstallForm } = auth;

    const client = useApolloClient();
    const [loading, setLoading] = useState(false);
    const [authUserMessage, setAuthUserMessage] = useState(null);
    const [error, setError] = useState(null);

    const onSubmit = useCallback(async form => {
        setLoading(true);
        setError(null);
        const { data: res } = await client.mutate({ mutation: INSTALL, variables: { data: form } });
        setLoading(false);
        const { error, data } = res.security.install;
        if (error) {
            setError(error);
            return;
        }

        if (!data.authUser) {