1import {useMemo} from 'react';
  2import moment from 'moment';
  3import Cookies from 'cookies';
  4import {useRouter} from 'next/router';
  5import {getSession} from 'next-auth/react';
  6import {useTranslation} from 'next-i18next';
  7import LayoutDefault from '../layouts/Default';
  8import DashboardEvents from '../containers/DashboardEvents';
  9import DashboardEmpty from '../containers/DashboardEmpty';
 10import Loading from '../containers/Loading';
 11import Fab from '../containers/Fab';
 12import pageUtils from '../lib/pageUtils';
 13import useProfile from '../hooks/useProfile';
 14
 15interface PageProps {
 16  announcement?: string;
 17}
 18
 19const Dashboard = (props: PageProps) => {
 20  const {t} = useTranslation();
 21  const router = useRouter();
 22  const {profile, isReady} = useProfile();
 23  const events = useMemo(() => profile?.events?.data || [], [profile]);
 24
 25  const pastEvents = useMemo(
 26    () =>
 27      events
 28        ?.filter(
 29          ({attributes: {date}}) =>
 30            date && moment(date).isBefore(moment(), 'day')
 31        )
 32        .sort(sortDesc),
 33    [events]
 34  );
 35
 36  const futureEvents = useMemo(
 37    () =>
 38      events
 39        ?.filter(
 40          ({attributes: {date}}) =>
 41            date && moment(date).isSameOrAfter(moment(), 'day')
 42        )
 43        .sort(sortDesc),
 44    [events]
 45  );
 46
 47  const noDateEvents = useMemo(
 48    () => events?.filter(({attributes: {date}}) => !date),
 49    [events]
 50  );
 51
 52  const menuActions = [
 53    {
 54      label: t('menu.profile'),
 55      onClick: () => router.push('/profile'),
 56      id: 'ProfileTabs',
 57    },
 58    {divider: true},
 59    {
 60      label: t('menu.new_event'),
 61      onClick: () => router.push('/new'),
 62      id: 'AddEventTabs',
 63    },
 64  ];
 65
 66  if (!events || !isReady)
 67    return (
 68      <LayoutDefault menuTitle={t('dashboard.title')} {...props}>
 69        <Loading />
 70      </LayoutDefault>
 71    );
 72
 73  return (
 74    <LayoutDefault
 75      menuActions={menuActions}
 76      menuTitle={t('dashboard.title')}
 77      {...props}
 78    >
 79      {events.length === 0 ? (
 80        <DashboardEmpty />
 81      ) : (
 82        <DashboardEvents
 83          pastEvents={pastEvents}
 84          futureEvents={futureEvents}
 85          noDateEvents={noDateEvents}
 86        />
 87      )}
 88      <Fab
 89        onClick={() => router.push('/new')}
 90        aria-label={t('dashboard.actions.add_event')}
 91        noDrawer
 92      >
 93        {t('dashboard.actions.add_event')}
 94      </Fab>
 95    </LayoutDefault>
 96  );
 97};
 98
 99const sortDesc = ({attributes: {date: dateA}}, {attributes: {date: dateB}}) =>
100  dateB.localeCompare(dateA);
101
102export const getServerSideProps = async (context: any) => {
103  const session = await getSession(context);
104
105  if (!session)
106    return {
107      redirect: {
108        destination: '/',
109        permanent: false,
110      },
111    };
112
113  const provider = session?.token?.provider;
114  const hasAcceptedTos = !!session?.profile?.tosAcceptationDate;
115
116  if (provider === 'google' && !hasAcceptedTos)
117    return {
118      redirect: {
119        destination: '/auth/confirm/google',
120        permanent: false,
121      },
122    };
123
124  const cookies = new Cookies(context.req, context.res);
125  const redirectPath = cookies.get('redirectPath');
126  if (redirectPath) {
127    cookies.set('redirectPath'); // Delete cookie
128    return {
129      redirect: {
130        destination: redirectPath,
131        permanent: false,
132      },
133    };
134  }
135
136  return pageUtils.getServerSideProps()(context);
137};
138
139export default Dashboard;