@@ -181,3 +181,11 @@ letter-spacing: -1%; } } + +.card_blocked { + user-select: none; +} + +.card_selectable { + user-select: auto !important; +} @@ -179,3 +179,11 @@ letter-spacing: -1%; } } + +.card_blocked { + user-select: none; +} + +.card_selectable { + user-select: auto !important; +} @@ -25,8 +25,7 @@ export function ChatModelCard({ description, image, title, slug, accessed_models

@@ -25,8 +25,7 @@ export function ImageModelCard({ description, image, title, slug, accessed_model

@@ -23,7 +23,7 @@ export function VideoModelCard({ description, image, title, slug, accessed_model return ( -

@@ -1,17 +0,0 @@ -import { api } from '#/shared/api' - -import { IUserSetting } from '../model/types' - -export const addUserSettings = async ( - token: string, - setting: Omit -): Promise => { - try { - const { data } = await api.post('/api/users/settings/', setting, { - headers: { Authorization: `Bearer ${token}` }, - }) - return data - } catch (err) { - return null - } -} @@ -2,7 +2,7 @@ import axios, { AxiosResponse } from 'axios' import { getApiUrl } from '#/shared/lib/constants' -import { AccountType } from '../model/types' +import { AccountType } from '../model/account.types' export const getAccountType = async (token: string | null | undefined): Promise => { if (!token) { return 'regular' @@ -1,14 +0,0 @@ -import { api } from '#/shared/api' - -import { IUserSetting } from '../model/types' - -export const getUserSettings = async (token: string): Promise => { - try { - const { data } = await api.get('/api/users/settings/', { - headers: { Authorization: `Bearer ${token}` }, - }) - return data - } catch (err) { - return [] - } -} @@ -1 +0,0 @@ -export * from './settings.routes' \ No newline at end of file @@ -1,15 +0,0 @@ -import { api } from '#/shared/api' -import { Agent } from 'https' -import { IUserSetting } from '../model/types' - -export function getUserSettings() { - return api.get('/api/users/settings/') -} - -export function postUserSettings(option: Omit) { - return api.post('/api/users/settings/', option) -} - -export function updateUserSettings(id: string, value: any) { - return api.put(`/api/users/settings/${id}`, { value }) -} @@ -1,20 +0,0 @@ -import { api } from '#/shared/api' - -import { getUpdatedSettingsLocal } from '../lib/helpers/update-setting-local' -import { IUserSetting, SettingValueType } from '../model/types' - -export const updateUserSettings = async ( - token: string, - id: string, - value: SettingValueType, - settings: IUserSetting[] -) => { - try { - await api.put(`/api/users/settings/${id}`, { value }, { - headers: { Authorization: `Bearer ${token}` }, - }) - return getUpdatedSettingsLocal({ settings, id, value }) - } catch (err) { - return null - } -} @@ -1,23 +0,0 @@ -import { Device } from '#/shared/lib/types/entities' - -import { IUserSetting, SettingType } from '../../model/types' - -interface IProps { - settings: Omit | null - targetType: SettingType - targetDevice: Device -} - -export function isSettingExist({ settings, targetDevice, targetType }: IProps): IUserSetting | null { - if (!settings || settings.length === 0) { - return null - } - - for (let i = 0; i < settings.length; i++) { - if (settings[i].type === targetType && settings[i].device === targetDevice) { - return settings[i] - } - } - - return null -} @@ -1,22 +0,0 @@ -import { IUserSetting, SettingValueType } from '../../model/types' - -interface IProps { - settings: IUserSetting[] - id: string - value: SettingValueType -} - -export function getUpdatedSettingsLocal({ settings, id, value }: IProps): IUserSetting[] { - if (settings.length === 0) { - return settings - } - - return settings.map((setting) => - setting.id === id - ? { - ...setting, - value, - } - : setting - ) -} @@ -0,0 +1,2 @@ +export type AccountType = 'regular' | 'business_host' | 'business_account' + @@ -1,2 +1 @@ -export * from './settings-context' -export * from './use-global-settings' \ No newline at end of file +export {} \ No newline at end of file @@ -1,9 +0,0 @@ -import { createUseContext } from '#/shared' -import { createContext } from 'react' -import { useGlobalSettings } from './use-global-settings' - -export const UserSettingsContext = createContext | null>(null) - -export const useUserSettingsContext = createUseContext(UserSettingsContext) - -export const UserSettingsContextProvider = UserSettingsContext.Provider @@ -1,93 +0,0 @@ -import { createAsyncThunk, createSlice } from '@reduxjs/toolkit' - -import { addUserSettings } from '../api/add-user-settings' -import { getUserSettings } from '../api/get-user-settings' -import { updateUserSettings } from '../api/update-user-settings' -import { getUpdatedSettingsLocal } from '../lib/helpers/update-setting-local' - -import { IUserSetting, SettingValueType } from './types' -import { useLocalStorageSave } from '#/shared/lib/helpers/local-storage-helper' - -interface IAddSettings { - token: string | undefined | null - setting: Omit -} - -export const getUserAccountSettings = createAsyncThunk( - 'users/getSettings', - async (token: string | undefined | null) => { - if (!token) { - return initialState.state - } - return await getUserSettings(token) - } -) - -export const addUserAccountSettings = createAsyncThunk( - 'users/addSettings', - async ({ token, setting }: IAddSettings) => { - if (!token) { - return - } - return await addUserSettings(token, setting) - } -) - -export const updateUserAccountSettings = createAsyncThunk( - 'users/updateSettings', - async ({ - token, - id, - value, - settings, - }: { - token: string | undefined | null - id: string - value: SettingValueType - settings: IUserSetting[] | null - }) => { - if (!token) { - return initialState.state - } - if (!settings) { - return initialState.state - } - return await updateUserSettings(token, id, value, settings) - } -) - -const initialState: { state: IUserSetting[] | null } = { - state: null, -} - -export const settingsSlice = createSlice({ - name: 'balance', - initialState, - reducers: { - setSettings: (state, action) => { - state.state = action.payload - }, - }, - extraReducers: (builder) => { - builder.addCase(getUserAccountSettings.fulfilled, (state, action) => { - state.state = action.payload - localStorage.setItem('global_settings', JSON.stringify(action.payload)) - }) - builder.addCase(addUserAccountSettings.fulfilled, (state, action) => { - if (state.state === null) state.state = [] - if (action.payload) { - state.state = [...state.state, action.payload] - localStorage.setItem('global_settings', JSON.stringify([...state.state, action.payload])) - } - }) - - builder.addCase(updateUserAccountSettings.fulfilled, (state, action) => { - if (action.payload) { - state.state = action.payload - localStorage.setItem('global_settings', JSON.stringify(action.payload)) - } - }) - }, -}) - -export const { setSettings } = settingsSlice.actions @@ -1,16 +0,0 @@ -import { Device } from '#/shared/lib/types/entities' - -export type AccountType = 'regular' | 'business_host' | 'business_account' - -export type SettingType = 'sidemenu' | string - -export type SettingValueType = { - sidemenu_state?: 'opened' | 'closed' -} - -export interface IUserSetting { - id: string - device: Device - type: SettingType - value: SettingValueType | any -} @@ -1,66 +0,0 @@ -import { useLocalStorage } from 'usehooks-ts' -import { IUserSetting } from './types' -import { makePrivateRequest } from '#/shared/api' -import { getUserSettings, postUserSettings, updateUserSettings } from '../api' - -import { getDeviceType } from '#/shared' -import { useCallback, useEffect, useRef, useState } from 'react' -import { useSession } from 'next-auth/react' -import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' - -export function useGlobalSettings() { - const [settings, setSettings] = useLocalStorage('global_settings', []) - - const { showMessage } = useShowDataStore() - - const device = getDeviceType() - - const { data } = useSession() - - const addSettings = makePrivateRequest(async (type: string, value: any) => { - const { status, data } = await postUserSettings({ device, type, value }) - - if (status !== 200) return showMessage('Ошибка создания настроек') - - setSettings((s) => [...s, data]) - }) - - const updateSettings = useCallback( - makePrivateRequest(async (type: string, value: any) => { - const option = settings.find((x) => x.type === type) - - if (!option) return showMessage('Ошибка присвоения настроек') - - const { status } = await updateUserSettings(option.id, value) - - if (status !== 204) return showMessage('Ошибка создания настроек') - - setSettings((s) => [...s.filter((x) => x.type !== type), { ...option, value }]) - }), - [settings, data] - ) - - const fetchUserSettings = makePrivateRequest(async () => { - const { status, data } = await getUserSettings() - - const device = getDeviceType() - - if (status !== 200) return showMessage('Ошибка загрузки данных пользователя') - - setSettings(data.filter((s) => s.device === device)) - }) - - const getOptionValue = (type: string, initial: any) => { - const option = settings.find((o) => o.type === type) - return option ? option.value : initial - } - - return { - settings, - setSettings, - addSettings, - fetchUserSettings, - updateSettings, - getOptionValue, - } -} @@ -77,7 +77,7 @@ export const LimitModal: React.FC = ({ }} > - Сотрудник {person?.email} + Сотрудник {person?.email} @@ -79,10 +79,10 @@ export const BusinessErrorReportPlate = () => { onChange={handleFileChange} type='file' accept='.jpg,.jpeg,.png' - style={{ display: 'none' }} + className={styles.fileInputHidden} id='business-error-report-file-input' /> - + @@ -120,6 +120,14 @@ } } +.fileInputHidden { + display: none; +} + +.fileInputLabel { + cursor: pointer; +} + .textarea { &__file { background: rgba(255, 255, 255, 0.06); @@ -40,10 +40,10 @@ export const ErrorReportPlate = () => { onChange={handleFileChange} type='file' accept='.jpg,.jpeg,.png' - style={{ display: 'none' }} + className={styles.fileInputHidden} id='file-input' /> - + @@ -1,5 +1,4 @@ -import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react' -import { ImageWithState } from './types' +import { Dispatch, SetStateAction, useEffect, useMemo } from 'react' import { Message } from '#/entities/message' export const useImagesLibrary = ( @@ -7,8 +6,6 @@ export const useImagesLibrary = ( current: string | null, images: Message[] ) => { - const [initialCount, setInitialCount] = useState(0) - const esc = (e: KeyboardEvent) => { if (e.key === 'Escape') { e.preventDefault() @@ -18,7 +15,7 @@ export const useImagesLibrary = ( const currentIndex = useMemo( () => images.findIndex((item) => item.file === current), - [current] + [current, images] ) useEffect(() => { @@ -27,8 +24,6 @@ export const useImagesLibrary = ( }, []) return { - initialCount, - setInitialCount, - currentIndex, + currentIndex, } } @@ -1,7 +1,5 @@ -import { debounce } from 'lodash' -import { useCallback, useEffect, useState } from 'react' +import { useEffect, useState } from 'react' import { Swiper as SwiperCore } from 'swiper' -import { ImageWithState } from './types' export const useLibrarySwiper = (onSlideFalse: ((...args: any) => any) | undefined, reverse: boolean) => { const [swiper, setSwiper] = useState(null) @@ -41,10 +39,6 @@ export const useLibrarySwiper = (onSlideFalse: ((...args: any) => any) | undefin } }, [swiper]) - // useEffect(() => { - // swiper?.slideTo(currentImageIndex || 0) - // }, [currentImageIndex]) - return { swiper, setSwiper, @@ -0,0 +1,21 @@ +.overlay { + position: fixed; + z-index: 1201; + inset: 0; + width: 100%; + height: 100%; + display: none; +} + +.overlayVisible { + display: block; +} + +.backdrop { + position: absolute; + z-index: 101; + width: 100%; + height: 100%; + background-color: #000000; + opacity: 0.9; +} @@ -1,16 +1,15 @@ -import React, { Dispatch, SetStateAction, useEffect, useMemo, useRef, useState } from 'react' -import Image from 'next/image' +import { Dispatch, SetStateAction, useEffect, useRef } from 'react' +import overlayStyles from './full-screen-modal-overlay.module.scss' import styles from './modal-styles.module.scss' import { ArrowDropDown } from '@mui/icons-material' -import { c, Loader, TooltipCustom } from '#/shared' +import { c } from '#/shared' import { useImagesLibrary } from '../model' import { Swiper, SwiperSlide } from 'swiper/react' import 'swiper/css' import { useLibrarySwiper } from '../model/use-swiper' -import { ImageIcons, useImageIcons } from '#/widgets/messages' -import { Typography } from '@mui/material' +import { useImageIcons } from '#/widgets/messages' import { ModalImage } from './modal-image' import { Message } from '#/entities/message' @@ -32,55 +31,63 @@ export default function FullScreenModal({ onSlideFalse, reverse = false, }: IProps) { - const { initialCount, setInitialCount, currentIndex } = useImagesLibrary( + const { currentIndex } = useImagesLibrary( setModal, current, images ) - const count = useRef(0) + const prevImagesLengthRef = useRef(0) const { swiper, setSwiper, slideNext, slidePrev } = useLibrarySwiper(onSlideFalse, reverse) const { downloadFile } = useImageIcons() + useEffect(() => { - // debugger - if (reverse) - setTimeout(() => { - swiper?.slideNext() - count.current = images.length - }, 400) - else - setTimeout(() => { - swiper?.slideTo(images.length - count.current - 1) - count.current = images.length - }, 400) - }, [images]) + if (!modal) { + prevImagesLengthRef.current = 0 + return + } + if (!swiper) return + + const len = images.length + const prevLen = prevImagesLengthRef.current + + if (prevLen === 0) { + prevImagesLengthRef.current = len + return + } + + if (len === prevLen) return + + if (len < prevLen) { + prevImagesLengthRef.current = len + return + } + + const delta = len - prevLen + + const id = window.setTimeout(() => { + if (reverse) { + swiper.update() + } else { + const nextIndex = swiper.activeIndex + delta + const clamped = Math.max(0, Math.min(nextIndex, len - 1)) + swiper.slideTo(clamped, 0) + } + prevImagesLengthRef.current = len + }, 0) + + return () => clearTimeout(id) + }, [modal, images.length, reverse, swiper]) return (

setModal(false)} > -

setModal(false)}>

{!desktop && (

showPassword((x) => !x)} - style={{ - cursor: 'pointer', - display: 'flex', - alignItems: 'center', - }} - > +

showPassword((x) => !x)} className={styles.passwordToggle}> {passwordShowed ? ( ) : ( @@ -191,21 +186,13 @@ export const RegisterEmailForm: React.FC = ({ successLo {loading ? ( - + ) : ( )} -

Регистрируясь, вы соглашаетесь с условиями - + Политики обработки персональных данных и - + Публичной офертой

@@ -245,13 +232,7 @@ export const RegisterEmailForm: React.FC = ({ successLo }} > Есть аккаунт?{' '} - + Войти @@ -10,3 +10,13 @@ } } } + +.titleActions { + display: flex; + align-items: center; + gap: 20px; +} + +.titleActionsInner { + width: 100%; +} @@ -26,8 +26,8 @@ export default function Title(props: TitleProps) { {props.title} -

{props.rightSlot}

@@ -0,0 +1,3 @@ +.tutorialIcon { + cursor: pointer; +} @@ -7,6 +7,8 @@ import { options, steps } from '../lib/constants' import TooltipMy from './tooltip' +import styles from './tutorial.module.scss' + export const Tutorial = () => { const [enabled, setEnabled] = React.useState(false) @@ -18,7 +20,7 @@ export const Tutorial = () => { return ( <> setEnabled(true)}> - {''}

{ - const [hovered, setHovered] = useState(false) - return ( ) @@ -29,7 +29,7 @@ export default function Document() {

@@ -1,3 +1,7 @@ +.clickableIcon { + cursor: pointer; +} + .wrap { width: 85%; @@ -0,0 +1,3 @@ +.fileInputHidden { + display: none; +} @@ -9,6 +9,8 @@ import Image from 'next/image' import { Calculation } from '#/features/calculation-tokens-gpt' import { styleInputWithoutBorderFocus } from '#/shared/ui/input' +import styles from './input-images-models.module.scss' + interface Input { loading: boolean requestImage: () => void @@ -60,7 +62,7 @@ export const InputImagesModels: FC = ({ { {...props} InputProps={{ endAdornment: ( -

), }} /> @@ -0,0 +1,3 @@ +.sliderFullWidth { + width: 100%; +} @@ -4,6 +4,8 @@ import Box from '@mui/material/Box' import { PrettoSliderDark } from '#/widgets/filters-gpt/ui/filters' +import styles from './slider.module.scss' + export const Slider = ({ value, title, @@ -41,7 +43,7 @@ export const Slider = ({ { width?: string | number height?: string | number @@ -26,7 +28,13 @@ export function SvgIcon({ url, color, width, height, ...props }: SvgIconProps) { return (

= ({ className, maxWidth, stopClickPropagation = true, + wrapperWidth, fullWidthTrigger = false, tapToOpenOnMobile = false, }) => { @@ -43,8 +49,8 @@ export const TooltipCustom: React.FC = ({ const tapMode = Boolean(tapToOpenOnMobile && isTouchPrimary) const [tapOpen, setTapOpen] = useState(false) - const triggerSpanStyle: React.CSSProperties | undefined = fullWidthTrigger - ? { display: 'flex', width: '100%', minWidth: 0 } + const triggerSpanStyle: React.CSSProperties | undefined = wrapperWidth + ? { display: 'block', width: wrapperWidth, maxWidth: '100%', minWidth: 0 } : undefined const tooltip = ( @@ -87,6 +93,7 @@ export const TooltipCustom: React.FC = ({ placement={placement} > void @@ -46,21 +48,11 @@ export const CheckBoxAgreeWithRules: React.FC = ({ > {' '} Я соглашаюсь с условиями{' '} - + Политики обработки персональных данных {' '} и{' '} - + Публичной офертой @@ -0,0 +1,13 @@ +.errorIcon { + margin-top: 2.5px; +} + +.errorSnackbar { + z-index: 100000; + max-width: 335px; +} + +.errorSnackbarDesktop { + z-index: 100000; + max-width: 500px; +} @@ -7,12 +7,14 @@ import { CSSTransition } from 'react-transition-group' import { useShowDataStore } from '../lib/hooks/use-show-data' import SuccessSvg from '#/assets/svg/success.svg?react' +import styles from './error.module.scss' + export interface IError { handleClose?: () => void } const ErrorIcon = () => { - return {''}

+ return

} export const Error: React.FC = ({ handleClose }) => { @@ -23,10 +25,7 @@ export const Error: React.FC = ({ handleClose }) => { return ( ) => void @@ -43,9 +45,7 @@ export const SelectUI: React.FC = ({ }, }, }} - style={{ - backgroundColor: 'transparent', - }} + className={styles.selectTransparent} sx={{ boxShadow: 'none', borderRadius: '13px', @@ -0,0 +1,6 @@ +.freeTokensAlert { + background: linear-gradient(91.87deg, #7f7df3 0%, #d372a1 95.23%); + color: white; + border-radius: 10px; + padding: 7px 16px; +} @@ -3,6 +3,8 @@ import CloseIcon from '@mui/icons-material/Close' import { Alert, Collapse, IconButton } from '@mui/material' import Link from 'next/link' +import styles from './tooltip-free-tokens.module.scss' + export const TooltipFreeTokens = () => { const [open, setOpen] = React.useState(() => { if (typeof window !== 'undefined') { @@ -39,12 +41,7 @@ export const TooltipFreeTokens = () => { { alignItems='flex-start' spacing={2} sx={{ - width: desktop ? '90%' : '100%', + width: desktop ? (scope === 'referral' ? '97%' : '90%') : '100%', height: '100%', }} > @@ -323,7 +325,7 @@ const Account: NextPageWithLayout = () => { @@ -457,7 +459,7 @@ const Account: NextPageWithLayout = () => { onClick={changePassword} sx={{ marginTop: '20px' }} text={'Изменить пароль'} - style={{ width: '150px' }} + className={accountStyles.changePasswordButton} /> @@ -470,11 +472,7 @@ const Account: NextPageWithLayout = () => { onClick={() => setConfirmDeleteModal(true)} sx={{ marginTop: '20px' }} text={'Удалить аккаунт'} - style={{ - width: '100%', - backgroundColor: 'rgba(255, 35, 114, 0.10)', - color: '#FF2372', - }} + className={accountStyles.deleteAccountButton} /> @@ -4,6 +4,7 @@ import Image from 'next/image' import { useSession } from 'next-auth/react' import { TooltipCustom } from '#/shared' +import styles from '#/shared/styles/api-keys.module.scss' import { getApiUrl } from '#/shared/lib/constants' import { InputStyleSmallDark } from '#/shared/ui/input' import axios from 'axios' @@ -127,7 +128,7 @@ export const CopyButton: React.FC<{ src={'/svg/copy.svg'} width={20} height={20} - style={{ cursor: 'pointer' }} + className={styles.clickableIcon} alt={'copy'} /> @@ -166,7 +166,7 @@ const KeyRow: React.FC = ({ id, name, keyValue, limit, createdAt, e onDelete(name)} - style={{ cursor: 'pointer' }} + className={styles.clickableIcon} src='/svg/main_menu/trash.svg' width={20} height={20} @@ -120,7 +120,7 @@ const KeyCard: React.FC = ({ id, name, keyValue, limit, createdAt, onDelete(name)} - style={{ cursor: 'pointer' }} + className={styles.clickableIcon} src='/svg/main_menu/trash.svg' width={20} height={20} @@ -16,6 +16,23 @@ } } +.loaderCenter { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + +.messagesWrap { + position: relative; + border-radius: 13px; +} + +.scrollAnchor { + position: absolute; + top: 300px; +} + .staticTabsWrapper { display: flex; align-items: center; @@ -264,18 +264,11 @@ const AudioModelPage: NextPageWithLayout = () => { ) : (

{ className={'smallScroll'} > -

setPrompt(content)} /> @@ -0,0 +1,17 @@ +.closeLink { + position: absolute; + top: 45px; + right: 7%; + cursor: pointer; + font-size: 17px; +} + +.linkAccent { + color: #7f7df3; + font-size: 17px; + text-decoration: none; +} + +.submitButton { + margin-top: 18px; +} @@ -9,6 +9,8 @@ import { getApiUrl } from '#/shared/lib/constants' import { getDeviceType, getRandomImage } from '#/shared/lib/helpers' import { NextPageWithLayout } from '#/pages/_app' +import styles from './change-password.module.scss' + const ChangePassword: NextPageWithLayout = () => { const device = getDeviceType() @@ -90,16 +92,7 @@ const ChangePassword: NextPageWithLayout = () => { backgroundColor: '#373737', }} > - + {''}

{desktop && ( @@ -161,7 +154,7 @@ const ChangePassword: NextPageWithLayout = () => { > Ваш пароль успешно изменён! - + Войти в аккаунт @@ -251,9 +244,7 @@ const ChangePassword: NextPageWithLayout = () => { ) : ( - + { marginTop: '15px', }} > - + Зарегистрироваться @@ -343,7 +319,7 @@ const Login: NextPageWithLayout = () => { }} >

{ alt={''} width={900} height={1002} - style={{ - borderRadius: '20px', - position: 'relative', - zIndex: 1000, - bottom: -260, - right: -390, - border: '10px solid rgba(255, 255, 255, 0.30)', - transform: 'rotate(-13deg)', - }} + className={styles.promoDashboardImage} /> )} @@ -3,23 +3,38 @@ import { useDispatch } from 'react-redux' import { Box } from '@mui/material' import CircularProgress from '@mui/material/CircularProgress' import { useRouter } from 'next/router' +import { useSession } from 'next-auth/react' import { addReferral } from '#/entities/user-account/model/user-type-slice' import { NextPageWithLayout } from '#/pages/_app' +import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' export interface ReferralRegisterProps { email: string } +const REFERRAL_BLOCKED_MESSAGE = + 'Вы не можете повторно зарегистрироваться по реферальной ссылке или стать рефералом после регистрации.' + const ReferralRegister: NextPageWithLayout = ({ email }) => { const dispatch = useDispatch() - const { push } = useRouter() + const { push, replace } = useRouter() + const { status } = useSession() + const { showMessage } = useShowDataStore() useEffect(() => { + if (status === 'loading') return + + if (status === 'authenticated') { + showMessage(REFERRAL_BLOCKED_MESSAGE, 'error') + replace('/') + return + } + localStorage.setItem('referral', email) dispatch(addReferral(email)) push('/register') - }, []) + }, [status, email, dispatch, push, replace, showMessage]) return ( @@ -8,4 +8,24 @@ @media screen and (max-width: 1000px) { width: 100%; } +} + +.logoMobile { + margin-top: 20px; +} + +.imageboxLogo { + position: absolute; + top: 35px; + left: 35px; +} + +.promoDashboardImage { + border-radius: 20px; + position: relative; + z-index: 1000; + bottom: -260px; + right: -390px; + border: 10px solid rgba(255, 255, 255, 0.3); + transform: rotate(-13deg); } \ No newline at end of file @@ -1,5 +1,6 @@ import * as React from 'react' import { useEffect, useState } from 'react' +import { useCookies } from 'react-cookie' import { useDispatch } from 'react-redux' import Box from '@mui/material/Box' import Stack from '@mui/material/Stack' @@ -27,7 +28,12 @@ const Register: NextPageWithLayout = () => { const referral = useAppSelector((state) => state.user.referral) const dispatch = useDispatch() - const { push } = useRouter() + const { query, push } = useRouter() + const [, setCookie] = useCookies() + + React.useEffect(() => { + Object.entries(query).forEach(([key, value]) => setCookie(key, value)) + }, [query]) const onSuccessRegister = () => { setSuccess(true) @@ -57,7 +63,7 @@ const Register: NextPageWithLayout = () => { > {!desktop && (

{ }} >

@@ -56,7 +56,7 @@ export const CurrentPlanAndBalance = ({ return ( - + { ) : (

{ className={'smallScroll'} > -

Ваш браузер не поддерживает аудио. @@ -145,3 +145,11 @@ border-color: #827fff; } } + +.iconBlock { + display: block; +} + +.selectTransparent { + background-color: transparent; +} @@ -438,10 +438,10 @@ export function VoiceCloneSelect({ width={18} height={14} alt='' - style={{ display: 'block' }} + className={styles.iconBlock} /> ) : ( - + )} - + ) : null} @@ -567,9 +567,7 @@ export function VoiceCloneSelect({ ) }} MenuProps={VOICE_SELECT_MENU_PROPS} - style={{ - backgroundColor: 'transparent', - }} + className={styles.selectTransparent} sx={selectSx} fullWidth > @@ -16,6 +16,35 @@ } } +.loaderCenter { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + +.messagesWrap { + position: relative; + border-radius: 13px; +} + +.messagesWrap_compact { + flex: 1; + display: flex; + flex-direction: column; + min-height: 0; +} + +.scrollAnchor { + position: absolute; + top: 300px; +} + +.tabsFullWidth { + display: block; + width: 100%; +} + .staticTabsWrapper { display: flex; align-items: center; @@ -249,7 +249,7 @@ const VoiceCloningModelPage: NextPageWithLayout = () => {

{desktop && ( - + )} @@ -257,7 +257,7 @@ const VoiceCloningModelPage: NextPageWithLayout = () => { {!desktop && ( - + @@ -339,14 +339,7 @@ const VoiceCloningModelPage: NextPageWithLayout = () => { generationsInitialLoading && scope === 'playground' && styles.container_active )} > -

@@ -399,25 +392,12 @@ const VoiceCloningModelPage: NextPageWithLayout = () => { generationsInitialLoading && scope === 'playground' && styles.container_active )} > -

{ className={'smallScroll'} > -

{hasGenerations ? ( = ({ deleteContextMessage(message.uid)} sx={{ width: 'fit-content' }}> @@ -26,3 +26,8 @@ font-weight: 600; } } + +.tourAnchor { + position: relative; + z-index: 10; +} @@ -130,7 +130,7 @@ function Chat({ loading={loading} /> -

void @@ -220,7 +222,7 @@ export const Filters: React.FC = memo(

{Number(actual_stat.tokens_cost)} @@ -10,6 +10,7 @@ .loaderBar { position: relative; width: 100%; + height: var(--loader-height, 24px); background: linear-gradient(90deg, #e0e0e0 0%, #f5f5f5 100%); border-radius: 50px; overflow: hidden; @@ -17,6 +18,7 @@ } .progressFill { + width: var(--progress-width, 0%); height: 100%; border-radius: 50px; background-size: 200% 100%; @@ -19,13 +19,13 @@ const LineLoader: React.FC = ({ return (

{/* {normalizedProgress > 0 && ( @@ -0,0 +1,4 @@ +.requisitesLink { + margin-top: 10px; + margin-left: 20px; +} @@ -14,6 +14,8 @@ import { getAll, ResponseAllInfo } from '#/entities/user-account/model/user-type import { menuListMiddle, menuListTop } from '../../side-menu/ui/side-menu' +import styles from './main-menu-mobile.module.scss' + export const MainMenuMobile = memo(() => { const { data, status } = useSession() @@ -129,7 +131,7 @@ export const MainMenuMobile = memo(() => { signOut()}> - + Реквизиты @@ -0,0 +1,30 @@ +.logo { + cursor: pointer; + margin-left: 20px; +} + +.errorIcon { + margin-top: 12px; + margin-right: 15px; + cursor: pointer; +} + +.sleepIcon { + margin-top: 12px; + margin-right: 5px; + cursor: pointer; +} + +.bellIcon { + margin-top: 12px; + margin-left: 16px; + cursor: pointer; +} + +.loginButton { + background-color: #555555; +} + +.registerButton { + background-color: #514e62; +} @@ -11,6 +11,8 @@ import { AccountMenu } from '#/shared' import { NotificationMenu } from '#/shared' import { TooltipFreeTokens } from '#/shared' +import styles from './main-menu.module.scss' + function a11yProps(index: number) { return { id: `simple-tab-${index}`, @@ -78,7 +80,7 @@ export const MainMenu: React.FC = memo(() => { {status !== 'authenticated' && }

{ errorReport.setState(true) }} priority - style={{ - marginTop: 12, - marginRight: 15, - cursor: 'pointer', - }} + className={styles.errorIcon} src='/error_off.svg' height={19} width={19} @@ -182,11 +180,7 @@ export const MainMenu: React.FC = memo(() => { )}

{ {status === 'authenticated' ? ( <>

{ ) : ( <>