Feature/attendance viewer

apps/admin-web/package.json

@@ -6,6 +6,8 @@
     "@apollo/react-hooks": "^3.0.0",
     "@auth0/auth0-spa-js": "^1.2.2",
     "antd": "^4.1.3",
+    "export-to-csv": "^0.2.1",
+    "graphql": "^14",
     "graphql-tag": "^2.10.1",
     "qrcode.react": "^1.0.0",
     "react": "^16.7.0",
@@ -56,4 +58,4 @@
     "not ie <= 11",
     "not op_mini all"
   ]
-}
+}

apps/admin-web/src/App.tsx

@@ -4,6 +4,7 @@ import { Layout, Menu, PageHeader, Spin } from "antd";
 
 import { ToolList } from "./Tools";
 import { Events } from "./screens/Events";
+import { EventData } from "./screens/EventData";
 import { Membership } from "./screens/Membership";
 import { RedemptionCodes } from "./screens/RedemptionCodes";
 import { config } from "./config";
@@ -21,7 +22,8 @@ const MainContent: React.SFC<{}> = (): JSX.Element => {
   return (
     <Switch>
       <Route exact={true} path="/" component={ToolList} />
-      <Route path="/events" component={Events} />
+      <Route path="/events/:eventId" component={EventData} />
+      <Route path="/events/" component={Events} />
       <Route path="/membership" component={Membership} />
       <Route path="/redemption" component={RedemptionCodes} />
       <Route component={NotFound} />

apps/admin-web/src/generated/graphql.tsx

@@ -40,6 +40,8 @@ export type Event = {
   eventLink?: Maybe<Scalars['String']>;
   urlKey?: Maybe<Scalars['String']>;
   attendees?: Maybe<Array<User>>;
+  usersInterested?: Maybe<Array<User>>;
+  numAttendees?: Maybe<Scalars['Float']>;
 };
 
 export type EventCreateInput = {
@@ -119,6 +121,7 @@ export type Mutation = {
   updateShirtReceived: User;
   resetShirtReceived: Array<User>;
   attendEvent: Event;
+  recordInterest: Event;
 };
 
 
@@ -247,6 +250,11 @@ export type MutationAttendEventArgs = {
   eventId: Scalars['Float'];
 };
 
+
+export type MutationRecordInterestArgs = {
+  eventId: Scalars['Float'];
+};
+
 export type Permission = {
   __typename?: 'Permission';
   name: Scalars['ID'];
@@ -299,6 +307,9 @@ export type Query = {
   currentEvents: Array<Event>;
   event: Event;
   eventsWithKey: Array<Event>;
+  getAttendees: Array<User>;
+  getInterestedUsers: Array<User>;
+  yearEvents: Array<Event>;
   groups: Array<Group>;
   permissions: Array<Permission>;
   products: Array<Product>;
@@ -328,6 +339,16 @@ export type QueryEventsWithKeyArgs = {
   urlKey: Scalars['String'];
 };
 
+
+export type QueryGetAttendeesArgs = {
+  urlKey: Scalars['String'];
+};
+
+
+export type QueryGetInterestedUsersArgs = {
+  urlKey: Scalars['String'];
+};
+
 export type RedemptionCode = {
   __typename?: 'RedemptionCode';
   id: Scalars['ID'];
@@ -408,6 +429,7 @@ export type User = {
   permissions?: Maybe<Array<Permission>>;
   groups: Array<Group>;
   eventsAttended?: Maybe<Array<Event>>;
+  interestedEvents?: Maybe<Array<Event>>;
 };
 
 export type UserCreateInput = {
@@ -428,6 +450,37 @@ export type UserUpdateInput = {
   email?: Maybe<Scalars['String']>;
 };
 
+export type EventsWithKeyQueryVariables = Exact<{
+  urlKey: Scalars['String'];
+}>;
+
+
+export type EventsWithKeyQuery = (
+  { __typename?: 'Query' }
+  & { eventsWithKey: Array<(
+    { __typename?: 'Event' }
+    & Pick<Event, 'eventTitle'>
+    & { attendees?: Maybe<Array<(
+      { __typename?: 'User' }
+      & Pick<User, 'firstName' | 'lastName' | 'email'>
+    )>>, usersInterested?: Maybe<Array<(
+      { __typename?: 'User' }
+      & Pick<User, 'firstName' | 'lastName' | 'email'>
+    )>> }
+  )> }
+);
+
+export type YearEventsQueryVariables = Exact<{ [key: string]: never; }>;
+
+
+export type YearEventsQuery = (
+  { __typename?: 'Query' }
+  & { yearEvents: Array<(
+    { __typename?: 'Event' }
+    & Pick<Event, 'urlKey' | 'numAttendees'>
+  )> }
+);
+
 export type SigsQueryVariables = Exact<{ [key: string]: never; }>;
 
 
@@ -621,6 +674,82 @@ export type GetProductsQuery = (
 );
 
 
+export const EventsWithKeyDocument = gql`
+    query eventsWithKey($urlKey: String!) {
+  eventsWithKey(urlKey: $urlKey) {
+    eventTitle
+    attendees {
+      firstName
+      lastName
+      email
+    }
+    usersInterested {
+      firstName
+      lastName
+      email
+    }
+  }
+}
+    `;
+
+/**
+ * __useEventsWithKeyQuery__
+ *
+ * To run a query within a React component, call `useEventsWithKeyQuery` and pass it any options that fit your needs.
+ * When your component renders, `useEventsWithKeyQuery` returns an object from Apollo Client that contains loading, error, and data properties
+ * you can use to render your UI.
+ *
+ * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
+ *
+ * @example
+ * const { data, loading, error } = useEventsWithKeyQuery({
+ *   variables: {
+ *      urlKey: // value for 'urlKey'
+ *   },
+ * });
+ */
+export function useEventsWithKeyQuery(baseOptions?: ApolloReactHooks.QueryHookOptions<EventsWithKeyQuery, EventsWithKeyQueryVariables>) {
+        return ApolloReactHooks.useQuery<EventsWithKeyQuery, EventsWithKeyQueryVariables>(EventsWithKeyDocument, baseOptions);
+      }
+export function useEventsWithKeyLazyQuery(baseOptions?: ApolloReactHooks.LazyQueryHookOptions<EventsWithKeyQuery, EventsWithKeyQueryVariables>) {
+          return ApolloReactHooks.useLazyQuery<EventsWithKeyQuery, EventsWithKeyQueryVariables>(EventsWithKeyDocument, baseOptions);
+        }
+export type EventsWithKeyQueryHookResult = ReturnType<typeof useEventsWithKeyQuery>;
+export type EventsWithKeyLazyQueryHookResult = ReturnType<typeof useEventsWithKeyLazyQuery>;
+export type EventsWithKeyQueryResult = ApolloReactCommon.QueryResult<EventsWithKeyQuery, EventsWithKeyQueryVariables>;
+export const YearEventsDocument = gql`
+    query yearEvents {
+  yearEvents {
+    urlKey
+    numAttendees
+  }
+}
+    `;
+
+/**
+ * __useYearEventsQuery__
+ *
+ * To run a query within a React component, call `useYearEventsQuery` and pass it any options that fit your needs.
+ * When your component renders, `useYearEventsQuery` returns an object from Apollo Client that contains loading, error, and data properties
+ * you can use to render your UI.
+ *
+ * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
+ *
+ * @example
+ * const { data, loading, error } = useYearEventsQuery({
+ *   variables: {
+ *   },
+ * });
+ */
+export function useYearEventsQuery(baseOptions?: ApolloReactHooks.QueryHookOptions<YearEventsQuery, YearEventsQueryVariables>) {
+        return ApolloReactHooks.useQuery<YearEventsQuery, YearEventsQueryVariables>(YearEventsDocument, baseOptions);
+      }
+export function useYearEventsLazyQuery(baseOptions?: ApolloReactHooks.LazyQueryHookOptions<YearEventsQuery, YearEventsQueryVariables>) {
+          return ApolloReactHooks.useLazyQuery<YearEventsQuery, YearEventsQueryVariables>(YearEventsDocument, baseOptions);
+        }
+export type YearEventsQueryHookResult = ReturnType<typeof useYearEventsQuery>;
+export type YearEventsLazyQueryHookResult = ReturnType<typeof useYearEventsLazyQuery>;
+export type YearEventsQueryResult = ApolloReactCommon.QueryResult<YearEventsQuery, YearEventsQueryVariables>;
 export const SigsDocument = gql`
     query sigs {
   sigs {

apps/admin-web/src/screens/EventData/QRModal.tsx

@@ -0,0 +1,49 @@
+import React from "react";
+import Modal from "antd/lib/modal/Modal";
+
+var QRCode = require('qrcode.react');
+
+interface IQRModalProps {
+  visible: boolean;
+  setVisible: (arg: boolean) => void;
+  eventUrlKey?: string;
+}
+
+const QRModal: React.FC<IQRModalProps> = ({
+  visible,
+  setVisible,
+  eventUrlKey
+}: IQRModalProps): JSX.Element => {
+  const handleCancel: () => void = (): void => {
+    setVisible(false);
+  };
+
+  const registrationLink: string = "https://mstacm.org/" + eventUrlKey; 
+
+  if(eventUrlKey == null) {
+    return (
+      <Modal
+        title={"Registration Link Error"}
+        visible={visible}
+        footer={null}
+        onCancel={handleCancel}
+      >
+        <h2>This event does not have a registration URL key.</h2>
+      </Modal>
+    );
+  }
+
+  return (
+    <Modal
+      title={"Registration Link"}
+      visible={visible}
+      footer={null}
+      onCancel={handleCancel}
+    >
+      <h2>{registrationLink}</h2>
+      <QRCode value={registrationLink} />
+    </Modal>
+  );
+};
+
+export { QRModal };

apps/admin-web/src/screens/EventData/helpers.ts

@@ -0,0 +1,28 @@
+import gql from "graphql-tag";
+
+export const EVENTS_WITH_KEY: any = gql`
+  query eventsWithKey($urlKey: String!) {
+    eventsWithKey(urlKey: $urlKey) {
+      eventTitle
+      attendees {
+          firstName
+          lastName
+          email
+      }
+      usersInterested {
+          firstName
+          lastName
+          email
+      }
+    }
+  }
+`;
+
+export const YEAR_EVENTS: any = gql`
+  query yearEvents {
+    yearEvents {
+      urlKey
+      numAttendees
+    }
+  }
+`;