1
Fork 0
mirror of https://github.com/Steffo99/festa.git synced 2024-12-23 07:04:22 +00:00
festa/components/Intro.tsx

50 lines
1.3 KiB
TypeScript
Raw Normal View History

2022-05-25 15:50:31 +00:00
import { Trans, useTranslation } from "next-i18next"
import { LoginContext } from "../contexts/login"
2022-05-27 00:46:30 +00:00
import { useDefinedContext } from "../utils/definedContext"
import { InputSlug } from "./InputEventSlug"
2022-05-25 15:50:31 +00:00
import { LoginButton } from "./LoginButton"
2022-05-27 00:46:30 +00:00
import { LogoutLink } from "./LogoutLink"
import { TelegramUser } from "./TelegramUser"
2022-05-25 15:50:31 +00:00
export function Intro() {
const {t} = useTranslation("common")
2022-05-27 00:46:30 +00:00
const [login, _] = useDefinedContext(LoginContext)
2022-05-25 15:50:31 +00:00
2022-05-27 00:46:30 +00:00
const loginMessage = login ? <>
2022-05-25 15:50:31 +00:00
<Trans i18nKey="introTelegramLoggedIn">
2022-05-27 00:46:30 +00:00
introTelegramLoggedIn(1: <TelegramUser u={login}/>)
2022-05-25 15:50:31 +00:00
</Trans>
2022-05-27 00:46:30 +00:00
<br/>
<LogoutLink/>
</> : <>
{t("introTelegramLogin")}
</>
2022-05-25 15:50:31 +00:00
2022-05-27 00:46:30 +00:00
const input = login ? <>
2022-05-25 15:50:31 +00:00
<p>
2022-05-27 00:46:30 +00:00
{t("introCreateEvent")}
2022-05-25 15:50:31 +00:00
</p>
2022-05-27 00:46:30 +00:00
<form>
{window.location.protocol}//
{window.location.host}/events/
<InputSlug
placeholder={t("introCreateEventSlugPlaceholder")}
/>
<button aria-label="Continue" className="input-square input-positive">
</button>
</form>
</> : <>
2022-05-25 15:50:31 +00:00
<LoginButton
botName="festaappbot"
/>
</>
2022-05-27 00:46:30 +00:00
return <>
<p>
{loginMessage}
</p>
{input}
</>
2022-05-25 15:50:31 +00:00
}