1import {useEffect} from 'react';
 2import {useRouter} from 'next/router';
 3import {useTranslation} from 'react-i18next';
 4import {useUpdateMeMutation, EditUserInput} from '../generated/graphql';
 5import useAuthStore from '../stores/useAuthStore';
 6import useProfile from '../hooks/useProfile';
 7import Loading from '../containers/Loading';
 8import Profile from '../containers/Profile';
 9import Layout from '../layouts/Centered';
10import Banner from '../components/Banner';
11
12const ProfilePage = () => {
13  const router = useRouter();
14  const {t} = useTranslation();
15  const isAuth = useAuthStore(s => !!s.token);
16  const logout = useAuthStore(s => s.logout);
17  const {profile} = useProfile();
18  const [updateProfile] = useUpdateMeMutation();
19
20  useEffect(() => {
21    if (!isAuth) router.push('/');
22  }, [isAuth]);
23
24  const onUpdateProfile = (userUpdate: EditUserInput) =>
25    updateProfile({variables: {userUpdate}});
26
27  const menuActions = [
28    {
29      label: t('menu.new_event'),
30      onClick: () => router.push('/'),
31      id: 'AddEventTabs',
32    },
33    {
34      label: t('menu.dashboard'),
35      onClick: () => router.push('/dashboard'),
36      id: 'DashboardTabs',
37    },
38  ];
39
40  if (!profile) return <Loading />;
41
42  return (
43    <Layout menuTitle={t('profile.title')} menuActions={menuActions} goBack>
44      <Profile
45        profile={profile}
46        updateProfile={onUpdateProfile}
47        logout={logout}
48      />
49    </Layout>
50  );
51};
52
53export default ProfilePage;