tjhintz
/
thereactshow
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

big changes

Browse Source
main
Thomas Hintz 2 years ago
parent 3bacf15793
commit 6e6f3f4324
15 changed files with 666 additions and 69 deletions
Show Stats Download Patch File Download Diff File

12
src/app/(extra)/layout.jsx
Unescape Escape View File

@ -1,10 +1,14 @@
import UserMenu from '@/components/UserMenu';
import ReactorsLink from '@/components/ReactorsLink';
import NavBar from '@/components/NavBar'
export default function ExtraLayout({children}) {
return (
<div>
<NavBar showPodcast />
{children}
</div>
<>
<NavBar userMenu={(<UserMenu />)} reactorsLink={(<ReactorsLink />)} />
<div className="lg:pt-16">
{children}
</div>
</>
);
}

14
src/app/(extra)/reactors/account/layout.jsx
Unescape Escape View File

@ -23,17 +23,5 @@ export default async function Layout({ children }) {
if (!userId) {
redirect('/reactors');
}
return (
<>
signed in as: {userId}
<nav>
<ul>
<form method="POST" action="/api/sign-out">
<button type="submit">Sign Out</button>
</form>
</ul>
</nav>
{children}
</>
);
return children;
};

30
src/app/(extra)/reactors/page.jsx
Unescape Escape View File

