diff --git a/next.config.mjs b/next.config.mjs index d35ea36..d88475a 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -17,6 +17,11 @@ const config = { protocol: "https", port: '', hostname: "m.media-amazon.com" + }, + { + protocol: "https", + port: '', + hostname: "storage.thatalex.dev" } ] } diff --git a/package-lock.json b/package-lock.json index c09dc40..8035c06 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "@trpc/next": "^10.37.1", "@trpc/react-query": "^10.37.1", "@trpc/server": "^10.37.1", + "grommet-icons": "^4.11.0", "next": "^13.5.4", "next-auth": "^4.23.0", "react": "18.2.0", @@ -74,6 +75,27 @@ "node": ">=6.9.0" } }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz", + "integrity": "sha512-61Mf7Ufx4aDxx1xlDeOm8aFFigGHE4z+0sKCa+IHCeZKiyP9RLD0Mmx7m8b9/Cf37f7NAvQOOJAbQQGVr5uERw==", + "peer": true, + "dependencies": { + "@emotion/memoize": "^0.8.1" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", + "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==", + "peer": true + }, + "node_modules/@emotion/unitless": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz", + "integrity": "sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==", + "peer": true + }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -650,6 +672,12 @@ "integrity": "sha512-MMzuxN3GdFwskAnb6fz0orFvhfqi752yjaXylr0Rp4oDg5H0Zn1IuyRhDVvYOwAXoJirx2xuS16I3WjxnAIHiQ==", "dev": true }, + "node_modules/@types/stylis": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.2.tgz", + "integrity": "sha512-Rm17MsTpQQP5Jq4BF7CdrxJsDufoiL/q5IbJZYZmOZAJALyijgF7BzLgobXUqraNcQdqFYLYGeglDp6QzaxPpg==", + "peer": true + }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "6.8.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.8.0.tgz", @@ -1270,6 +1298,15 @@ "node": ">= 6" } }, + "node_modules/camelize": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.1.tgz", + "integrity": "sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==", + "peer": true, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/caniuse-lite": { "version": "1.0.30001551", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001551.tgz", @@ -1418,6 +1455,26 @@ "node": ">= 8" } }, + "node_modules/css-color-keywords": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", + "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==", + "peer": true, + "engines": { + "node": ">=4" + } + }, + "node_modules/css-to-react-native": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.2.0.tgz", + "integrity": "sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==", + "peer": true, + "dependencies": { + "camelize": "^1.0.0", + "css-color-keywords": "^1.0.0", + "postcss-value-parser": "^4.0.2" + } + }, "node_modules/cssesc": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", @@ -1433,8 +1490,7 @@ "node_modules/csstype": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", - "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", - "dev": true + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/damerau-levenshtein": { "version": "1.0.8", @@ -2467,6 +2523,16 @@ "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==", "dev": true }, + "node_modules/grommet-icons": { + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/grommet-icons/-/grommet-icons-4.11.0.tgz", + "integrity": "sha512-ArXf2XyXmpk5JsQ8NudzNz3mbWv+TeZkPiyog2s9yoNAWTlIr3vzNjr97uon/Xm4Uiq2kiHkvO4i2fG1u6EaDg==", + "peerDependencies": { + "react": "^16.6.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.6.0 || ^17.0.0 || ^18.0.0", + "styled-components": ">= 5.x" + } + }, "node_modules/has": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/has/-/has-1.0.4.tgz", @@ -3761,8 +3827,7 @@ "node_modules/postcss-value-parser": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", - "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", - "dev": true + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" }, "node_modules/preact": { "version": "10.18.1", @@ -4208,6 +4273,12 @@ "node": ">= 0.4" } }, + "node_modules/shallowequal": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==", + "peer": true + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -4366,6 +4437,34 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/styled-components": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.1.0.tgz", + "integrity": "sha512-VWNfYYBuXzuLS/QYEeoPgMErP26WL+dX9//rEh80B2mmlS1yRxRxuL5eax4m6ybYEUoHWlTy2XOU32767mlMkg==", + "peer": true, + "dependencies": { + "@emotion/is-prop-valid": "^1.2.1", + "@emotion/unitless": "^0.8.0", + "@types/stylis": "^4.0.2", + "css-to-react-native": "^3.2.0", + "csstype": "^3.1.2", + "postcss": "^8.4.31", + "shallowequal": "^1.1.0", + "stylis": "^4.3.0", + "tslib": "^2.5.0" + }, + "engines": { + "node": ">= 16" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/styled-components" + }, + "peerDependencies": { + "react": ">= 16.8.0", + "react-dom": ">= 16.8.0" + } + }, "node_modules/styled-jsx": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.1.1.tgz", @@ -4388,6 +4487,12 @@ } } }, + "node_modules/stylis": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.0.tgz", + "integrity": "sha512-E87pIogpwUsUwXw7dNyU4QDjdgVMy52m+XEOPEKUn161cCzWjjhPSQhByfd1CcNvrOLnXQ6OnnZDwnJrz/Z4YQ==", + "peer": true + }, "node_modules/sucrase": { "version": "3.34.0", "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.34.0.tgz", diff --git a/package.json b/package.json index 4a1581c..efeb183 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "@trpc/next": "^10.37.1", "@trpc/react-query": "^10.37.1", "@trpc/server": "^10.37.1", + "grommet-icons": "^4.11.0", "next": "^13.5.4", "next-auth": "^4.23.0", "react": "18.2.0", diff --git a/prisma/schema.prisma b/prisma/schema.prisma index 17b634b..b3c1227 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -1,16 +1,9 @@ -// This is your Prisma schema file, -// learn more about it in the docs: https://pris.ly/d/prisma-schema - generator client { provider = "prisma-client-js" } datasource db { provider = "sqlite" - // NOTE: When using mysql or sqlserver, uncomment the @db.Text annotations in model Account below - // Further reading: - // https://next-auth.js.org/adapters/prisma#create-the-prisma-schema - // https://www.prisma.io/docs/reference/api-reference/prisma-schema-reference#string url = env("DATABASE_URL") } diff --git a/src/components/HeaderItem.tsx b/src/components/HeaderItem.tsx index b51bc6a..61ac19e 100644 --- a/src/components/HeaderItem.tsx +++ b/src/components/HeaderItem.tsx @@ -7,7 +7,6 @@ type HeaderItemProps = { newWindow?: boolean } export default function HeaderItem(props: HeaderItemProps) { - console.log(props, props.newWindow ? "_blank" : "self") if (props.onClick) { return ( <> diff --git a/src/components/ReviewCard.tsx b/src/components/ReviewCard.tsx index 84ed62d..dab2557 100644 --- a/src/components/ReviewCard.tsx +++ b/src/components/ReviewCard.tsx @@ -1,18 +1,25 @@ import Image from "next/image" +import Link from 'next/link'; type ReviewCardProps = { title: string, image: string, - url: string + url: string, + showText: boolean } export default function ReviewCard(props: ReviewCardProps) { return ( - <> -
- {props.title -

{props.title}

+ +
+ {props.title + { + props.showText ? +

{props.title}

+ : + "" + }
- + ) } \ No newline at end of file diff --git a/src/components/footer.tsx b/src/components/footer.tsx new file mode 100644 index 0000000..98bb707 --- /dev/null +++ b/src/components/footer.tsx @@ -0,0 +1,34 @@ +import { Twitter, LinkedinOption, MailOption } from "grommet-icons" +import Link from 'next/link'; + +export default function Footer() { + return ( + <> +
+

+ +

+ alex@alexavfrantz.com +

+ +

+

+ © Alex Frantz, 2023 +

+

+ + + + + + + + + + + +

+
+ + ) +} \ No newline at end of file diff --git a/src/components/header.tsx b/src/components/header.tsx index 379881f..2c11efa 100644 --- a/src/components/header.tsx +++ b/src/components/header.tsx @@ -1,5 +1,5 @@ -import Link from "next/link"; import {useSession, signIn, signOut} from 'next-auth/react'; +import Head from 'next/head'; import HeaderItem from "./HeaderItem"; export default function Header() { @@ -12,7 +12,6 @@ export default function Header() {
-
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx new file mode 100644 index 0000000..c77cec0 --- /dev/null +++ b/src/pages/_document.tsx @@ -0,0 +1,17 @@ +import { Html, Head, Main, NextScript } from 'next/document' + +export default function Document() { + return ( + + + + + + + +
+ + + + ) +} \ No newline at end of file diff --git a/src/pages/example.tsx b/src/pages/example.tsx deleted file mode 100644 index bf32993..0000000 --- a/src/pages/example.tsx +++ /dev/null @@ -1,80 +0,0 @@ -import { signIn, signOut, useSession } from "next-auth/react"; -import Head from "next/head"; -import Link from "next/link"; - -import { api } from "@/utils/api"; - -export default function Home() { - const hello = api.post.hello.useQuery({ text: "from tRPC" }); - - return ( - <> - - Create T3 App - - - -
-
-

- Create T3 App -

-
- -

First Steps →

-
- Just the basics - Everything you need to know to set up your - database and authentication. -
- - -

Documentation →

-
- Learn more about Create T3 App, the libraries it uses, and how - to deploy it. -
- -
-
-

- {hello.data ? hello.data.greeting : "Loading tRPC query..."} -

- -
-
-
- - ); -} - -function AuthShowcase() { - const { data: sessionData } = useSession(); - - const { data: secretMessage } = api.post.getSecretMessage.useQuery( - undefined, // no input - { enabled: sessionData?.user !== undefined } - ); - - return ( -
-

- {sessionData && Logged in as {sessionData.user?.name}} - {secretMessage && - {secretMessage}} -

- -
- ); -} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 3c6eb31..98e4614 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,13 +1,13 @@ -import { signIn, signOut, useSession } from "next-auth/react"; -import Head from "next/head" import Header from "@/components/header"; +import Footer from "@/components/footer"; export default function Home() { return ( -
+

test

+
) diff --git a/src/pages/reviews/[name].tsx b/src/pages/reviews/[name].tsx index 042d971..86020d0 100644 --- a/src/pages/reviews/[name].tsx +++ b/src/pages/reviews/[name].tsx @@ -1,17 +1,47 @@ import {useRouter} from 'next/router'; -import {useState, useEffect} from 'react' +import Header from '@/components/header'; +import Footer from "@/components/footer"; +import Image from 'next/image'; import {api} from '@/utils/api' -import { useSession } from 'next-auth/react'; +import Link from 'next/link'; export default function ReviewPage() { const router = useRouter() const name = router.query.name as string const {data: bookData} = api.post.getOne.useQuery(name) - const [view,setView] = useState(null) - return ( - <> -

Post: {router.query.name}

- - ) + if (bookData) { + return ( +
+
+
+ {`${bookData.name} +
+ +
+

{bookData.name}

+
+ {bookData.reviewContents} +
+
+
+ ) + } else { + return ( +
+
+
+

Well, that's not good..

+
+ +
+

You've reached a page that doesn't exist. Lets fix that.

+ + Head Home + +
+
+
+ ) + } } \ No newline at end of file diff --git a/src/pages/reviews/create.tsx b/src/pages/reviews/create.tsx index 0691b39..176b0d6 100644 --- a/src/pages/reviews/create.tsx +++ b/src/pages/reviews/create.tsx @@ -1,6 +1,8 @@ import {useSession, getSession} from 'next-auth/react'; -import {useState, useEffect, FormEvent} from 'react'; +import {useState, useEffect} from 'react'; +import type {FormEvent} from 'react'; import Header from '@/components/header'; +import Footer from "@/components/footer"; import Router from 'next/router'; import { api } from "@/utils/api"; @@ -12,17 +14,23 @@ export default function Page() { useEffect(() => { if (status == "unauthenticated") { console.log('user is unauthenticated!') - Router.replace('/') + Router.replace('/').catch(() => { + console.error("Failed to reroute user!") + }) } else { setLoading(false) } }, [status]) + function sanitizeTitleForLink(title: string) { + return title.replaceAll(" ", "-").toLowerCase() + } + function onSubmit(event: FormEvent) { event.preventDefault() const object = { - name: event.target.title.value, + name: sanitizeTitleForLink(event.target.title.value), reviewContents: event.target.review.value, image: event.target.image.value, type: event.target.type.value @@ -48,11 +56,12 @@ export default function Page() {

-