From de8c03f342adeb95fdf7b9ec16a86f71b13f2673 Mon Sep 17 00:00:00 2001 From: kjuulh Date: Sun, 24 Apr 2022 23:12:11 +0200 Subject: [PATCH] Add base app --- .gitignore | 37 + .idea/.gitignore | 5 + .idea/client.iml | 12 + .idea/inspectionProfiles/Project_Default.xml | 16 + .idea/modules.xml | 8 + .idea/prettier.xml | 7 + .idea/vcs.xml | 6 + README.md | 23 + components/common/Link.tsx | 16 + components/common/result/index.ts | 1 + components/common/result/result.ts | 60 ++ .../domain/wishes/createWish/CreateWish.tsx | 85 ++ components/domain/wishes/models.ts | 23 + .../authentication/AuthLayout.module.scss | 4 + .../layout/authentication/AuthLayout.tsx | 55 ++ components/layout/home/HomeLayout.module.scss | 6 + components/layout/home/HomeLayout.tsx | 21 + next-env.d.ts | 5 + next.config.js | 4 + package.json | 24 + pages/_app.tsx | 8 + pages/home/index.tsx | 22 + pages/index.tsx | 29 + pages/sign-in.tsx | 40 + pages/sign-up.tsx | 43 + pnpm-lock.yaml | 773 ++++++++++++++++++ postcss.config.js | 6 + prettier.config.js | 4 + public/favicon.ico | Bin 0 -> 15086 bytes public/vercel.svg | 4 + styles/globals.css | 3 + tailwind.config.js | 10 + tsconfig.json | 20 + 33 files changed, 1380 insertions(+) create mode 100644 .gitignore create mode 100644 .idea/.gitignore create mode 100644 .idea/client.iml create mode 100644 .idea/inspectionProfiles/Project_Default.xml create mode 100644 .idea/modules.xml create mode 100644 .idea/prettier.xml create mode 100644 .idea/vcs.xml create mode 100644 README.md create mode 100644 components/common/Link.tsx create mode 100644 components/common/result/index.ts create mode 100644 components/common/result/result.ts create mode 100644 components/domain/wishes/createWish/CreateWish.tsx create mode 100644 components/domain/wishes/models.ts create mode 100644 components/layout/authentication/AuthLayout.module.scss create mode 100644 components/layout/authentication/AuthLayout.tsx create mode 100644 components/layout/home/HomeLayout.module.scss create mode 100644 components/layout/home/HomeLayout.tsx create mode 100644 next-env.d.ts create mode 100644 next.config.js create mode 100644 package.json create mode 100644 pages/_app.tsx create mode 100644 pages/home/index.tsx create mode 100644 pages/index.tsx create mode 100644 pages/sign-in.tsx create mode 100644 pages/sign-up.tsx create mode 100644 pnpm-lock.yaml create mode 100644 postcss.config.js create mode 100644 prettier.config.js create mode 100644 public/favicon.ico create mode 100644 public/vercel.svg create mode 100644 styles/globals.css create mode 100644 tailwind.config.js create mode 100644 tsconfig.json diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..88b6f0d --- /dev/null +++ b/.gitignore @@ -0,0 +1,37 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env.local +.env.development.local +.env.test.local +.env.production.local + +# vercel +.vercel + +# typescript +*.tsbuildinfo diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..b58b603 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,5 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/client.iml b/.idea/client.iml new file mode 100644 index 0000000..0c8867d --- /dev/null +++ b/.idea/client.iml @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml new file mode 100644 index 0000000..adbfa0a --- /dev/null +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -0,0 +1,16 @@ + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..0742ebc --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/prettier.xml b/.idea/prettier.xml new file mode 100644 index 0000000..727b8b5 --- /dev/null +++ b/.idea/prettier.xml @@ -0,0 +1,7 @@ + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..94a25f7 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..5be2b41 --- /dev/null +++ b/README.md @@ -0,0 +1,23 @@ +# Next.js + Tailwind CSS Example + +This example shows how to use [Tailwind CSS](https://tailwindcss.com/) [(v3.0)](https://tailwindcss.com/blog/tailwindcss-v3) with Next.js. It follows the steps outlined in the official [Tailwind docs](https://tailwindcss.com/docs/guides/nextjs). + +## Deploy your own + +Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example) or preview live with [StackBlitz](https://stackblitz.com/github/vercel/next.js/tree/canary/examples/with-tailwindcss) + +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-tailwindcss&project-name=with-tailwindcss&repository-name=with-tailwindcss) + +## How to use + +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example: + +```bash +npx create-next-app --example with-tailwindcss with-tailwindcss-app +# or +yarn create next-app --example with-tailwindcss with-tailwindcss-app +# or +pnpm create next-app -- --example with-tailwindcss with-tailwindcss-app +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/components/common/Link.tsx b/components/common/Link.tsx new file mode 100644 index 0000000..75d9daf --- /dev/null +++ b/components/common/Link.tsx @@ -0,0 +1,16 @@ +import { FC } from 'react' +import NextLink from 'next/link' + +interface LinkProps { + page: string + className: string +} +const Link: FC = (props) => ( + + + {props.children} + + +) + +export default Link diff --git a/components/common/result/index.ts b/components/common/result/index.ts new file mode 100644 index 0000000..6a5cd41 --- /dev/null +++ b/components/common/result/index.ts @@ -0,0 +1 @@ +export * as result from './result' diff --git a/components/common/result/result.ts b/components/common/result/result.ts new file mode 100644 index 0000000..619781d --- /dev/null +++ b/components/common/result/result.ts @@ -0,0 +1,60 @@ +import { result } from '.' + +type Ok = { + type: 'ok' + val: T +} +export const ok = (val: T): Ok => ({ type: 'ok', val }) +type Err = { + type: 'err' + err: T +} +export const err = (err: T): Err => ({ type: 'err', err }) + +export type Result = Ok | Err + +export const isOk = (r: result.Result): boolean => { + switch (r.type) { + case 'ok': + return true + default: + return false + } +} + +export const getValue = (r: result.Result): TOk => { + if (r.type === 'ok') { + return r.val + } + + throw new Error(`couldn't get value as type is error: ${r.err}`) +} + +export const tap = ( + r: result.Result, + okFunc: (okRes: TOk) => void, + errFunc: (errRes: TErr) => void = (err) => { + console.log("default tap catch of error, note tap doesn't break chain") + } +): result.Result => { + switch (r.type) { + case 'ok': + okFunc(r.val) + break + case 'err': + errFunc(r.err) + break + } + + return r +} + +export const getError = ( + r: result.Result +): TErr => { + if (r.type === 'err') { + return r.err + } + + throw new Error(`couldn't get value as type is ok: ${r.val}`) +} diff --git a/components/domain/wishes/createWish/CreateWish.tsx b/components/domain/wishes/createWish/CreateWish.tsx new file mode 100644 index 0000000..c6362bf --- /dev/null +++ b/components/domain/wishes/createWish/CreateWish.tsx @@ -0,0 +1,85 @@ +import { FC, FormEvent, SyntheticEvent, useState } from 'react' +import { result } from '../../../common/result' +import { createWish, Wish } from '../models' + +interface CreateWishProps { + onFocus: () => void + onSubmit: (wish: Wish) => void +} + +const CreateWish: FC = (props) => { + const [focused, setFocused] = useState(false) + + const onSubmit = (e: SyntheticEvent) => { + e.preventDefault() + + const target = e.target as typeof e.target & { + wishName: { value: string } + wishDescription: { value?: string } + wishLink: { value?: string } + } + + const wishRes = createWish( + target.wishName.value, + target.wishDescription.value, + target.wishLink.value + ) + + result.tap(wishRes, (wish) => { + props.onSubmit(wish) + }) + } + + return ( +
setFocused(true)}> + +
+
+
+
+ +
+ +
+
+
+ +
+
+ +
+ ) +} + +const InnerWishPrompt: FC = (props) => { + return ( +
+