import Layout from '@/components/layout' import { Form, Input, SubmitButton } from '@/components/form' import InputGroup from 'react-bootstrap/InputGroup' 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' import Invite from '@/components/invite' import { inviteSchema } from '@/lib/validate' import { SSR } from '@/lib/constants' import { getGetServerSideProps } from '@/api/ssrApollo' // force SSR to include CSP nonces export const getServerSideProps = getGetServerSideProps({ query: null }) 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 InviteList ({ name, invites }) { return (
{name}
} body={
{invites.map(invite => { return })}
} /> ) } export default function Invites () { const { data } = useQuery( gql` ${INVITE_FIELDS} { invites { ...InviteFields } } `, SSR ? {} : { 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

send these to people you trust, e.g. group chats or DMs
{active.length > 0 && } {inactive.length > 0 && }
) }