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      icon: 'account_circle',
 58    },
 59    {divider: true},
 60    {
 61      label: t('menu.new_event'),
 62      onClick: () => router.push('/new'),
 63      id: 'AddEventTabs',
 64      icon: 'add',
 65    },
 66  ];
 67
 68  if (!events || !isReady)
 69    return (
 70      <LayoutDefault menuTitle={t('dashboard.title')} {...props}>
 71        <Loading />
 72      </LayoutDefault>
 73    );
 74
 75  return (
 76    <LayoutDefault
 77      menuActions={menuActions}
 78      menuTitle={t('dashboard.title')}
 79      {...props}
 80    >
 81      {events.length === 0 ? (
 82        <DashboardEmpty />
 83      ) : (
 84        <DashboardEvents
 85          pastEvents={pastEvents}
 86          futureEvents={futureEvents}
 87          noDateEvents={noDateEvents}
 88        />
 89      )}
 90      <Fab
 91        onClick={() => router.push('/new')}
 92        aria-label={t('dashboard.actions.add_event')}
 93        noDrawer
 94      >
 95        {t('dashboard.actions.add_event')}
 96      </Fab>
 97    </LayoutDefault>
 98  );
 99};
100
101const sortDesc = ({attributes: {date: dateA}}, {attributes: {date: dateB}}) =>
102  dateB.localeCompare(dateA);
103
104export const getServerSideProps = async (context: any) => {
105  const session = await getSession(context);
106
107  if (!session)
108    return {
109      redirect: {
110        destination: '/',
111        permanent: false,
112      },
113    };
114
115  const hasAcceptedTos = !!session?.profile?.tosAcceptationDate;
116
117  if (!hasAcceptedTos)
118    return {
119      redirect: {
120        destination: '/auth/confirm',
121        permanent: false,
122      },
123    };
124
125  const cookies = new Cookies(context.req, context.res);
126  const redirectPath = cookies.get('redirectPath');
127  if (redirectPath) {
128    cookies.set('redirectPath'); // Delete cookie
129    return {
130      redirect: {
131        destination: redirectPath,
132        permanent: false,
133      },
134    };
135  }
136
137  return pageUtils.getServerSideProps()(context);
138};
139
140export default Dashboard;