-
-
- User
-
1.310
@@ -50,7 +52,7 @@ function Hero() {
>; +} + +export function LandingPage({ providers }: LandingPageProps) { + const t = useTranslations("landingPage"); + const { theme } = useTheme(); + + const slides = [ + { + title: "Easy UI", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + image: "https://placehold.co/500x300?text=Slide+1", + }, + { + title: "Second slide", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + image: "https://placehold.co/500x300?text=Slide+2", + }, + { + title: "Third slide", + description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + image: "https://placehold.co/500x300?text=Slide+3", + }, + ]; + return ( <> -
- + ++ {/*+++ {t.rich("header", { + gradient: text => {text}, + })} +
++ {t("subheader")} +
++++ {slides.map((slide, index) => ( + ++ + foobar... + ++ ))} ++
+ {t.rich("subheader2", { + link: text => ( + + {text} + + ), + })} +
++++ */} + {/* */} ); } diff --git a/src/app/[locale]/(home)/layout.tsx b/src/app/[locale]/(home)/layout.tsx index edabab2..bf8c7c7 100644 --- a/src/app/[locale]/(home)/layout.tsx +++ b/src/app/[locale]/(home)/layout.tsx @@ -4,7 +4,6 @@ import { getLeaguesForCurrentUser } from "@/db/model/league"; import { getCurrentUser } from "@/lib/session"; import { LeagueHeader } from "@/app/[locale]/(home)/league-header"; import { Container } from "@/components/container"; -import { Card, CardBody, CardHeader } from "@nextui-org/card"; export const metadata = { title: "Hilde - Platform", @@ -27,19 +26,12 @@ export default async function HomeLayout({ return ( - ---- {children} - -+- -... -+); diff --git a/src/app/[locale]/(home)/login.tsx b/src/app/[locale]/(home)/login.tsx new file mode 100644 index 0000000..415d49b --- /dev/null +++ b/src/app/[locale]/(home)/login.tsx @@ -0,0 +1,97 @@ +"use client"; + +import { Card, CardBody } from "@nextui-org/card"; +import { getProviders, signIn } from "next-auth/react"; +import { useState } from "react"; +import { Button, Input } from "@nextui-org/react"; +import { LoginProviderIcon } from "@/components/login-provider-icon"; +import { useSearchParams } from "next/navigation"; + +interface LoginProps { + providers: Awaited+ {children} + Sign In +
++ + + ); +} diff --git a/src/app/[locale]/(home)/match-creation-form.tsx b/src/app/[locale]/(home)/match-creation-form.tsx index 4dcec23..336fb65 100644 --- a/src/app/[locale]/(home)/match-creation-form.tsx +++ b/src/app/[locale]/(home)/match-creation-form.tsx @@ -22,9 +22,9 @@ interface FormValues { } export function MatchCreationForm({ teams }: MatchCreationFormProps) { - const { register, control, setValue } = useForm+ {searchParams.get("login") === "verify-request" ? ( + ++ Alright! Check your email for your sign in link. +
+ ) : ( + <> + + + {providers && ( + <> +++ ++ +++ + Or continue with + +++ {Object.values(providers) + .filter(p => !["email"].includes(p.id)) + .map(provider => ( ++ + )} + + )} ++ ++ ))} +({ + const { register, control } = useForm ({ defaultValues: { - team1: ["dubi"], + team1: ["foo", "bar", "foobar", "foozbar", "foobaz", "whahaah"], score1: "", team2: [], score2: "", @@ -41,7 +41,7 @@ export function MatchCreationForm({ teams }: MatchCreationFormProps) { -+vs -+({ - value: team.name, - label: team.name, - __isNew__: false, - })); - const groupedOptions = [ - { - label: "Players", - options: teams.filter(t => t.teamSize === 1).map(team => ({ - value: team.name, - label: team.name, - __isNew__: false, - })) - }, - { - label: "Teams", - options: teams.filter(t => t.teamSize > 1).map(team => ({ - value: team.name, - label: team.name, - __isNew__: false, - })) - } - ]; + const options = teams + .filter(t => t.teamSize === 1) + .map(team => ({ + value: team.name, + label: team.name, + })); return ( - +-- + Team(s) + +- - -"w-full", - valueContainer: state => "background-transparent", + valueContainer: state => + "background-transparent py-2 flex gap-1 px-2 py-1", placeholder: state => "px-3", - input: state => "px-3", + input: state => "", menu: state => "z-10 inline-flex flex-col justify-center subpixel-antialiased outline-none box-border text-small bg-content1 rounded-large shadow-medium w-full p-1 overflow-hidden mt-1.5", menuList: state => "p-3", option: state => - `flex group gap-2 items-center justify-between relative px-2 py-1.5 w-full h-full box-border rounded-small subpixel-antialiased cursor-pointer tap-highlight-transparent outline-none data-[focus-visible=true]:z-10 data-[focus-visible=true]:outline-2 data-[focus-visible=true]:outline-focus data-[focus-visible=true]:outline-offset-2 data-[focus-visible=true]:dark:ring-offset-background-content1 hover:transition-colors hover:bg-default hover:text-default-foreground data-[selectable=true]:focus:bg-default data-[selectable=true]:focus:text-default-foreground active:bg-red-100 ${state.isFocused ? "bg-default" : ""}`, + `flex group gap-2 items-center justify-between relative px-2 py-1.5 w-full h-full box-border rounded-small subpixel-antialiased cursor-pointer tap-highlight-transparent outline-none data-[focus-visible=true]:z-10 data-[focus-visible=true]:outline-2 data-[focus-visible=true]:outline-focus data-[focus-visible=true]:outline-offset-2 data-[focus-visible=true]:dark:ring-offset-background-content1 hover:transition-colors hover:bg-default hover:text-default-foreground data-[selectable=true]:focus:bg-default data-[selectable=true]:focus:text-default-foreground active:bg-red-100 ${ + state.isFocused ? "bg-default" : "" + }`, multiValue: state => - "ml-2 relative max-w-fit inline-flex items-center justify-between box-border whitespace-nowrap px-2 h-6 rounded-full bg-default text-default-foreground", + "relative max-w-fit inline-flex items-center justify-between box-border whitespace-nowrap px-2 rounded-full bg-default text-default-foreground", multiValueRemove: state => "ml-2", dropdownIndicator: state => "pr-2", - groupHeading: state => "relative mt-2 mb-1 pl-2 text-tiny text-foreground-500", + groupHeading: state => + "relative mt-2 mb-1 pl-2 text-tiny text-foreground-500", }} onChange={data => onChange(data.map(d => (d as any).value))} /> diff --git a/src/app/[locale]/(home)/page.tsx b/src/app/[locale]/(home)/page.tsx index e4bcd04..2111ec5 100644 --- a/src/app/[locale]/(home)/page.tsx +++ b/src/app/[locale]/(home)/page.tsx @@ -1,12 +1,14 @@ import { LandingPage } from "@/app/[locale]/(home)/landing-page"; import { Home } from "@/app/[locale]/(home)/home"; import { getCurrentUser } from "@/lib/session"; +import { getProviders } from "next-auth/react"; export default async function Page() { const user = await getCurrentUser(); + const providers = await getProviders(); if (!user) { - return ; + return ; } return ; diff --git a/src/app/[locale]/(home)/recent-matches.tsx b/src/app/[locale]/(home)/recent-matches.tsx index a754654..88af558 100644 --- a/src/app/[locale]/(home)/recent-matches.tsx +++ b/src/app/[locale]/(home)/recent-matches.tsx @@ -30,7 +30,7 @@ export function RecentMatches({ matches }: RecentMatchesProps) { {match.team1.name}{" "} - + {match.score1} {match.score2} diff --git a/src/app/[locale]/layout.tsx b/src/app/[locale]/layout.tsx index 1cbdddd..5f6f449 100644 --- a/src/app/[locale]/layout.tsx +++ b/src/app/[locale]/layout.tsx @@ -1,5 +1,7 @@ import { ReactNode } from "react"; import "@/styles/globals.css"; +import "slick-carousel/slick/slick.css"; +import "slick-carousel/slick/slick-theme.css"; import { Header } from "@/components/header"; import { Providers } from "@/app/[locale]/providers"; import { notFound } from "next/navigation"; diff --git a/src/app/[locale]/my/leagues/create/actions.ts b/src/app/[locale]/my/leagues/create/actions.ts index 9723c2e..fdf2101 100644 --- a/src/app/[locale]/my/leagues/create/actions.ts +++ b/src/app/[locale]/my/leagues/create/actions.ts @@ -25,7 +25,6 @@ export const createLeagueAction = createAuthenticatedServerAction( data.name, data.game, data.maxScorePerMatch, - data.allowDraws, data.ratingSystem, data.defaultRating, data.ratingSystemParameters, diff --git a/src/app/[locale]/my/leagues/create/form.tsx b/src/app/[locale]/my/leagues/create/form.tsx index 3240fcf..db86d9a 100644 --- a/src/app/[locale]/my/leagues/create/form.tsx +++ b/src/app/[locale]/my/leagues/create/form.tsx @@ -23,13 +23,13 @@ import { } from "@/lib/rating"; import { useServerActionState } from "@/hooks/use-server-action-state"; import { useTranslations } from "next-intl"; +import { GameIcon } from "@/components/game-icon"; export interface CreateLeagueFormValues { name: string; description: string; game: string; maxScorePerMatch: number; - allowDraws: boolean; ratingSystem: string; defaultRating: number; ratingSystemParameters: string; @@ -70,22 +70,10 @@ function CreateLeagueFormFields({ type="name" label={t("settings.descriptionLabel")} {...form.register("description")} + className="mb-0" /> - - ---{t("game.title")}
-- {t("game.description")} -
-- - +{ - onChange(e); - const game = games.find(game => game.id === e.target.value); - if (!game) { - return; - } - form.setValue( - "maxScorePerMatch", - game.defaults.maxScorePerMatch, - ); - form.setValue("allowDraws", game.defaults.allowDraws); - }} + onChange={onChange} + className="w-1/2" + startContent={ } > {games.map(game => ( {game.name} @@ -129,27 +108,12 @@ function CreateLeagueFormFields({ /> )} /> -( - - {t("game.allowDrawsLabel")} - - )} - />- +{t("rating.title")}
{t.rich("rating.description", { @@ -267,8 +231,6 @@ export function CreateLeagueForm() { name: "", description: "", game: defaultGame.id, - maxScorePerMatch: defaultGame.defaults.maxScorePerMatch, - allowDraws: defaultGame.defaults.allowDraws, defaultRating: 1000, ratingSystem: defaultRatingSystem, ratingSystemParameters: JSON.stringify( diff --git a/src/components/container.tsx b/src/components/container.tsx index 0720a97..5231e92 100644 --- a/src/components/container.tsx +++ b/src/components/container.tsx @@ -1,5 +1,5 @@ import { ReactNode } from "react"; export function Container({ children }: { children: ReactNode }) { - return
{children}; + return{children}; } diff --git a/src/components/header.tsx b/src/components/header.tsx index 171aeac..951ee7e 100644 --- a/src/components/header.tsx +++ b/src/components/header.tsx @@ -20,19 +20,12 @@ export async function Header() { const t = await getTranslations("layout"); return ( -+ Hilde @@ -45,18 +38,8 @@ export async function Header() {
- - {t("navigation.about")} - - -- - {t("navigation.blog")} - - -- - {t("navigation.donate")} + + {t("navigation.contact")} diff --git a/src/components/login-provider-icon.tsx b/src/components/login-provider-icon.tsx new file mode 100644 index 0000000..f9c5057 --- /dev/null +++ b/src/components/login-provider-icon.tsx @@ -0,0 +1,18 @@ +import { ClientSafeProvider } from "next-auth/react"; +import { FaDiscord, FaGithub } from "react-icons/fa"; + +interface LoginProviderIconProps { + id: ClientSafeProvider["id"]; + size?: number | string; +} + +export function LoginProviderIcon({ id, size }: LoginProviderIconProps) { + switch (id) { + case "github": + return; + case "discord": + return ; + } + + return null; +} diff --git a/src/db/model/league.ts b/src/db/model/league.ts index c7e7b2c..5a772e8 100644 --- a/src/db/model/league.ts +++ b/src/db/model/league.ts @@ -44,7 +44,6 @@ export async function createLeague( name: string, game: string, maxScorePerMatch: number, - allowDraws: boolean, ratingSystem: RatingSystem, defaultRating: number, ratingSystemParameters: Record ); - const { host } = new URL(url); const result = await transport.sendMail({ to: identifier, from: provider.from, - subject: `Sign in to ${host}`, + subject: `Sign in to Hilde`, html, }); const failed = result.rejected.concat(result.pending).filter(Boolean); @@ -42,9 +50,10 @@ export const authOptions: AuthOptions = { }, }), ], - // pages: { - // signIn: "/login", - // }, + pages: { + signIn: "/", + verifyRequest: "/?login=verify-request", + }, callbacks: { async jwt({ token }) { if (!token.email) { diff --git a/src/lib/games.ts b/src/lib/games.ts index e8dbeda..152ba19 100644 --- a/src/lib/games.ts +++ b/src/lib/games.ts @@ -11,10 +11,6 @@ export type Game = { id: string; name: string; - defaults: { - maxScorePerMatch: number; - allowDraws: boolean; - }; }; export const customGameId = "custom"; @@ -23,57 +19,29 @@ export const games: Game[] = [ { id: customGameId, name: "Custom", - defaults: { - maxScorePerMatch: 0, - allowDraws: true, - }, }, { id: "foosball", name: "Foosball", - defaults: { - maxScorePerMatch: 10, - allowDraws: false, - }, }, { id: "badminton", name: "Badminton", - defaults: { - maxScorePerMatch: 21, - allowDraws: false, - }, }, { id: "chess", name: "Chess", - defaults: { - maxScorePerMatch: 1, - allowDraws: true, - } }, { id: "pool", name: "Pool", - defaults: { - maxScorePerMatch: 1, - allowDraws: false, - } }, { id: "table-tennis", name: "Table Tennis", - defaults: { - maxScorePerMatch: 7, - allowDraws: false, - } }, { id: "sixty-six", name: "Sixty-Six (Schnapsen)", - defaults: { - maxScorePerMatch: 7, - allowDraws: false, - } }, ]; diff --git a/src/middleware.ts b/src/middleware.ts index 4e1c276..1add463 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -4,7 +4,7 @@ import { withAuth } from "next-auth/middleware"; import { NextRequestWithAuth } from "next-auth/src/next/middleware"; import { NextRequest } from "next/server"; -const publicPages = ["/", "/blog", "/blog/(.*)", "/about", "/login"]; +const publicPages = ["/", "/blog", "/blog/(.*)", "/about", "/login", "/faq"]; const intlMiddleware = createMiddleware({ locales, diff --git a/src/styles/globals.css b/src/styles/globals.css index b5c61c9..814e66d 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -1,3 +1,7 @@ @tailwind base; @tailwind components; @tailwind utilities; + +.hilde { + @apply bg-gradient-to-r from-[#3DA693] to-[#C6DB6D] bg-clip-text inline-block text-transparent; +}
+