@ -5,7 +5,8 @@ import { Container } from '@/components/Container';
import { CheckIcon } from '@heroicons/react/20/solid'
import reactorsBackground from '@/images/reactors2.jpg';
import reactorsBackground from '@/images/reactors3.jpeg';
import reactorsBackground2 from '@/images/reactors4.jpeg';
const features = [
{
@ -67,8 +68,8 @@ export default async function Page() {
<div className="relative isolate overflow-hidden pt-14">
<Image
src={reactorsBackground}
alt="TODO reactors background"
className="absolute inset-0 -z-10 h-full w-full object-cover"
alt="artistic rendering of an atom"
className="absolute inset-0 -z-10 h-screen w-full object-cover"
/>
<div
className="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80"
@ -84,23 +85,34 @@ export default async function Page() {
</div>
<div className="mx-auto max-w-2xl py-32 sm:py-48 lg:py-56">
<div className="text-center">
<h1 className="text-4xl font-bold tracking-tight text-white sm:text-6xl">
<h1 className="text-4xl font-bold tracking-tight text-white sm:text-6xl drop-shadow-md">
Join The Reactors!
</h1>
<p className="mt-6 text-lg leading-8 text-gray-300">
<p className="mt-6 text-lg leading-8 text-gray-300 drop-shadow-md">
The <strong>BEST</strong> way to support the show and gain access to subscriber-only bonus content!
</p>
<div className="mt-10 flex items-center justify-center gap-x-6">
<a
href="#pricing"
className="rounded-md bg-indigo-500 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400"
className="rounded-md bg-indigo-500 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400 drop-shadow-md"
>
Join!
</a>
<a href="#learn-more" className="text-sm font-semibold leading-6 text-white">
<a
href="#pricing"
className="rounded-md bg-slate-500 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-slate-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400 drop-shadow-md"
>
Learn more <span aria-hidden="true">→</span>
</a>
</div>
<div className="mt-4 flex items-center justify-center gap-x-6">
<Link
href="/reactors/sign-in"
className="text-white p-2 drop-shadow-md underline backdrop-brightness-90"
>
Already have an account? Sign In
</Link>
</div>
</div>
</div>
<div
@ -223,8 +235,8 @@ export default async function Page() {
</div>
<div className="flex items-start justify-end lg:order-first">
<Image
src={reactorsBackground}
alt="Product screenshot"
src={reactorsBackground2}
alt="artistic atom above a hand"
className="w-[48rem] max-w-none rounded-xl shadow-xl ring-1 ring-gray-400/10 sm:w-[57rem]"
width={2432}
height={1442}

15
src/app/(main)/layout.jsx
Unescape Escape View File

@ -2,6 +2,9 @@ import { Fragment, useId } from 'react'
import Image from 'next/image'
import Link from 'next/link'
import UserMenu from '@/components/UserMenu';
import ReactorsLink from '@/components/ReactorsLink';
import NavBar from '@/components/NavBar'
import posterImage from '@/images/poster.png'
@ -19,7 +22,7 @@ function Waveform(props) {
total: 100,
width: 2,
gap: 2,
minHeight: 40,
minHeight: 60,
maxHeight: 100,
}
@ -174,7 +177,8 @@ function Layout({ children }) {
return (
<>
<header className="bg-slate-50 lg:fixed lg:inset-y-0 lg:left-0 lg:flex lg:w-112 lg:items-start lg:overflow-y-auto xl:w-120">
<NavBar userMenu={(<UserMenu />)} reactorsLink={(<ReactorsLink />)} />
<header className="bg-slate-50 lg:fixed lg:inset-y-0 lg:left-0 lg:flex lg:w-112 lg:items-start lg:overflow-y-auto xl:w-120 lg:mt-16">
<div className="hidden lg:sticky lg:top-0 lg:flex lg:w-16 lg:flex-none lg:items-center lg:whitespace-nowrap lg:py-12 lg:text-sm lg:leading-7 lg:[writing-mode:vertical-rl]">
<span className="font-mono text-slate-500">Hosted by</span>
<span className="mt-6 flex gap-6 font-bold text-slate-900">
@ -194,7 +198,7 @@ function Layout({ children }) {
<div className="px-4 sm:px-6 md:px-4 lg:px-8 xl:px-12 mb-10">
<Link
href="/"
className="relative mx-auto block w-48 overflow-hidden rounded-lg bg-slate-200 shadow-xl shadow-slate-200 sm:w-64 sm:rounded-xl lg:w-auto lg:rounded-2xl"
className="relative mx-auto block w-48 overflow-hidden rounded-lg bg-slate-200 shadow-xl shadow-slate-200 sm:w-64 sm:rounded-xl lg:w-auto lg:rounded-2xl mt-16 lg:mt-0"
aria-label="Homepage"
>
<Image
@ -207,7 +211,6 @@ function Layout({ children }) {
<div className="absolute inset-0 rounded-lg ring-1 ring-inset ring-black/10 sm:rounded-xl lg:rounded-2xl" />
</Link>
</div>
<NavBar />
<div className="mt-6 text-center lg:mt-12 lg:text-left px-4 sm:px-6 md:px-4 lg:px-8 xl:px-12">
<p className="text-xl font-bold text-slate-900">
<Link href="/">The React Show</Link>
@ -254,8 +257,8 @@ function Layout({ children }) {
</div>
</header>
<main className="border-t border-slate-200 lg:relative lg:mb-28 lg:ml-112 lg:border-t-0 xl:ml-120">
<Waveform className="absolute left-0 top-0 h-20 w-full" />
<div className="relative">{children}</div>
<Waveform className="absolute left-0 top-0 h-20 w-full pointer-events-none lg:mt-16 z-30 lg:z-0" />
<div className="relative lg:pt-16">{children}</div>
</main>
<footer className="border-t border-slate-200 bg-slate-50 py-10 pb-40 sm:py-16 sm:pb-32 lg:hidden">
<div className="mx-auto px-4 sm:px-6 md:max-w-2xl md:px-4">

173
src/components/NavBar.jsx
Unescape Escape View File

@ -1,30 +1,153 @@
'use client';
import { Suspense } from 'react';
import Image from 'next/image';
import { usePathname } from 'next/navigation';
import { Fragment } from 'react'
import { Disclosure, Menu, Transition } from '@headlessui/react'
import { Bars3Icon, UserCircleIcon, XMarkIcon } from '@heroicons/react/24/outline'
import trsLogo from '@/images/trs-logo.svg';
import Link from 'next/link'
export default function NavBar({ showPodcast }) {
const navigation = [
{ name: 'Contact', href: '/contact-us' },
{ name: 'Book', href: '/book' },
]
function classNames(...classes) {
return classes.filter(Boolean).join(' ')
}
export default function NavBar({ userMenu, reactorsLink }) {
const pathname = usePathname();
return (
<nav className="bg-gray-800">
<ol className="flex space-x-4 p-4 justify-center">
<li>
<Link
href="/book"
className="rounded-md px-3 py-2 text-lg font-medium text-gray-300 hover:bg-gray-700 hover:text-white"
>Book</Link>
</li>
<li>
<Link
href="/contact-us"
className="rounded-md px-3 py-2 text-lg font-medium text-gray-300 hover:bg-gray-700 hover:text-white"
>Contact</Link>
</li>
{showPodcast && (
<li>
<Link
href="/"
className="rounded-md px-3 py-2 text-lg font-medium text-gray-300 hover:bg-gray-700 hover:text-white"
>Podcast</Link>
</li>
)}
</ol>
</nav>
<Disclosure as="nav" className="bg-gray-800 fixed w-full z-20">
{({ open }) => (
<>
<div className="mx-auto max-w-7xl px-2 sm:px-6 lg:px-8">
<div className="relative flex h-16 items-center justify-between">
<div className="absolute inset-y-0 left-0 flex items-center sm:hidden">
{/* Mobile menu button*/}
<Disclosure.Button className="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white">
<span className="sr-only">Open main menu</span>
{open ? (
<XMarkIcon className="block h-6 w-6" aria-hidden="true" />
) : (
<Bars3Icon className="block h-6 w-6" aria-hidden="true" />
)}
</Disclosure.Button>
</div>
<div className="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
<div className="flex flex-shrink-0 items-center">
<Link
className="block lg:hidden"
href="/"
>
<Image
src={trsLogo}
className="h-8 w-auto lg:hidden"
alt="The React Show TRS logo"
/>
</Link>
<Link
className="hidden lg:block"
href="/"
>
<Image
src={trsLogo}
className="h-8 w-auto lg:block"
alt="The React Show TRS logo"
/>
</Link>
</div>
<div className="hidden sm:ml-6 sm:block">
<div className="flex space-x-4">
<Suspense fallback={(
<Link
href="/reactors"
className={classNames(
'/reactors' === pathname ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
'rounded-md px-3 py-2 text-sm font-medium'
)}
aria-current={'/reactors' === pathname ? 'page' : undefined}
>
Reactors
</Link>
)}>
{reactorsLink}
</Suspense>
{navigation.map((item) => (
<Link
key={item.name}
href={item.href}
className={classNames(
item.href === pathname ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
'rounded-md px-3 py-2 text-sm font-medium'
)}
aria-current={item.href === pathname ? 'page' : undefined}
>
{item.name}
</Link>
))}
</div>
</div>
</div>
<div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
{/* Profile dropdown */}
<Menu as="div" className="relative ml-3">
<Suspense fallback={(
<UserCircleIcon
className="h-8 w-8 rounded-full text-white animate-spin"
/>
)}>
{userMenu}
</Suspense>
</Menu>
</div>
</div>
</div>
<Disclosure.Panel className="sm:hidden">
<div className="flex flex-col space-y-4 px-2 pb-3 pt-2">
<Disclosure.Button>
<Suspense fallback={(
<Link
href="/reactors"
className={classNames(
'/reactors' === pathname ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
'block rounded-md px-3 py-2 text-base font-medium'
)}
aria-current={'/reactors' === pathname ? 'page' : undefined}
>
Reactors
</Link>
)}>
{reactorsLink}
</Suspense>
</Disclosure.Button>
{navigation.map((item) => (
<Disclosure.Button key={item.name}>
<Link
href={item.href}
className={classNames(
item.current ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
'rounded-md px-3 py-2 text-base font-medium'
)}
aria-current={item.current ? 'page' : undefined}
>
{item.name}
</Link>
</Disclosure.Button>
))}
</div>
</Disclosure.Panel>
</>
)}
</Disclosure>
)
}

45
src/components/ReactorsLink.jsx
Unescape Escape View File

@ -0,0 +1,45 @@
'use server';
import Link from 'next/link';
import UserMenuClient from '@/components/UserMenuClient';
import { cookies } from 'next/headers';
import db from '@/db';
async function getSession() {
const cookieStore = cookies();
const sessionId = cookieStore.get('session');
if (!sessionId) {
return false;
}
const { user_id: userId } = await db.get('select user_id from sessions where session_id=?;', sessionId.value);
if (!userId) {
return false;
}
return userId;
};
export default async function ReactorsLink() {
const userId = await getSession();
if (userId) {
return (
<Link
href="/reactors/account"
className="text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-base font-medium"
>
Reactors
</Link>
)
} else {
return (
<Link
href="/reactors"
className="text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-base font-medium"
>
Reactors
</Link>
);
}
};

70
src/components/UserMenu.jsx
Unescape Escape View File

@ -0,0 +1,70 @@
'use server';
import Link from 'next/link';
import UserMenuClient from '@/components/UserMenuClient';
import { cookies } from 'next/headers';
import db from '@/db';
const signedInNavigation = [
{ name: 'Account', href: '/reactors/account' },
{ name: 'Sign Out', href: '/' },
]
async function getSession() {
const cookieStore = cookies();
const sessionId = cookieStore.get('session');
if (!sessionId) {
return false;
}
const { user_id: userId } = await db.get('select user_id from sessions where session_id=?;', sessionId.value);
if (!userId) {
return false;
}
return userId;
};
export default async function UserMenu() {
const userId = await getSession();
return (
<UserMenuClient>
{userId ? (
<>
<Link
href="/reactors/account"
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 active:bg-gray-100"
>
Account
</Link>
<form
method="POST"
action="/api/sign-out"
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 active:bg-gray-100"
>
<button
type="submit">
Sign Out
</button>
</form>
</>
) : (
<>
<Link
href="/reactors/sign-in"
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 active:bg-gray-100"
>
Sign In
</Link>
<Link
href="/reactors"
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 active:bg-gray-100"
>
Create Account
</Link>
</>
)}
</UserMenuClient>
);
};

72
src/components/UserMenuClient.jsx
Unescape Escape View File

@ -0,0 +1,72 @@
'use client';
import { Fragment } from 'react'
import { Disclosure, Menu, Transition } from '@headlessui/react'
import { Bars3Icon, UserCircleIcon, XMarkIcon } from '@heroicons/react/24/outline'
function classNames(...classes) {
return classes.filter(Boolean).join(' ')
}
export default function UserMenu({ children }) {
return (
<>
<div>
<Menu.Button className="flex rounded-full bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-gray-800">
<span className="sr-only">Open user menu</span>
<UserCircleIcon
className="h-8 w-8 rounded-full text-white"
/>
</Menu.Button>
</div>
<Transition
as={Fragment}
enter="transition ease-out duration-100"
enterFrom="transform opacity-0 scale-95"
enterTo="transform opacity-100 scale-100"
leave="transition ease-in duration-75"
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items className="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
{children.map((link, i) => (
<Menu.Item key={i}>
{link}
</Menu.Item>
))}
</Menu.Items>
</Transition>
</>
);
};
/* <Menu.Item>
* {({ active }) => (
* <a
* href="#"
* className={classNames(active ? 'bg-gray-100' : '', 'block px-4 py-2 text-sm text-gray-700')}
* >
* Your Profile
* </a>
* )}
* </Menu.Item>
* <Menu.Item>
* {({ active }) => (
* <a
* href="#"
* className={classNames(active ? 'bg-gray-100' : '', 'block px-4 py-2 text-sm text-gray-700')}
* >
* Settings
* </a>
* )}
* </Menu.Item>
* <Menu.Item>
* {({ active }) => (
* <a
* href="#"
* className={classNames(active ? 'bg-gray-100' : '', 'block px-4 py-2 text-sm text-gray-700')}
* >
* Sign out
* </a>
* )}
* </Menu.Item> */

5
src/db.js
Unescape Escape View File

@ -78,6 +78,11 @@ foreign key (user_id) references users (id)
key: 9,
name: 'add audio size column',
sql: [`alter table episodes add column audio_size integer;`]
},
{
key: 10,
name: 'add subscription type column',
sql: [`alter table subscriptions add column type text;`]
}
];

BIN
src/images/reactors3.jpeg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

BIN
src/images/reactors4.jpeg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 582 KiB

274
src/images/trs-logo.svg
Unescape Escape View File

@ -0,0 +1,274 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="500"
zoomAndPan="magnify"
viewBox="0 0 500 499.99998"
height="500"
preserveAspectRatio="xMidYMid meet"
version="1.0"
id="svg1226"
sodipodi:docname="favicon.svg"
inkscape:export-filename="/home/tjhintz/owl/graphics/favicon.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1228"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="true"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:zoom="1.04"
inkscape:cx="260.09615"
inkscape:cy="175"
inkscape:window-width="2560"
inkscape:window-height="1375"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1226">
<inkscape:grid
type="xygrid"
id="grid2454"
originx="-302.29987"
originy="-387.85304" />
</sodipodi:namedview>
<defs
id="defs1080">
<g
id="g1078">
<g
id="glyph-0-0" />
<g
id="glyph-0-1">
<path
d="m 139.5625,-188.23437 c 1.07031,0 1.92187,0.35937 2.54687,1.07812 0.63282,0.71875 0.86329,1.70313 0.6875,2.95313 l -4.3125,35.23437 c -0.17968,1.25 -0.625,2.23438 -1.34375,2.95313 -0.71875,0.71875 -1.70312,1.07812 -2.95312,1.07812 h -31.20312 c -0.89844,0 -1.34375,0.44922 -1.34375,1.34375 L 84.4375,-4.03125 c -0.179688,1.25 -0.625,2.234375 -1.34375,2.953125 C 82.375,-0.359375 81.390625,0 80.140625,0 h -41.15625 c -1.25,0 -2.1875,-0.359375 -2.8125,-1.078125 C 35.546875,-1.796875 35.320312,-2.78125 35.5,-4.03125 l 17.203125,-139.5625 c 0,-0.89453 -0.449219,-1.34375 -1.34375,-1.34375 H 21.25 c -1.261719,0 -2.203125,-0.35937 -2.828125,-1.07812 -0.625,-0.71875 -0.851563,-1.70313 -0.671875,-2.95313 l 4.296875,-35.23437 c 0.175781,-1.25 0.664063,-2.23438 1.46875,-2.95313 0.8125,-0.71875 1.847656,-1.07812 3.109375,-1.07812 z m 0,0"
id="path1051" />
</g>
<g
id="glyph-0-2">
<path
d="m 88.46875,-184.20312 c 0.175781,-1.25 0.625,-2.23438 1.34375,-2.95313 0.71875,-0.71875 1.703125,-1.07812 2.953125,-1.07812 h 41.156245 c 1.25,0 2.1875,0.35937 2.8125,1.07812 0.63282,0.71875 0.85938,1.70313 0.67188,2.95313 L 115.35938,-4.03125 c -0.17969,1.25 -0.67188,2.234375 -1.48438,2.953125 C 113.07031,-0.359375 112.04688,0 110.79688,0 H 69.640625 c -1.25,0 -2.195313,-0.359375 -2.828125,-1.078125 -0.625,-0.71875 -0.84375,-1.703125 -0.65625,-2.953125 l 8.328125,-67.234375 c 0,-0.894531 -0.359375,-1.34375 -1.078125,-1.34375 H 60.765625 c -0.898437,0 -1.34375,0.449219 -1.34375,1.34375 L 51.09375,-4.03125 c -0.179688,1.25 -0.671875,2.234375 -1.484375,2.953125 C 48.804688,-0.359375 47.867188,0 46.796875,0 H 5.375 C 4.300781,0 3.445312,-0.359375 2.8125,-1.078125 2.1875,-1.796875 1.96875,-2.78125 2.15625,-4.03125 l 22.046875,-180.17187 c 0.175781,-1.25 0.664063,-2.23438 1.46875,-2.95313 0.8125,-0.71875 1.753906,-1.07812 2.828125,-1.07812 h 41.421875 c 1.070313,0 1.921875,0.35937 2.546875,1.07812 0.625,0.71875 0.847656,1.70313 0.671875,2.95313 l -8.0625,66.95312 c -0.367187,0.89844 -0.0078,1.34375 1.078125,1.34375 h 12.640625 c 0.351563,0 0.664063,-0.12891 0.9375,-0.39063 0.269531,-0.26953 0.40625,-0.58593 0.40625,-0.95312 z m 0,0"
id="path1054" />
</g>
<g
id="glyph-0-3">
<path
d="m 124.23438,-148.96875 c -0.17969,1.25 -0.67188,2.23438 -1.48438,2.95313 -0.80469,0.71875 -1.83594,1.07812 -3.09375,1.07812 H 69.640625 c -0.898437,0 -1.34375,0.44922 -1.34375,1.34375 l -3.21875,26.34375 c -0.367187,0.89844 -0.0078,1.34375 1.078125,1.34375 h 26.078125 c 1.257813,0 2.203125,0.35937 2.828125,1.07812 0.625,0.71875 0.847656,1.71094 0.671875,2.96875 l -4.3125,35.218755 c -0.53125,2.6875 -2.054687,4.03125 -4.5625,4.03125 h -26.09375 c -0.898437,0 -1.34375,0.449219 -1.34375,1.34375 l -3.21875,26.625 c -0.367187,0.898437 -0.0078,1.34375 1.078125,1.34375 h 50.01563 c 1.25,0 2.1875,0.359375 2.8125,1.078125 0.63281,0.71875 0.86328,1.703125 0.6875,2.953125 l -4.3125,35.234375 C 106.30469,-2.78125 105.8125,-1.796875 105,-1.078125 104.19531,-0.359375 103.17188,0 101.92188,0 H 5.375 C 4.300781,0 3.445312,-0.359375 2.8125,-1.078125 2.1875,-1.796875 1.96875,-2.78125 2.15625,-4.03125 l 22.046875,-180.17187 c 0.175781,-1.25 0.664063,-2.23438 1.46875,-2.95313 0.8125,-0.71875 1.753906,-1.07812 2.828125,-1.07812 h 96.54688 c 1.25,0 2.1875,0.35937 2.8125,1.07812 0.63281,0.71875 0.85937,1.70313 0.67187,2.95313 z m 0,0"
id="path1057" />
</g>
<g
id="glyph-0-4">
<path
d="M 72.875,0 C 70.71875,0 69.460938,-1.164062 69.109375,-3.5 L 61.3125,-71.265625 c 0,-0.707031 -0.273438,-1.0625 -0.8125,-1.0625 -0.71875,0 -1.078125,0.449219 -1.078125,1.34375 L 51.09375,-4.03125 c -0.179688,1.25 -0.671875,2.234375 -1.484375,2.953125 C 48.804688,-0.359375 47.867188,0 46.796875,0 H 5.375 C 4.300781,0 3.445312,-0.359375 2.8125,-1.078125 2.1875,-1.796875 1.96875,-2.78125 2.15625,-4.03125 l 22.046875,-180.17187 c 0.175781,-1.25 0.664063,-2.23438 1.46875,-2.95313 0.8125,-0.71875 1.753906,-1.07812 2.828125,-1.07812 h 58.890625 c 14.343755,0 25.679685,4.57421 34.015625,13.71875 8.34375,9.13671 12.51562,21.23437 12.51562,36.29687 0,4.30469 -0.18359,7.62109 -0.54687,9.95313 -1.25,9.85546 -4.02734,18.68359 -8.32812,26.48437 -4.30469,7.804688 -9.85938,14.121094 -16.67188,18.953125 -0.89844,0.542969 -1.16797,1.171875 -0.8125,1.890625 L 119.125,-4.578125 V -3.5 c 0,1.085938 -0.35937,1.9375 -1.07812,2.5625 C 117.32813,-0.3125 116.42969,0 115.35938,0 Z m -3.234375,-144.9375 c -0.898437,0 -1.34375,0.44922 -1.34375,1.34375 l -4.03125,31.45312 c 0,0.89844 0.445313,1.34375 1.34375,1.34375 h 3.5 c 4.300781,0 7.929687,-1.8789 10.890625,-5.64062 2.957031,-3.75781 4.4375,-8.95703 4.4375,-15.59375 0,-4.125 -0.992188,-7.30469 -2.96875,-9.54687 -1.96875,-2.23829 -4.65625,-3.35938 -8.0625,-3.35938 z m 0,0"
id="path1060" />
</g>
<g
id="glyph-0-5">
<path
d="m 83.625,0 c -2.511719,0 -3.671875,-1.253906 -3.484375,-3.765625 l -0.546875,-20.4375 c 0.175781,-0.351563 0.08594,-0.664063 -0.265625,-0.9375 -0.355469,-0.269531 -0.714844,-0.40625 -1.078125,-0.40625 H 54.859375 c -0.898437,0 -1.527344,0.449219 -1.890625,1.34375 l -5.109375,20.4375 C 47.328125,-1.253906 45.804688,0 43.296875,0 h -40.875 C -0.265625,0 -1.25,-1.429688 -0.53125,-4.296875 L 58.625,-184.73437 c 0.71875,-2.33204 2.332031,-3.5 4.84375,-3.5 h 47.59375 c 2.50781,0 3.85156,1.16796 4.03125,3.5 L 129.875,-4.296875 v 0.53125 C 129.875,-1.253906 128.53125,0 125.84375,0 Z M 64,-65.609375 c -0.355469,0.898437 -0.08594,1.34375 0.8125,1.34375 h 12.625 c 0.539062,0 0.992188,-0.445313 1.359375,-1.34375 L 77.71875,-115.35938 c 0,-0.71875 -0.226562,-1.03125 -0.671875,-0.9375 -0.449219,0.0859 -0.671875,0.39844 -0.671875,0.9375 z m 0,0"
id="path1063" />
</g>
<g
id="glyph-0-6">
<path
d="M 56.734375,2.15625 C 41.140625,2.15625 28.816406,-2.144531 19.765625,-10.75 10.710938,-19.351562 6.1875,-31.097656 6.1875,-45.984375 c 0,-1.789063 0.175781,-4.835937 0.53125,-9.140625 l 9.6875,-78.51562 c 2.144531,-17.39454 9.046875,-31.20313 20.703125,-41.42188 11.65625,-10.21875 26.085937,-15.32812 43.296875,-15.32812 15.59375,0 27.95703,4.26171 37.09375,12.78125 9.14453,8.51171 13.71875,20.21093 13.71875,35.09375 0,1.61718 -0.17969,4.57421 -0.53125,8.875 l -0.26563,1.34375 c -0.17968,1.25 -0.67187,2.28125 -1.48437,3.09375 -0.80469,0.80468 -1.74609,1.20312 -2.82812,1.20312 l -41.406255,1.34375 c -2.6875,0 -3.855469,-1.25391 -3.5,-3.76562 l 0.8125,-6.71875 c 0.351563,-3.05079 -0.09375,-5.47266 -1.34375,-7.26563 -1.25,-1.78906 -3.042969,-2.6875 -5.375,-2.6875 -2.511719,0 -4.621094,0.89844 -6.328125,2.6875 -1.699219,1.79297 -2.730469,4.21484 -3.09375,7.26563 l -10.484375,86.312495 c -0.355469,2.875 0.05078,5.210937 1.21875,7 1.164063,1.792969 3.003906,2.6875 5.515625,2.6875 2.5,0 4.597656,-0.847656 6.296875,-2.546875 1.707031,-1.707031 2.742187,-4.085938 3.109375,-7.140625 l 0.796875,-7.25 c 0.1875,-1.257813 0.679687,-2.203125 1.484375,-2.828125 0.8125,-0.625 1.753906,-0.9375 2.828125,-0.9375 L 117.78125,-60.5 c 1.25,0 2.1875,0.40625 2.8125,1.21875 0.63281,0.804688 0.86328,1.828125 0.6875,3.078125 l -0.26562,1.078125 c -2.15625,17.386719 -9.10938,31.28125 -20.85938,41.6875 C 88.414062,-3.039062 73.941406,2.15625 56.734375,2.15625 Z m 0,0"
id="path1066" />
</g>
<g
id="glyph-0-7">
<path
d="m 55.9375,2.15625 c -15.417969,0 -27.609375,-3.988281 -36.578125,-11.96875 -8.960937,-7.976562 -13.4375,-18.601562 -13.4375,-31.875 0,-1.25 0.175781,-3.488281 0.53125,-6.71875 L 7.53125,-56.734375 C 7.707031,-57.992188 8.195312,-58.976562 9,-59.6875 c 0.8125,-0.71875 1.753906,-1.078125 2.828125,-1.078125 h 40.875 c 1.070313,0 1.921875,0.359375 2.546875,1.078125 0.632812,0.710938 0.863281,1.695312 0.6875,2.953125 l -0.546875,5.90625 c -0.355469,2.875 0.0039,5.210937 1.078125,7 1.070312,1.792969 2.6875,2.6875 4.84375,2.6875 2.332031,0 4.300781,-0.984375 5.90625,-2.953125 1.613281,-1.976562 2.421875,-4.398438 2.421875,-7.265625 0,-2.6875 -1.304687,-5.460937 -3.90625,-8.328125 -2.59375,-2.875 -7.5625,-7.269531 -14.90625,-13.1875 -7.179687,-5.914062 -13.101563,-11.160156 -17.765625,-15.734375 -4.65625,-4.570313 -8.6875,-10.21875 -12.09375,-16.937505 -3.40625,-6.71875 -5.109375,-14.3789 -5.109375,-22.98437 0,-1.61328 0.179687,-4.39453 0.546875,-8.34375 1.96875,-15.95703 8.597656,-28.86328 19.890625,-38.71875 11.300781,-9.86328 25.375,-14.79687 42.21875,-14.79687 15.414063,0 27.562505,4.125 36.437505,12.375 8.875,8.25 13.31249,19.36718 13.31249,33.34375 0,1.61718 -0.17968,4.21484 -0.53124,7.79687 l -0.8125,5.92188 c -0.17969,1.25 -0.67188,2.23437 -1.48438,2.95312 -0.80469,0.71875 -1.74219,1.07812 -2.8125,1.07812 H 82.015625 c -1.074219,0 -1.929687,-0.35937 -2.5625,-1.07812 -0.625,-0.71875 -0.84375,-1.70312 -0.65625,-2.95312 l 0.796875,-7 c 0.175781,-2.6875 -0.320312,-4.87891 -1.484375,-6.57813 -1.15625,-1.70703 -2.8125,-2.5625 -4.96875,-2.5625 -2.511719,0 -4.574219,1.07813 -6.1875,3.23438 -1.617187,2.14843 -2.421875,5.01171 -2.421875,8.59375 0,3.05468 1.253906,6.19531 3.765625,9.42187 2.507813,3.21875 7.171875,7.69922 13.984375,13.4375 9.144531,7.71094 16.132812,13.9375 20.96875,18.6875 4.84375,4.75 8.65625,9.953125 11.4375,15.609375 2.78125,5.648437 4.17188,12.054687 4.17188,19.21875 0,1.4375 -0.1836,3.949219 -0.54688,7.53125 -2.14844,16.3125 -8.91406,29.3125 -20.296875,39 C 86.628906,-2.679688 72.601562,2.15625 55.9375,2.15625 Z m 0,0"
id="path1069" />
</g>
<g
id="glyph-0-8">
<path
d="m 57.546875,2.15625 c -15.960937,0 -28.511719,-4.347656 -37.65625,-13.046875 C 10.753906,-19.585938 6.1875,-31.375 6.1875,-46.25 c 0,-1.789062 0.175781,-4.835938 0.53125,-9.140625 l 9.6875,-77.453125 c 2.144531,-17.5625 9.085938,-31.53906 20.828125,-41.9375 11.75,-10.40625 26.40625,-15.60937 43.96875,-15.60937 15.78125,0 28.285155,4.35156 37.515625,13.04687 9.23828,8.69922 13.85937,20.48438 13.85937,35.35938 0,1.79296 -0.18359,4.83984 -0.54687,9.14062 l -9.40625,77.453125 c -2.15625,17.5625 -9.15234,31.546875 -20.98437,41.953125 C 89.816406,-3.039062 75.117188,2.15625 57.546875,2.15625 Z m 5.375,-43.296875 c 2.6875,0 4.972656,-1.070313 6.859375,-3.21875 1.882812,-2.15625 3.09375,-5.117187 3.625,-8.890625 l 9.953125,-81.73437 c 0.363281,-3.76954 -0.08594,-6.72657 -1.34375,-8.875 -1.25,-2.15625 -3.226563,-3.23438 -5.921875,-3.23438 -2.867188,0 -5.242188,1.07813 -7.125,3.23438 -1.875,2.14843 -2.996094,5.10546 -3.359375,8.875 L 55.65625,-53.25 c -0.179688,0.71875 -0.265625,1.710938 -0.265625,2.96875 0,2.867188 0.671875,5.105469 2.015625,6.71875 1.34375,1.617188 3.179688,2.421875 5.515625,2.421875 z m 0,0"
id="path1072" />
</g>
<g
id="glyph-0-9">
<path
d="M 38.71875,0 C 36.207031,0 34.863281,-1.164062 34.6875,-3.5 L 21.25,-183.9375 c 0,-2.86328 1.429688,-4.29687 4.296875,-4.29687 H 68.03125 c 2.507812,0 3.765625,1.25781 3.765625,3.76562 l -1.34375,83.35937 c -0.179687,0.54297 0,0.8125 0.53125,0.8125 0.539063,0 0.8125,-0.26953 0.8125,-0.8125 l 19.90625,-83.35937 c 0.53125,-2.50781 2.140625,-3.76562 4.828125,-3.76562 h 31.73437 c 2.50782,0 3.76563,1.25781 3.76563,3.76562 l 0.8125,83.35937 c 0,0.35547 0.22266,0.57813 0.67187,0.67188 0.44532,0.0937 0.67188,-0.12891 0.67188,-0.67188 l 18.01562,-83.35937 c 0.71875,-2.50781 2.23829,-3.76562 4.5625,-3.76562 h 41.42188 c 3.03906,0 4.02344,1.43359 2.95312,4.29687 L 145.75,-3.5 C 145.03125,-1.164062 143.41406,0 140.90625,0 H 104.875 c -2.51172,0 -3.76562,-1.253906 -3.76562,-3.765625 l -0.53125,-87.65625 c 0.17578,-0.539063 0.0391,-0.765625 -0.40625,-0.671875 -0.449224,0.08594 -0.76563,0.398438 -0.95313,0.9375 l -19.625,87.390625 C 78.875,-1.253906 77.257812,0 74.75,0 Z m 0,0"
id="path1075" />
</g>
</g>
</defs>
<rect
style="fill:#ffffff;stroke:none;stroke-width:3.77953;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke"
id="rect3119"
width="459.99997"
height="220.00005"
x="18.461493"
y="142.69234" />
<g
fill="#ff0000"
fill-opacity="1"
id="g1084"
transform="translate(-325.88023,-99.42034)"
style="stroke:none;stroke-width:3.77953;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1">
<use
x="346.25018"
y="449.44913"
xlink:href="#glyph-0-1"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1082"
width="100%"
height="100%"
style="stroke:none;stroke-width:3.77953;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
fill="#00ffff"
fill-opacity="1"
id="g1096"
transform="translate(-325.88023,-99.42034)"
style="stroke:none;stroke-width:3.77953;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1">
<use
x="367.86618"
y="444.45868"
xlink:href="#glyph-0-1"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1094"
width="100%"
height="100%"
style="stroke:none;stroke-width:3.77953;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
<g
fill="#191919"
fill-opacity="1"
id="g1108"
transform="translate(-325.88023,-99.42034)">
<use
x="357.05817"
y="446.95392"
xlink:href="#glyph-0-1"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1106"
width="100%"
height="100%" />
</g>
<g
id="g2444"
transform="translate(-28.855005,-323.26648)"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1">
<g
fill="#ff0000"
fill-opacity="1"
id="g1120"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1">
<use
x="195.25949"
y="672.49548"
xlink:href="#glyph-0-4"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1118"
width="100%"
height="100%"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1" />
</g>
<g
fill="#00ffff"
fill-opacity="1"
id="g1140"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1">
<use
x="216.87549"
y="667.505"
xlink:href="#glyph-0-4"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1138"
width="100%"
height="100%"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1" />
</g>
<g
fill="#191919"
fill-opacity="1"
id="g1160"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1">
<use
x="206.06749"
y="670.00024"
xlink:href="#glyph-0-4"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1158"
width="100%"
height="100%"
style="stroke-width:3.77952756;stroke-miterlimit:4;stroke-dasharray:none;stroke:none;stroke-opacity:1" />
</g>
</g>
<g
id="g2436"
transform="translate(69.606615,-550.1895)">
<g
fill="#ff0000"
fill-opacity="1"
id="g1180">
<use
x="242.45149"
y="895.54181"
xlink:href="#glyph-0-7"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1178"
width="100%"
height="100%" />
</g>
<g
fill="#00ffff"
fill-opacity="1"
id="g1196">
<use
x="264.0675"
y="890.55133"
xlink:href="#glyph-0-7"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1194"
width="100%"
height="100%" />
</g>
<g
fill="#191919"
fill-opacity="1"
id="g1212">
<use
x="253.25949"
y="893.04657"
xlink:href="#glyph-0-7"
xlink:type="simple"
xlink:actuate="onLoad"
xlink:show="embed"
id="use1210"
width="100%"
height="100%" />
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

15
src/pages/api/create-account.js
Unescape Escape View File

@ -41,8 +41,8 @@ const createUser = async (email, salt, hashRes) => {
};
// Create a new subscription for the user
const createSubscription = async (userId) => {
await db.run('insert into subscriptions (uuid, user_id) values (?, ?);', randomUUID(), userId);
const createSubscription = async (userId, type) => {
await db.run('insert into subscriptions (uuid, user_id, type) values (?, ?, ?);', randomUUID(), userId, type);
};
async function handler(req, res) {
@ -61,6 +61,7 @@ async function handler(req, res) {
const session = (csi && await stripe.checkout.sessions.retrieve(csi)) ||
(patreon_magic_key === process.env.PATREON_MAGIC_KEY ? { customer_details: { email } } : false);
const emailFromSession = session && session.customer_details.email;
const sessionType = session && session?.metadata?.type;
// Validate session and email
if (!session || !emailFromSession || email !== emailFromSession) {
@ -84,22 +85,22 @@ async function handler(req, res) {
const salt = genSalt();
const hashRes = await hash(salt, password);
const userId = await createUser(email, salt, hashRes);
await createSubscription(userId);
await createSubscription(userId, sessionType);
console.log('User created successfully');
res.redirect('/reactors');
res.status(303).redirect('/reactors/account');
} else {
// Handle missing or invalid form data
if (!email || !csi) {
console.error('Missing email or csi');
res.redirect('/reactors/create-account?unexpected_error=true');
res.status(303).redirect('/reactors/create-account?unexpected_error=true');
return;
}
if (!password) {
res.redirect(makeMsg(csi, email, 'Please enter a password'));
res.status(303).redirect(makeMsg(csi, email, 'Please enter a password'));
return;
}
if (password !== passwordagain) {
res.redirect(makeMsg(csi, email, 'Passwords did not match. Please try again.'));
res.status(303).redirect(makeMsg(csi, email, 'Passwords did not match. Please try again.'));
return;
}
}

8
src/pages/api/sign-in.js
Unescape Escape View File

@ -46,16 +46,16 @@ async function handler(req, res) {
const expiresDate = new Date(today.getTime() + (1000 * maxAge));
await db.run('insert into sessions (user_id, session_id, expires) values (?, ?, ?);', userId, sessionId, expiresDate.toISOString());
setCookie('session', sessionId, { req, res, maxAge: rememberMe ? maxAge : undefined, httpOnly: true, sameSite: true, secure: process.env.NODE_ENV === 'production' });
res.redirect('/reactors/account')
res.status(303).redirect('/reactors/account')
} else {
res.redirect(makeMsg(email, 'Invalid password or account does not exist.'));
res.status(303).redirect(makeMsg(email, 'Invalid password or account does not exist.'));
}
} else {
if (!email) {
res.redirect(makeMsg(email, 'Please enter an email address.'));
res.status(303).redirect(makeMsg(email, 'Please enter an email address.'));
}
if (!password) {
res.redirect(makeMsg(email, 'Please enter a password.'));
res.status(303).redirect(makeMsg(email, 'Please enter a password.'));
}
}
} else {

2
src/pages/api/sign-out.js
Unescape Escape View File

@ -3,7 +3,7 @@ import { deleteCookie } from 'cookies-next';
export default async function handler(req, res) {
if (req.method === 'POST') {
deleteCookie('session', { req, res, httpOnly: true, sameSite: true, secure: process.env.NODE_ENV === 'production' });
res.redirect('/reactors');
res.status(303).redirect('/');
} else {
// Handle any other HTTP method
}

Write Preview
Loading…
Cancel
Save