feat: invite code

This commit is contained in:
2025-03-05 18:38:56 +03:00
parent be666c5158
commit 6cc61dbf08
7 changed files with 140 additions and 47 deletions

View File

@@ -1,16 +1,18 @@
import { UserSchema } from "../../../../client";
import { UserSchema, UserService } from "../../../../client";
import { BaseTable } from "../../../../components/BaseTable/BaseTable.tsx";
import { ActionIcon, Button, Flex, rem, Text, Tooltip } from "@mantine/core";
import { ActionIcon, Badge, Button, Flex, Input, rem, Text, Tooltip } from "@mantine/core";
import { useUsersTableColumns } from "./columns.tsx";
import { IconEdit, IconQrcode, IconTrash } from "@tabler/icons-react";
import { modals } from "@mantine/modals";
import { MRT_TableOptions } from "mantine-react-table";
import { useUsersTabContext } from "../../tabs/Users/contexts/UsersTabContext.tsx";
import { notifications } from "../../../../shared/lib/notifications.ts";
import { useClipboard } from "@mantine/hooks";
const UsersTable = () => {
const columns = useUsersTableColumns();
const clipboard = useClipboard();
const {
usersCrud: {
items,
@@ -71,6 +73,33 @@ const UsersTable = () => {
if (!pdfWindow) return;
pdfWindow.print();
};
const onCreateInviteCodeClick = async () => {
const { inviteCode, ok, message } = await UserService.generateInviteCode();
if (!ok || !inviteCode) {
notifications.error({ message });
return;
}
modals.openConfirmModal({
withCloseButton: false,
children: (
<Flex gap={rem(10)} direction={"column"} justify={"center"} align={"center"}>
<Text>
Ваш код приглашения!
</Text>
<Badge variant={"default"} style={{cursor:"text"}} radius={"sm"} size={"xl"}>{inviteCode}</Badge>
<Input.Description>
Код действителен в течении 30 минут
</Input.Description>
</Flex>
),
labels: { confirm: "Скопировать", cancel: "Закрыть" },
onConfirm: () => {
clipboard.copy(inviteCode);
},
});
};
return (
<BaseTable
data={items}
@@ -82,11 +111,20 @@ const UsersTable = () => {
enableTopToolbar: true,
renderTopToolbar: (
<Flex p={rem(10)}>
<Button
variant={"default"}
onClick={() => onCreateClick()}>
Создать пользователя
</Button>
<Flex gap={rem(10)}>
<Button
variant={"default"}
onClick={() => onCreateClick()}>
Создать пользователя
</Button>
<Button
onClick={() => onCreateInviteCodeClick()}
variant={"default"}
>
Создать код приглашения
</Button>
</Flex>
</Flex>
),
enableRowActions: true,

View File

@@ -1,20 +1,20 @@
import { Button, Container, Paper, Title } from "@mantine/core";
import { Button, Checkbox, Container, Paper, Stack, TextInput, Title } from "@mantine/core";
import classes from "./LoginPage.module.scss";
import { RootState, useAppDispatch } from "../../redux/store.ts";
import { AuthService } from "../../client";
import TelegramLoginButton, {
TelegramUser,
} from "../../components/TelegramAuthButton/TelegramAuthButton.tsx";
import { ApiError, AuthService } from "../../client";
import TelegramLoginButton, { TelegramUser } from "../../components/TelegramAuthButton/TelegramAuthButton.tsx";
import { notifications } from "../../shared/lib/notifications.ts";
import { login } from "../../features/authSlice.ts";
import { Navigate, useNavigate } from "@tanstack/react-router";
import { useSelector } from "react-redux";
import { useEffect } from "react";
import { useEffect, useState } from "react";
const LoginPage = () => {
const dispatch = useAppDispatch();
const authState = useSelector((state: RootState) => state.auth);
const navigate = useNavigate();
const [hasInviteCode, setHasInviteCode] = useState(false);
const [inviteCode, setInviteCode] = useState("");
useEffect(() => {
if (authState.isAuthorized)
// ???????????
@@ -45,38 +45,55 @@ const LoginPage = () => {
radius="md">
<TelegramLoginButton
botName={"DencoFulfillmentTestBot"}
dataOnauth={() => {}}
dataOnauth={() => {
}}
wrapperProps={{ style: { display: "none" } }}
/>
<Button
fullWidth
onClick={() => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-expect-error
window.Telegram.Login.auth(
{
bot_id: import.meta.env.VITE_BOT_ID,
request_access: true,
},
(data: TelegramUser) => {
AuthService.loginAuthLoginPost({
requestBody: data,
})
.then(({ accessToken }) => {
dispatch(
login({ accessToken: accessToken })
);
<Stack>
<Button
fullWidth
onClick={() => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-expect-error
window.Telegram.Login.auth(
{
bot_id: import.meta.env.VITE_BOT_ID,
request_access: true,
},
(data: TelegramUser) => {
AuthService.loginAuthLoginPost({
requestBody: {...data, invite_code: inviteCode.trim() ? inviteCode : undefined},
})
.catch(() => {
notifications.error({
message: "Неудалось войти!",
.then(({ accessToken }) => {
dispatch(
login({ accessToken: accessToken }),
);
})
.catch((reason: ApiError) => {
const message = reason?.body?.detail.toString() || "Ошибка авторизации";
notifications.error({
message,
});
});
});
}
);
}}>
Войти через Telegram
</Button>
},
);
}}>
Войти через Telegram
</Button>
{!hasInviteCode ? (
<Checkbox label={"У меня есть код подключения"} checked={hasInviteCode}
onChange={event => setHasInviteCode(event.target.checked)} />) : (
<TextInput
value={inviteCode}
onChange={event => setInviteCode(event.currentTarget.value)}
placeholder={"Введите код подключения"}
/>
)}
</Stack>
</Paper>
</Container>
);