-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #4 from simonyiszk/feature/newsletter-init
Newsletter subscription
- Loading branch information
Showing
14 changed files
with
802 additions
and
413 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| SERVICE_ACCOUNT_JSON="<base-64 encoded creadentials.json of the service account>" | ||
| SERVICE_ACCOUNT_SUBJECT="<subject of the service account>" | ||
| JWT_SCOPE="<required scope for the service account>" | ||
| GROUP_KEY="<email address of the google group>" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| 'use server'; | ||
| import { google } from 'googleapis'; | ||
|
|
||
| export async function addToGroup({ email }: { email: string }) { | ||
| if (!email) { | ||
| return 400; | ||
| } | ||
| const credentials = JSON.parse(Buffer.from(process.env.SERVICE_ACCOUNT_JSON ?? '', 'base64').toString()); | ||
| const auth = new google.auth.JWT({ | ||
| email: credentials.client_email, | ||
| key: credentials.private_key, | ||
| subject: process.env.SERVICE_ACCOUNT_SUBJECT, | ||
| scopes: [process.env.JWT_SCOPE ?? ''], | ||
| }); | ||
|
|
||
| try { | ||
| await google.admin({ version: 'directory_v1', auth }).members.insert({ | ||
| groupKey: process.env.GROUP_KEY, | ||
| requestBody: { | ||
| email: email, | ||
| role: 'MEMBER', | ||
| }, | ||
| }); | ||
| return 200; | ||
| } catch (e) { | ||
| if ((e as any).response?.data?.error.code === 409) { | ||
| return 409; | ||
| } | ||
| if ((e as any).response?.data?.error.code === 400) { | ||
| return 400; | ||
| } | ||
| console.log(e); | ||
| console.log('error: ', (e as any).response?.data?.error); | ||
| return 500; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -4,10 +4,9 @@ export default function Contact() { | |
| return ( | ||
| <div className='flex flex-col'> | ||
| <p className='text-4xl font-bold mb-20 text-center'>Vállalati és sajtómegkeresések, általános kérdések:</p> | ||
| <p className='text-2xl font-normal mb-20 text-center'>lorem ipsum?</p> | ||
| <Link | ||
| href='mailto:[email protected]' | ||
| className='text-2xl font-semibold text-center hover:text-brand' | ||
| className='text-2xl md:text-3xl font-semibold text-center hover:text-brand break-all' | ||
| target='blank' | ||
| > | ||
| [email protected] | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| import Link from 'next/link'; | ||
| import { FaFacebook, FaInstagram, FaYoutube } from 'react-icons/fa'; | ||
|
|
||
| export function SocialButtons() { | ||
| return ( | ||
| <div className='flex items-center gap-5 text-[40px]'> | ||
| <Link href='https://www.instagram.com/simonyikonf' className='brand-link' target='blank'> | ||
| <FaInstagram /> | ||
| </Link> | ||
| <Link href='https://www.facebook.com/events/1060756212046229' className='brand-link' target='blank'> | ||
| <FaFacebook /> | ||
| </Link> | ||
| <Link | ||
| href='https://www.youtube.com/watch?v=QDKDaMKqcoQ&list=PLovp3RCdzQGx_lKpvCgUJT6n-wJazXKrL' | ||
| className='brand-link' | ||
| target='blank' | ||
| > | ||
| <FaYoutube /> | ||
| </Link> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,118 @@ | ||
| 'use client'; | ||
| import { Dialog } from '@headlessui/react'; | ||
| import * as EmailValidator from 'email-validator'; | ||
| import { useState } from 'react'; | ||
| import { FaCheckCircle, FaTimes } from 'react-icons/fa'; | ||
|
|
||
| import { addToGroup } from '@/app/actions'; | ||
|
|
||
| import { WhiteButton } from '../white-button'; | ||
|
|
||
| export function NewsletterModals() { | ||
| const [isSubscribeOpen, setIsSubscribeOpen] = useState(false); | ||
| const [isSuccessOpen, setIsSuccessOpen] = useState(false); | ||
| const [isLoading, setIsLoading] = useState(false); | ||
| const [email, setEmail] = useState(''); | ||
| const [accepted, setAccepted] = useState(false); | ||
| const [error, setError] = useState(''); | ||
|
|
||
| const onSubscribe = async () => { | ||
| if (accepted && email) { | ||
| setIsLoading(true); | ||
| const status = await addToGroup({ email }); | ||
| setIsLoading(false); | ||
| switch (status) { | ||
| case 200: | ||
| onSubscribeClose(); | ||
| setIsSuccessOpen(true); | ||
| break; | ||
| case 400: | ||
| setError('Érvénytelen email cím!'); | ||
| break; | ||
| case 409: | ||
| setError('Ez az email cím már fel van iratkozva a hírlevélre!'); | ||
| break; | ||
| default: | ||
| setError('Ismeretlen hiba!'); | ||
| } | ||
| } | ||
| }; | ||
|
|
||
| const onSubscribeClose = () => { | ||
| setEmail(''); | ||
| setError(''); | ||
| setAccepted(false); | ||
| setIsSubscribeOpen(false); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <WhiteButton onClick={() => setIsSubscribeOpen(true)}>Feliratkozás a hírlevélre</WhiteButton> | ||
| <Dialog open={isSubscribeOpen} onClose={onSubscribeClose} className='relative z-50'> | ||
| <div className='fixed inset-0 bg-black/80' aria-hidden='true' /> | ||
|
|
||
| <div className='fixed inset-0 flex w-screen items-center justify-center p-4'> | ||
| <Dialog.Panel className='mx-auto max-w-lg rounded bg-[#0f181c] p-8'> | ||
| <div className='flex justify-between items-center mb-5'> | ||
| <Dialog.Title className='font-bold text-2xl '>Hírlevél</Dialog.Title> | ||
| <div className='hover:text-gray-400 hover:cursor-pointer text-xl' onClick={onSubscribeClose}> | ||
| <FaTimes /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div className='flex flex-col gap-2'> | ||
| <p className='mb-2 text-justify'> | ||
| Ha szeretnél értesülni a legfontosabb hírekről, mint például előadások, nyereményjáték, iratkozz fel a | ||
| hírlevelünkre! | ||
| </p> | ||
| <div> | ||
| <input | ||
| className='mr-2' | ||
| type='checkbox' | ||
| id='accept' | ||
| checked={accepted} | ||
| onChange={(e) => setAccepted(e.target.checked)} | ||
| /> | ||
| <label htmlFor='accept'> | ||
| Beleegyezem, hogy a konferenciáig havonta maximum két emailt fogok kapni az alábbi email címre. | ||
| </label> | ||
| </div> | ||
|
|
||
| <input | ||
| placeholder='[email protected]' | ||
| className='text-black p-2 rounded-md mb-2' | ||
| value={email} | ||
| onChange={(e) => { | ||
| setEmail(e.target.value); | ||
| setError(''); | ||
| }} | ||
| type='email' | ||
| /> | ||
| {error && <p className='text-red-500'>{error}</p>} | ||
| <WhiteButton | ||
| disabled={!EmailValidator.validate(email) || !accepted || !!error || isLoading} | ||
| onClick={onSubscribe} | ||
| > | ||
| {isLoading ? 'Kérjük várj...' : 'Feliratkozás'} | ||
| </WhiteButton> | ||
| </div> | ||
| </Dialog.Panel> | ||
| </div> | ||
| </Dialog> | ||
| <Dialog open={isSuccessOpen} onClose={() => setIsSuccessOpen(false)} className='relative z-50'> | ||
| <div className='fixed inset-0 bg-black/80' aria-hidden='true' /> | ||
|
|
||
| <div className='fixed inset-0 flex w-screen items-center justify-center p-4'> | ||
| <Dialog.Panel className='mx-auto max-w-lg rounded bg-[#0f181c] p-8 flex flex-col items-center gap-5'> | ||
| <div className='text-8xl text-white'> | ||
| <FaCheckCircle /> | ||
| </div> | ||
| <Dialog.Title className='font-bold text-2xl mb-5'>Sikeresen feliratkoztál a hírlevélre!</Dialog.Title> | ||
|
|
||
| <WhiteButton onClick={() => setIsSuccessOpen(false)}>Rendben</WhiteButton> | ||
| </Dialog.Panel> | ||
| </div> | ||
| </Dialog> | ||
| </> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| import { MouseEventHandler, PropsWithChildren } from 'react'; | ||
|
|
||
| type Props = { | ||
| onClick: MouseEventHandler<HTMLButtonElement>; | ||
| disabled?: boolean; | ||
| } & PropsWithChildren; | ||
|
|
||
| export function WhiteButton({ onClick, children, disabled = false }: Props) { | ||
| return ( | ||
| <button | ||
| onClick={onClick} | ||
| disabled={disabled} | ||
| className='bg-white text-xl rounded-lg font-bold py-2 px-4 text-black hover:bg-gray-300 disabled:bg-gray-500 disabled:cursor-not-allowed' | ||
| > | ||
| {children} | ||
| </button> | ||
| ); | ||
| } |
Oops, something went wrong.