From 9cda37378685ee496654d2030d4de4898c330e0f Mon Sep 17 00:00:00 2001 From: MrOrz Date: Mon, 11 Jul 2022 17:35:49 +0800 Subject: [PATCH] [LandingPage] reuse useCurrentUser in LandingPage which will push user id to gtm dataLayer properly --- components/LandingPage/Header.js | 21 +++------------------ 1 file changed, 3 insertions(+), 18 deletions(-) diff --git a/components/LandingPage/Header.js b/components/LandingPage/Header.js index 48cbae0d..9dc6718f 100644 --- a/components/LandingPage/Header.js +++ b/components/LandingPage/Header.js @@ -2,15 +2,15 @@ import React, { useEffect, useState } from 'react'; import gql from 'graphql-tag'; import { c, t } from 'ttag'; import cx from 'clsx'; -import { useQuery, useLazyQuery } from '@apollo/react-hooks'; +import { useQuery } from '@apollo/react-hooks'; import { useRouter } from 'next/router'; import { makeStyles, withStyles, useTheme } from '@material-ui/core/styles'; import useMediaQuery from '@material-ui/core/useMediaQuery'; import Badge from '@material-ui/core/Badge'; import { animated, useSpring } from 'react-spring'; import Link from 'next/link'; -import Avatar from 'components/AppLayout/Widgets/Avatar'; +import useCurrentUser from 'lib/useCurrentUser'; import NavLink from 'components/NavLink'; import * as Widgets from 'components/AppLayout/Widgets'; @@ -33,17 +33,6 @@ const LIST_UNSOLVED_ARTICLES = gql` } `; -const USER_QUERY = gql` - query UserLevelQuery { - GetUser { - id - name - ...AvatarData - } - } - ${Avatar.fragments.AvatarData} -`; - const CustomBadge = withStyles(theme => ({ root: { verticalAlign: 'baseline' /* override badge default */, @@ -167,8 +156,7 @@ const LandingPageHeader = React.memo(({ onLoginModalOpen }) => { const [isMobileMenuOpen, setMobileMenuOpen] = useState(false); - const [loadUser, { data: userData }] = useLazyQuery(USER_QUERY); - const user = userData?.GetUser; + const user = useCurrentUser(); const { data } = useQuery(LIST_UNSOLVED_ARTICLES, { ssr: false, // no number needed for SSR @@ -198,9 +186,6 @@ const LandingPageHeader = React.memo(({ onLoginModalOpen }) => { } }; - // eslint-disable-next-line react-hooks/exhaustive-deps - useEffect(() => loadUser(), []); - useEffect(() => { handleScroll(); window.addEventListener('scroll', handleScroll);