import Layout from '../../components/layout' import * as Yup from 'yup' import { CopyInput, Form, Input, SubmitButton } from '../../components/form' import { InputGroup } from 'react-bootstrap' import { gql, useMutation, useQuery } from '@apollo/client' import { INVITE_FIELDS } from '../../fragments/invites' import AccordianItem from '../../components/accordian-item' import styles from '../../styles/invites.module.css' export const InviteSchema = Yup.object({ gift: Yup.number().typeError('must be a number') .min(0, 'must be positive').integer('must be whole').required(), limit: Yup.number().typeError('must be a number') .positive('must be positive').integer('must be whole') }) function InviteForm () { const [createInvite] = useMutation( gql` ${INVITE_FIELDS} mutation createInvite($gift: Int!, $limit: Int) { createInvite(gift: $gift, limit: $limit) { ...InviteFields } }`, { update (cache, { data: { createInvite } }) { cache.modify({ fields: { invites (existingInviteRefs = []) { const newInviteRef = cache.writeFragment({ data: createInvite, fragment: INVITE_FIELDS }) return [newInviteRef, ...existingInviteRefs] } } }) } } ) return (
{ const { error } = await createInvite({ variables: { gift: Number(gift), limit: limit ? Number(limit) : limit } }) if (error) { throw new Error({ message: error.String() }) } }} > sats} required /> invitee limit optional} name='limit' /> create
) } function Invite ({ invite, active }) { const [revokeInvite] = useMutation( gql` ${INVITE_FIELDS} mutation revokeInvite($id: ID!) { revokeInvite(id: $id) { ...InviteFields } }` ) return (
{invite.gift} sat gift \ {invite.invitees.length} joined{invite.limit ? ` of ${invite.limit}` : ''} {active ? ( <> \ revokeInvite({ variables: { id: invite.id } })} >revoke ) : invite.revoked && ( <> \ revoked )}
) } function InviteList ({ name, invites }) { return (
{name}
} body={
{invites.map(invite => { return })}
} /> ) } export default function Invites () { const { data } = useQuery( gql` ${INVITE_FIELDS} { invites { ...InviteFields } } `, { fetchPolicy: 'cache-and-network' }) const [active, inactive] = data && data.invites ? data.invites.reduce((result, invite) => { result[ invite.revoked || (invite.limit && invite.invitees.length >= invite.limit) ? 1 : 0].push(invite) return result }, [[], []]) : [[], []] return (

invite links

{active.length > 0 && } {inactive.length > 0 && }
) }