@@ -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, - } -} @@ -1,8 +1,6 @@ import React, { useState } from 'react' import { Box, TextField, Typography } from '@mui/material' -import axios from 'axios' -import { Dayjs } from 'dayjs' -import { useRouter } from 'next/navigation' +import dayjs, { Dayjs } from 'dayjs' import { useSession } from 'next-auth/react' import { ButtonGray, ButtonUI, Error, InputStyleDark, Loader, Modal } from '#/shared' @@ -38,6 +36,11 @@ export const ApiKeyModal = ({ const keyName = `Ключ ${Math.floor(Math.random() * 100000) + 1}` + if (endDate && dayjs(endDate).isBefore(dayjs(), 'day')) { + showMessage('Указана неверная дата') + return + } + setIsLoading(true) const response = endDate && endDate !== '' @@ -1,17 +0,0 @@ -import { accountApi } from '#/shared/api/account-endpoints' - -export const authTelegram = async (email: any, password: any) => { - const user = await accountApi.loginByEmail(email, password) - - if (user !== null) { - ;(window as any).Telegram.WebApp.sendData(user.token.access) - } -} - -export const authTelegramYandex = async (email: any, password: any) => { - const user = await accountApi.loginByEmail(email, password) - - if (user !== null) { - ;(window as any).Telegram.WebApp.sendData(user.token.access) - } -} @@ -1 +0,0 @@ -export { authTelegram } from './model/auth' @@ -0,0 +1,55 @@ +import { IModelParams } from '#/shared/api/models/models' + +export type ModelParamValues = Record + +export function getAllowedParamKeys(params: IModelParams[], currentVersion: string): Set { + return new Set( + params + .filter((el) => { + if (el.versions.length === 0) { + return true + } + + if (!currentVersion) { + return true + } + + return el.versions.includes(currentVersion) + }) + .map((el) => el.key) + ) +} + +export function pruneModelParams( + includeParams: ModelParamValues, + params: IModelParams[], + currentVersion: string +): ModelParamValues | null { + const allowedKeys = getAllowedParamKeys(params, currentVersion) + + if (allowedKeys.size === 0) { + return Object.keys(includeParams).length !== 0 ? {} : null + } + + const filteredEntries = Object.entries(includeParams).filter(([key]) => allowedKeys.has(key)) + + if (filteredEntries.length === Object.keys(includeParams).length) { + return null + } + + return filteredEntries.length ? Object.fromEntries(filteredEntries) : {} +} + +export function buildDefaultParamsForVersion(parameters: IModelParams[], version: string): ModelParamValues { + if (!version) { + return parameters.reduce((acc, param) => ({ ...acc, [param.key]: param.values.default }), {}) + } + + return parameters.reduce((acc, param) => { + if (param.versions.length === 0 || param.versions.includes(version)) { + return { ...acc, [param.key]: param.values.default } + } + + return acc + }, {} as ModelParamValues) +} @@ -0,0 +1,27 @@ +import React from 'react' + +import { replaceParams } from '#/app/store/model-parametres-store' +import { useAppDispatch, useAppSelector } from '#/app/store/store' +import { IModelParams } from '#/shared/api/models/models' + +import { pruneModelParams } from '../lib/prune-model-params' + +export function usePruneModelParams(params: IModelParams[] | undefined, currentVersion: string) { + const includeParams = useAppSelector((state) => state.params.params) as Record< + string, + string | number | number[] | boolean + > + const dispatch = useAppDispatch() + + React.useEffect(() => { + if (!params?.length) { + return + } + + const nextPayload = pruneModelParams(includeParams, params, currentVersion) + + if (nextPayload !== null) { + dispatch(replaceParams(nextPayload)) + } + }, [currentVersion, dispatch, includeParams, params]) +} @@ -1,126 +1,94 @@ -import React from 'react' -import { Stack } from '@mui/material' - -import { CheckboxFilter } from '#/app/components/filters/checkbox_filter' -import { InputFilter } from '#/app/components/filters/input_filter' -import { SelectFilter } from '#/app/components/filters/select_filter' -import { Slide } from '#/app/components/filters/slide_filter' -import { replaceParams, setParams } from '#/app/store/model-parametres-store' -import { useAppDispatch, useAppSelector } from '#/app/store/store' -import { IModelParams } from '#/shared/api/models/models' - -interface IProps { - params: IModelParams[] - currentVersion: string -} -export default function BotParamsMap({ params, currentVersion }: IProps) { - const includeParams = useAppSelector((state) => state.params.params) - const dispatch = useAppDispatch() - - const setNewParam = React.useCallback( - (payload: { [key: string]: string | number | number[] | boolean }) => { - dispatch(setParams(payload)) - }, - [dispatch] - ) - - React.useEffect(() => { - if (!params) { - return - } - - const allowedKeys = new Set( - params - .filter((el) => { - if (el.versions.length === 0) { - return true - } - - // Согласовано с chat-bot filteredParams: без выбранной версии считаем все параметры допустимыми - if (!currentVersion) { - return true - } - - return el.versions.includes(currentVersion) - }) - .map((el) => el.key) - ) - - if (allowedKeys.size === 0) { - if (Object.keys(includeParams).length !== 0) { - dispatch(replaceParams({})) - } - return - } - - const filteredEntries = Object.entries(includeParams).filter(([key]) => allowedKeys.has(key)) - - if (filteredEntries.length !== Object.keys(includeParams).length) { - const nextPayload = filteredEntries.length ? Object.fromEntries(filteredEntries) : {} - dispatch(replaceParams(nextPayload)) - } - }, [currentVersion, dispatch, includeParams, params, setNewParam]) - - return ( - - {params.map((item, idx) => { - if (item.versions.length === 0 || item.versions.includes(currentVersion)) { - if (item.type == 'floatrange' || item.type == 'intrange') { - return ( - - ) - } - if (item.type == 'bool') { - return ( - - ) - } - - if (item.type == 'list') { - return ( - - ) - } - - if (item.type == 'int' || item.type == 'str') { - return ( - - ) - } - } - })} - - ) -} +import React from 'react' +import { Stack } from '@mui/material' + +import { CheckboxFilter } from '#/app/components/filters/checkbox_filter' +import { InputFilter } from '#/app/components/filters/input_filter' +import { SelectFilter } from '#/app/components/filters/select_filter' +import { Slide } from '#/app/components/filters/slide_filter' +import { setParams } from '#/app/store/model-parametres-store' +import { useAppDispatch, useAppSelector } from '#/app/store/store' +import { IModelParams } from '#/shared/api/models/models' + +import { usePruneModelParams } from './model/use-prune-model-params' + +interface IProps { + params: IModelParams[] + currentVersion: string +} +export default function BotParamsMap({ params, currentVersion }: IProps) { + const includeParams = useAppSelector((state) => state.params.params) + const dispatch = useAppDispatch() + + usePruneModelParams(params, currentVersion) + + const setNewParam = React.useCallback( + (payload: { [key: string]: string | number | number[] | boolean }) => { + dispatch(setParams(payload)) + }, + [dispatch] + ) + + return ( + + {params.map((item, idx) => { + if (item.versions.length === 0 || item.versions.includes(currentVersion)) { + if (item.type == 'floatrange' || item.type == 'intrange') { + return ( + + ) + } + if (item.type == 'bool') { + return ( + + ) + } + + if (item.type == 'list') { + return ( + + ) + } + + if (item.type == 'int' || item.type == 'str') { + return ( + + ) + } + } + })} + + ) +} + \ No newline at end of file @@ -1,4 +1,4 @@ -import axios, { AxiosResponse } from 'axios' +import axios from 'axios' import { getApiUrl } from '#/shared/lib/constants' @@ -1,4 +1,4 @@ -import axios, { AxiosResponse } from 'axios' +import axios from 'axios' import { getApiUrl } from '#/shared/lib/constants' @@ -1,4 +1,4 @@ -import axios, { AxiosResponse } from 'axios' +import axios from 'axios' import { getApiUrl } from '#/shared/lib/constants' @@ -1,4 +1,4 @@ -import axios, { AxiosResponse } from 'axios' +import axios from 'axios' import { getApiUrl } from '#/shared/lib/constants' @@ -1,6 +1,6 @@ import React, { FC, useState } from 'react' import { useForm } from 'react-hook-form' -import { SubmitErrorHandler } from 'react-hook-form/dist/types/form' +import { SubmitErrorHandler } from 'react-hook-form' import { Box, TextField, Typography } from '@mui/material' import { useSession } from 'next-auth/react' @@ -1,6 +1,6 @@ import React, { FC, useEffect, useState } from 'react' import { useForm } from 'react-hook-form' -import { SubmitErrorHandler } from 'react-hook-form/dist/types/form' +import { SubmitErrorHandler } from 'react-hook-form' import { Box, TextField, Typography } from '@mui/material' import axios from 'axios' import { useSession } from 'next-auth/react' @@ -2,7 +2,6 @@ import React, { useState } from 'react' import { Box, Typography } from '@mui/material' import axios from 'axios' import { Dayjs } from 'dayjs' -import { useRouter } from 'next/navigation' import { useSession } from 'next-auth/react' import { ButtonGray, ButtonUI, Error, Loader, Modal } from '#/shared' @@ -77,7 +77,7 @@ export const LimitModal: React.FC = ({ }} > - Сотрудник {person?.email} + Сотрудник {person?.email} @@ -1,4 +1,3 @@ -import { useSession } from 'next-auth/react' import { changePassword } from '../api/change-password' import { useState } from 'react' import { getModalById, PLATE_CHANGE_PASSWORD } from '#/features/modals' @@ -1,32 +0,0 @@ -import React, { ReactNode } from 'react' -import { Menu, MenuItem } from '@mui/material' - -interface IProps { - children: ReactNode - clicked: boolean - handleClose: () => void - pointY: number - pointX: number -} - -export const ContextMenu = ({ children, pointX, pointY, clicked, handleClose }: IProps) => { - return ( - - {children} - - ) -} @@ -13,7 +13,7 @@ export function useCreateMediaMessage( modelType: 'video' | 'image' | 'audio' | 'voice', device: Device, setMessages: Dispatch>, - mobileScrollContainer: RefObject + mobileScrollContainer: RefObject ) { const [isComplete, setIsComplete] = useState(false) const [createLoading, setCreateLoading] = useState(false) @@ -4,8 +4,7 @@ interface SendReport { errorMessage: string email: string file?: File - company?:string -} +} export async function sendReport({errorMessage, email, file}: SendReport) { let formData = new FormData() @@ -16,15 +15,3 @@ export async function sendReport({errorMessage, email, file}: SendReport) { } return await api.post('/reports/', formData) } - - -export async function sendBusinessReport({errorMessage, email, company, file}: SendReport) { - let formData = new FormData() - - formData.append('report_text', `${email}: ${errorMessage}`) - formData.append('company_name', `${company}`) - if (file) { - formData.append('images', file) - } - return await api.post('/reports/business-support/', formData) -} @@ -5,11 +5,11 @@ import { useAppSelector } from '#/app/store/store' import { makePrivateRequest } from '#/shared/api' import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' -import { sendBusinessReport, sendReport } from '../api' +import { sendReport } from '../api' const MAX_FILE_SIZE = 4.5 * 1024 * 1024 // 4.5 MB -export const useErrorReport = (reportType:'business' | 'default' = 'default') => { +export const useErrorReport = () => { const email = useAppSelector((state) => state.user.email) const [file, setFile] = React.useState() @@ -34,7 +34,7 @@ export const useErrorReport = (reportType:'business' | 'default' = 'default') => } } - const sendError = makePrivateRequest(async (company) => { + const sendError = makePrivateRequest(async () => { if (errorMessage.trim() === '') { showMessage('Поле не должно быть пустым.') setError(true) @@ -42,10 +42,7 @@ export const useErrorReport = (reportType:'business' | 'default' = 'default') => return } - const response = await (reportType === 'business' - ? sendBusinessReport({ errorMessage, email, company, file }) - : sendReport({ errorMessage, email, file }) - ) + const response = await sendReport({ errorMessage, email, file }) if (response.status === 201) { setErrorMessage('') @@ -1,120 +0,0 @@ -import * as React from 'react' -import { useForm } from 'react-hook-form' -import { Typography } from '@mui/material' - -import { useAppSelector } from '#/app/store/store' -import AttachSvg from '#/assets/svg/attach.svg?react' -import PlusSvg from '#/assets/svg/plus.svg?react' -import { BUSINESS_ERROR_REPORT, getModalById, PlateTemplate } from '#/features/modals' -import { CompanyAutocomplete } from '#/features/register-business/api/company-autocomplete' -import { companyNameOptions } from '#/features/register-business/lib/constatnts-step-legal-informative' -import { c } from '#/shared' -import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' -import { CommonButton } from '#/shared/ui/button' -import { CommonTextArea } from '#/shared/ui/common-textarea' - -import { useErrorReport } from '../model/use-error-report' - -import styles from './error-report.module.scss' - -export const BusinessErrorReportPlate = () => { - const modal = getModalById(BUSINESS_ERROR_REPORT) - const { error, isSend, setErrorMessage, handleFileChange, file, setFile, sendError } = useErrorReport('business') - const { showMessage } = useShowDataStore() - - const { companyName } = useAppSelector((state) => state.stepper.dataForCreate) - - const methods = useForm({ - defaultValues: { - companyName - }, - }) - - const handleSubmit = () => { - const formValues = methods.getValues() - const company = formValues.companyName?.trim() - - if (!company) { - showMessage('Пожалуйста, укажите наименование организации') - return - } - - sendError(company) - } - - return ( - - {isSend ? ( -

Спасибо!

Ваше сообщение направлено нашим специалистам. Ответ придет на почту, указанную при регистрации

- ) : ( -

e.stopPropagation()}> -

Запрос для компаний и партнеров

- - Опишите ваш сценарий — подберем решение и ответим за день. Работаем для корпораций, агентств и интеграторов - - - - - setErrorMessage(evt.target.value)} - buttomSlot={ - <> - - - } - /> - {file && ( -

- -

- {file.name} - {(file.size / 1024).toFixed(1)} KB -

- - -

- )} - -

- modal.setState(false)}> - Отмена - - - Отправить - -

- )} - - ) -} \ No newline at end of file @@ -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,6 +1,6 @@ import React from 'react' import { KeyboardArrowLeft, KeyboardArrowRight } from '@mui/icons-material' -import { Box, Button, MobileStepper, Table, TableBody, TableCell, TableHead, TableRow, Typography } from '@mui/material' +import { Box, Button, MobileStepper, Table, TableBody, TableCell, TableRow, Typography } from '@mui/material' import CircularProgress from '@mui/material/CircularProgress' import { TranslateFields } from '#/features/get-admin-stats/lib/constants' @@ -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) @@ -9,11 +7,9 @@ export const useLibrarySwiper = (onSlideFalse: ((...args: any) => any) | undefin const keydown = (e: KeyboardEvent) => { if (e.key === 'ArrowRight') { - // e.preventDefault() slideNext() } if (e.key === 'ArrowLeft') { - // e.preventDefault() slidePrev() } } @@ -41,10 +37,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)}> - -

- {!isSvg && image ? ( - К сожалению, изображение не загрузилось

- ) : ( - К сожалению, изображение не загрузилось

- )} -

- ) -} @@ -1,30 +0,0 @@ -.close_block{ - position: absolute; - z-index: 105; - cursor: pointer; - right: 25px; - top: 25px; -} - -.image_block{ - position: absolute; - padding: 0 20px; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 105; - margin: auto; - width: fit-content; - height: fit-content; -} - -.image_style{ - position: relative; - width: 100%; - height: 100%; - max-width: 960px; - max-height: 700px; - border-radius: 15px; - object-fit: contain; -} \ No newline at end of file @@ -1,6 +1,6 @@ import React, { FC, useEffect, useState } from 'react' import { useForm } from 'react-hook-form' -import { SubmitErrorHandler } from 'react-hook-form/dist/types/form' +import { SubmitErrorHandler } from 'react-hook-form' import { Box, TextField, Typography } from '@mui/material' import { useSession } from 'next-auth/react' @@ -1,7 +1,5 @@ export const PLATE_CHANGE_PASSWORD = 'plate-change-password' -export const RESEND_INVATION_PASSWORD = 'resend-invation-password' export const ERROR_REPORT = 'error-report' -export const BUSINESS_ERROR_REPORT = 'business-error-report' export const LOW_BALANCE_OFFER = 'low-balance-offer' export const SUBSCRIPTION_CHANGE_NOTIFICATION = 'subscription-change-notification' export const PLATE_ADD_VOICE = 'plate-add-voice' @@ -1 +1,3 @@ -export * from './store.modals' \ No newline at end of file +export type { Modal } from './use-modal' +export { useModal } from './use-modal' +export { modalsSlice } from './modals-slice' @@ -0,0 +1,56 @@ +import { createSlice, PayloadAction } from '@reduxjs/toolkit' + +export type ModalEntry = { + state: boolean + store: Record +} + +export interface ModalsState { + modals: Record +} + +const emptyEntry = (): ModalEntry => ({ state: false, store: {} }) + +const initialState: ModalsState = { + modals: {}, +} + +export const modalsSlice = createSlice({ + name: 'modals', + initialState, + reducers: { + ensureModal: (state, action: PayloadAction) => { + const id = action.payload + if (!state.modals[id]) { + state.modals[id] = emptyEntry() + } + }, + setModalState: ( + state, + action: PayloadAction<{ id: string; state: boolean; store?: Record }> + ) => { + const { id, state: isOpen, store } = action.payload + if (!state.modals[id]) { + state.modals[id] = emptyEntry() + } + state.modals[id].state = isOpen + if (store !== undefined) { + state.modals[id].store = store + } + }, + setModalStoreProperty: ( + state, + action: PayloadAction<{ id: string; key: string; value: unknown }> + ) => { + const { id, key, value } = action.payload + if (!state.modals[id]) { + state.modals[id] = emptyEntry() + } + state.modals[id].store[key] = value + }, + }, +}) + +export const { ensureModal, setModalState, setModalStoreProperty } = modalsSlice.actions + +export default modalsSlice.reducer @@ -1,78 +0,0 @@ -import { create } from "zustand"; - -type Set = { - (partial: (state: PlatesStore) => Partial): void; -}; - -type Get = () => PlatesStore; - -function makeModalInstance(set: Set, get: Get, key: string) { - const ModalInstance: Modal = { - id: key, - state: false, - store: {}, - setState(state, store) { - const modals = get().modals; - - store = store ?? {}; - - set(() => ({ - modals: { ...modals, [this.id]: { ...modals[key], state, store } }, - })); - }, - setStoreProperty(key, value) { - const modals = get().modals; - - this.store[key] = value; - - set(() => ({ - modals: { ...modals, [this.id]: { ...modals[key], store: this.store } }, - })); - }, - getStoreProperty(key) { - return this.store[key]; - }, - }; - - return ModalInstance; -} - -export interface Modal { - id: string; - state: boolean; - store: Record; - setState: (state: boolean, store?: Record) => void; - setStoreProperty: (key: string, value: any) => void; - getStoreProperty: (key: string) => T | undefined; -} - -export interface PlatesStore { - modals: Record; - setModal: (key: string) => void; - getModal: (key: string) => Modal; -} - -export const usePlatesStore = create((set, get) => { - const modals: Record = {}; - - function setModal(key: string) { - set((state) => ({ - modals: { - ...state.modals, - [key]: Object.assign({}, makeModalInstance(set, get, key)), - }, - })); - } - - function getModal(key: string) { - return ( - get().modals[key] ?? Object.assign({}, makeModalInstance(set, get, key)) - ); - } - - return { - modals, - setModal, - getModal, - }; -}); @@ -0,0 +1,54 @@ +import { useCallback, useEffect, useMemo } from 'react' + +import { useAppDispatch, useAppSelector } from '#/app/store/store' + +import { ensureModal, setModalState, setModalStoreProperty } from './modals-slice' + +export interface Modal { + id: string + state: boolean + store: Record + setState: (state: boolean, store?: Record) => void + setStoreProperty: (key: string, value: unknown) => void + getStoreProperty: (key: string) => T | undefined +} + +export function useModal(id: string): Modal { + const dispatch = useAppDispatch() + const entry = useAppSelector((state) => state.modals.modals[id] ?? { state: false, store: {} }) + + useEffect(() => { + dispatch(ensureModal(id)) + }, [dispatch, id]) + + const setState = useCallback( + (state: boolean, store?: Record) => { + dispatch(setModalState({ id, state, store })) + }, + [dispatch, id] + ) + + const setStoreProperty = useCallback( + (key: string, value: unknown) => { + dispatch(setModalStoreProperty({ id, key, value })) + }, + [dispatch, id] + ) + + const getStoreProperty = useCallback( + (key: string) => entry.store[key] as T | undefined, + [entry.store] + ) + + return useMemo( + () => ({ + id, + state: entry.state, + store: entry.store, + setState, + setStoreProperty, + getStoreProperty, + }), + [id, entry.state, entry.store, setState, setStoreProperty, getStoreProperty] + ) +} @@ -75,6 +75,10 @@ &_secondary { background-color: #373737; } + + &_customBg { + background-color: var(--template-content-bg, var(--new-ui-main-color)); + } } // &__header { @@ -1,6 +1,5 @@ -import { useEffect } from 'react' import { c } from '#/shared' -import { usePlatesStore } from '../model' +import { useModal } from '../model' import styles from './template.module.scss' import PlusIcon from '#/assets/svg/plus.svg?react' @@ -40,11 +39,7 @@ export default function PlatesTemplate({ contentBackgroundColor, variant = 'primary', }: PlatesTemplateProps) { - const { setModal, getModal } = usePlatesStore() - - const modal = getModal(id) - - useEffect(() => setModal(id), []) + const modal = useModal(id) return (

e.stopPropagation()} > )} -

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

@@ -245,13 +232,7 @@ export const RegisterEmailForm: React.FC = ({ successLo }} > Есть аккаунт?{' '} - + Войти @@ -1,4 +1,4 @@ -import { Dispatch, SetStateAction, useState, useEffect } from 'react' +import { Dispatch, SetStateAction, useState } from 'react' import { useSession } from 'next-auth/react' import { ResponseGetPersons } from '#/features/invite-person-in-business' @@ -1,23 +0,0 @@ -import { useSession } from 'next-auth/react' -import { resendInvation } from '../api/resend-invation' -import { getModalById, RESEND_INVATION_PASSWORD } from '#/features/modals' -import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' - -export const useResendInvation = () => { - const modal = getModalById(RESEND_INVATION_PASSWORD) - const { showMessage } = useShowDataStore() - const { data } = useSession() - - const resend = async () => { - const response = await resendInvation(modal.getStoreProperty('email')!, data?.access) - - if (response.status == 200) { - showMessage('Приглашение переотправлено!', 'success') - modal.setState(false) - } else { - showMessage(response.data) - } - } - - return [resend] -} @@ -1,4 +0,0 @@ -interface ResponseResendInvation { - data: any, - status: number -} \ No newline at end of file @@ -1 +0,0 @@ -export * from './resend-invation' \ No newline at end of file @@ -1,27 +0,0 @@ -.container { - padding-bottom: 0; - background-color: #373737; -} - -.modal { - min-width: 450px; - width: 100%; - padding-top: 35px; - - &__buttons { - display: flex; - margin-top: 45px; - gap: 10px; - } - &__header { - margin-bottom: 15px; - font-size: 30px; - font-weight: 600; - letter-spacing: -0.02em; - } - &__message { - font-size: 15px; - color: var(--text-color-main); - width: 70%; - } -} @@ -1,32 +0,0 @@ -import { getModalById, RESEND_INVATION_PASSWORD, PlateTemplate } from '#/features/modals' -import styles from './resend-invation.module.scss' -import React from 'react' -import { CommonButton } from '#/shared/ui/button' -import { CommonInput } from '#/shared/ui/common-input' -import { useResendInvation } from '../lib/use-resend-invation' -import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' - -interface ResendInvationPlateProps {} - -export const ResendInvationPlate = ({}: ResendInvationPlateProps) => { - const modal = getModalById(RESEND_INVATION_PASSWORD) - - const [resend] = useResendInvation() - - return ( - -

Переотправить приглашение

При переотправке приглашения у сотрудника будет заменен отправленный пароль.

- resend()}> - Переотправить - - modal.setState(false)}> - Отмена - -

- - ) -} @@ -1 +0,0 @@ -export * from './ui' \ No newline at end of file @@ -1 +0,0 @@ -export const suggestedMessagesList = ['Что такое орбитальная механика?', 'Как приготовить омлет?', 'Кто такие Фиксики?'] @@ -1,35 +0,0 @@ -import React from 'react' -import { Box, Typography } from '@mui/material' - - -interface ISuggestedMessage { - title: string - sendMessage?: (title: string) => void -} - -const SuggestedMessage: React.FC = ({ title, sendMessage }) => { - return ( - sendMessage!(title)} - sx={{ - boxShadow: '0px 0px 20px rgba(0, 0, 0, 0.05)', - padding: '10px 14px', - backgroundColor: '#3D3D3D', - borderRadius: '8px', - color: '#7F7DF3', - marginTop: 1.5, - cursor: 'pointer', - width: 'fit-content', - '&:hover': { - ' -webkit-transform': 'scale(1.03)', - '-ms-transform': 'scale(1.03)', - ' transform': 'scale(1.03)', - }, - }} - > - {title} - - ) -} - -export default SuggestedMessage @@ -1,33 +0,0 @@ -import React from 'react' -import { Box, Stack, Typography } from '@mui/material' - -import { suggestedMessagesList } from '#/features/send-suggested-message/lib/constants' -import SuggestedMessage from '#/features/send-suggested-message/ui/suggested-message' - -interface IProps { - device: 'mobile' | 'desktop' - sendMessage?: (title: string) => void -} - -export const SuggestedMessages: React.FC = ({ device, sendMessage }) => { - const desktop = device === 'desktop' - - return ( - - Не знаете с чего начать? - Попробуйте, например, вот так: - - {suggestedMessagesList.map((messages) => { - return - })} - - - ) -} @@ -1 +0,0 @@ -export { SuggestedMessages } from '#/features/send-suggested-message/ui/suggested-messages' @@ -1,8 +1,8 @@ -import React, { useEffect } from 'react' +import React from 'react' import styles from './slow-loading.module.scss' import { Loader } from '#/shared' import { CommonButton } from '#/shared/ui/button' -import { signOut, useSession } from 'next-auth/react' +import { signOut } from 'next-auth/react' interface SlowLoadingProps { } @@ -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}

@@ -1,65 +0,0 @@ -//@ts-ignore -import { Options, Step } from 'intro.js' - -export const steps: Step[] = [ - { - element: '.tutorial-chat-gpt', - intro: 'Это рабочее окно. В нем вы сможете отправлять ваши сообщения и просматривать историю чата.', - position: 'left', - title: 'Рабочее окно', - }, - { - element: '.tutorial-input', - intro: 'Вводите сюда свой запрос, в ответ на него ChatGPT предоставит вам нужную информацию.', - position: 'top', - title: 'Сообщения', - }, - { - element: '.tutorial-calc', - intro: 'Этот виджет показывает сколько токенов спишется за ваш текущий запрос.', - position: 'top', - title: 'Сообщения', - }, - { - element: '.tutorial-show-setting', - intro: - 'В виджете фильтров вы можете выбрать тип модели (при наведении на каждую модель отображаются подсказки).' + - ' Обратите внимание на параметры, которые вы можете выставлять самостоятельно (при наведении на них также отображается подсказка).', - position: 'right', - title: 'Фильтры', - }, - { - element: '.t', - intro: 'Для того, чтобы ChatGPT запоминал историю чата и на основании этого давал более точные ответы вы можете добавить сообщения в контекст. Для этого просто нажмите на сообщение. Обратите внимание: в контекст вы должны добавлять только ваши сообщения, а не ответы от ChatGPT. Контекст повышает стоимость запроса !', - position: 'left', - title: 'Что такое контекст?', - }, - { - element: '.tutorial-input', - intro: 'После клика на ВАШЕ соощение оно добавляется в это поле. Чтобы удалить сообщение из контекста также нажмите на него в этом поле. Сейчас в контексте одно сообщение, но вы можете добавлять их сколько угодно. Добавив сообщение в контекст, пишите свой запрос и отправляйте сообщение. Теперь ChatGPT даст лучший ответ на основании ваших предыдущих сообщений.', - position: 'left', - title: 'Контекст', - }, - { - element: '.tutorial-balance.ts', - intro: 'Не забывайте следить за своим балансом. Обратите внимание: измененение модели в фильтрах влияет на стоимость запроса, использование контекста также добавит стоимость запроса.', - position: 'left', - title: 'Баланс', - }, -] - -export const options: Options = { - hidePrev: true, - showBullets: false, - nextLabel: 'Дальше', - prevLabel: 'Предыдущий', - doneLabel: 'Готово', - disableInteraction: true, -} - -export const responseGPT = - 'Для нахождения минимального элемента в массиве предлагаю написать собственную функцию с использованием функции высшего порядка reduce и стандартного метода Math.min():\n' + - '\n' + - 'const numbers = [-94, 87, 12, 0, -67, 32];\n' + - 'const min = (values) => values.reduce((x, y) => Math.min(x, y));\n' + - 'console.log(min(numbers)); // => -94\n' @@ -1,84 +0,0 @@ -import React from 'react' -import { Box, Tooltip, Typography } from '@mui/material' - -import { baseColor } from '#/shared/lib/constants/colors' - -interface ITooltipMy { - begin: () => void - children: React.ReactNode -} - -interface ITooltiptext { - begin: () => void -} -const TooltipText: React.FC = ({ begin }) => { - return ( - - - Как работать с ChatGPT - - - Научитесь работать с ChatGPT за 7 простых шагов! - - - Начать обучение - - - ) -} -const TooltipMy: React.FC = ({ children, begin }) => { - return ( - } - componentsProps={{ - tooltip: { - sx: { - '&.MuiTooltip-tooltip': { - '&.MuiTooltip-tooltipPlacementBottom': { - marginTop: '2px', - }, - '&.MuiTooltip-tooltipPlacementTop': { - marginBottom: '2px', - }, - '&.MuiTooltip-tooltipPlacementLeft': { - marginRight: '24px', - }, - }, - bgcolor: '#2B2828', - borderRadius: '10px', - '& .MuiTooltip-arrow': { - color: '#2B2828', - }, - padding: '15px 20px', - boxShadow: '0px 0px 4px rgba(0, 0, 0, 0.04), 0px 4px 32px rgba(0, 0, 0, 0.16)', - }, - }, - }} - > - {children} - - ) -} - -export default TooltipMy @@ -1,37 +0,0 @@ -import React from 'react' -import { Steps } from 'intro.js-react' -import Image from 'next/image' - -import { TutorialContext } from '../../tutorial-context/tutorial-context' -import { options, steps } from '../lib/constants' - -import TooltipMy from './tooltip' - -export const Tutorial = () => { - const [enabled, setEnabled] = React.useState(false) - - const context = React.useContext(TutorialContext) - const onExit = () => { - setEnabled(false) - } - - return ( - <> - setEnabled(true)}> - {''}

- - - { - // @ts-ignore - context?.setStep(e) - }} - options={options} - enabled={enabled} - steps={steps} - onExit={onExit} - initialStep={0} - /> - - ) -} @@ -1 +0,0 @@ -export { Tutorial } from './ui/tutorial' @@ -1,50 +0,0 @@ -import { createAsyncThunk, createSlice } from '@reduxjs/toolkit' - -import { CopywriteProxy } from '#/domains/copywrite/proxy/copywrite-proxy' -import { Template } from '#/domains/copywrite/proxy/types/template' -import { Message } from '#/shared/lib/types/model' - -export interface Theme { - templates: Template[] | null - generation: Message[] | null -} - -const initialState: Theme = { - templates: null, - generation: null, -} - -export const loadTemplates = createAsyncThunk( - 'copywrite/loadTemplates', - async (token?: string): Promise => { - return await CopywriteProxy.getTemplates(token) - } -) - -export const loadGeneration = createAsyncThunk( - 'copywrite/loadGeneration', - async (token?: string): Promise => { - return await CopywriteProxy.getGeneration(token) - } -) - -export const copySlice = createSlice({ - name: 'copySlice', - initialState, - reducers: { - loadTemplates: (state, action) => {}, - }, - extraReducers: (builder) => { - builder - .addCase(loadTemplates.fulfilled, (state, action) => { - state.templates = action.payload - }) - .addCase(loadGeneration.fulfilled, (state, action) => { - state.generation = action.payload - }) - }, -}) - -export const {} = copySlice.actions - -export default copySlice.reducer @@ -1,72 +0,0 @@ -import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react' -import { useRouter } from 'next/router' -import { useSession } from 'next-auth/react' - -import { useAppDispatch, useAppSelector } from '#/app/store/store' -import { emptyTemplate } from '#/domains/copywrite/lib/constants' -import { Template } from '#/domains/copywrite/proxy/types/template' -import { loadGeneration, loadTemplates } from '#/features/use-copy/copy-slice' -import { Message } from '#/shared/lib/types/model' - -interface UseCopy { - currentTemplate: Template | null - generations: Message[] | null - pickGeneration: Message | null - setPickGeneration: Dispatch> - createEmpty: () => void -} - -export const useCopy = (): UseCopy => { - const [pickGeneration, setPickGeneration] = useState(null) - - const { data } = useSession() - - const { query, push, pathname } = useRouter() - - const templates = useAppSelector((state) => state.copy.templates) - - const generations = useAppSelector((state) => state.copy.generation) - - const dispatch = useAppDispatch() - - const getId = () => { - const id = query['id'] - - if (id) { - return Number(id) - } - } - - const createEmpty = () => { - setPickGeneration({ - content: '', - uid: '123', - created_at: '123', - file: null, - info: null, - from_model: false, - elapsed_time: '12', - is_favourite: false, - is_sent: false, - }) - } - - useEffect(() => { - if (data?.access) { - dispatch(loadTemplates(data.access)) - dispatch(loadGeneration(data.access)) - } - }, [data?.access]) - - const currentTemplate = useMemo(() => { - const id = getId() - const foundTemplate = templates?.find((el) => el.id === id) - if (foundTemplate) { - return foundTemplate - } - - return emptyTemplate - }, [templates]) - - return { currentTemplate, generations, pickGeneration, setPickGeneration, createEmpty } -} @@ -37,51 +37,10 @@ const getStatistic = async (type: string, interval: string, token?: string) => { } export const useStats = () => { - - // let dataLine = { - // datasets: [ - // { - // fill: true, // Включить заливку под графиком - // backgroundColor: (context: any) => { - // const chart = context.chart - // const { ctx, chartArea } = chart - - // if (!chartArea) { - // // Линейный градиент не применяется, если область графика не доступна - // return null - // } - - // const gradient = ctx.createLinearGradient(chartArea.left, chartArea.bottom, chartArea.left, chartArea.top) - - // gradient.addColorStop(0.68, 'rgba(130, 128, 255, 0.20)') - // gradient.addColorStop(1, 'rgba(130, 128, 255, 0.10)') - - // return gradient - // }, - // borderWidth: 1, // Ширина линии графика - // borderColor: '#8280FF', - // pointRadius: 7, // Размер точек - // pointBackgroundColor: 'white' // Цвет точек - // pointBorderWidth: 1, // Ширина обводки точек - // pointBorderColor: '#8280FF', // Цвет обводки точек - // hoverRadius: 7, // Размер точек при наведении - // hoverBackgroundColor: '#8280FF', // Цвет точек при наведении - // hoverBorderColor: 'white', // Цвет обводки точек при наведении - // }, - // ], - // } - const { data: session } = useSession() const [timeForStats, setTimeForStats] = useState('current_month') - // useEffect(() => { - - // setStatsByDays(prev => { - // return {prev.datasets[0]} - // }) - // },[theme]) - const [statsByModel, setStatsByModels] = useState(dataLine) const [statsByType, setStatsByType] = useState(dataLine) @@ -0,0 +1,11 @@ +.yandexIcon { + margin-right: 15px; +} + +.yandexButton { + transition: opacity 0.3s ease-in-out; + + &:hover { + opacity: 0.7; + } +} @@ -1,17 +1,16 @@ import { Button } from '@mui/material' import { signIn } from 'next-auth/react' import Image from 'next/image' -import React, { useState } from 'react' +import React from 'react' + +import styles from './yandex-auth-button.module.scss' interface YandexAuthButtonProps {} export const YandexAuthButton = ({}: YandexAuthButtonProps) => { - const [hovered, setHovered] = useState(false) - return ( ) @@ -4,8 +4,8 @@ import YandexProvider from 'next-auth/providers/yandex' import { getAll } from '#/entities/user-account/model/user-type-slice' -import { AuthConstants, ERROR_MAPPING, ERROR_YANDEX_MAPPING } from './constants' -import { AuthorizationProxy } from './proxy' +import { AuthConstants, ERROR_MAPPING, ERROR_YANDEX_MAPPING } from '#/shared/lib/auth/constants' +import { AuthorizationProxy } from '#/shared/lib/auth/authorization-proxy' const AuthProxy = new AuthorizationProxy() @@ -64,6 +64,23 @@ export const authOptions: NextAuthOptions = { return (await data) as User }, }), + CredentialsProvider({ + id: 'tokens', + type: 'credentials', + credentials: {}, + async authorize(credentials) { + const { access, refresh } = credentials as { access: string; refresh: string } + + if (!access || !refresh) { + throw new Error('invalid_credentials') + } + + return { + id: 'tokens', + token: { access, refresh }, + } as User + }, + }), ], callbacks: { async jwt({ token, user, account, trigger }) { @@ -29,7 +29,7 @@ export default function Document() {

@@ -1,6 +0,0 @@ -import BusinessReportsMobile from '#/views/reports-mobile/ui/business-error-reports-mobile' -import { getDefaultLayout } from '#/widgets/layouts' - -BusinessReportsMobile.getLayout = getDefaultLayout({ titlePage: 'Компаниям', device: 'mobile' }) - -export default BusinessReportsMobile @@ -1,22 +0,0 @@ -import { useEffect, useState } from 'react' -const useContextMenu = () => { - const [clicked, setClicked] = useState(false) - const [points, setPoints] = useState({ - x: 0, - y: 0, - }) - useEffect(() => { - const handleClick = () => setClicked(false) - document.addEventListener('click', handleClick) - return () => { - document.removeEventListener('click', handleClick) - } - }, []) - return { - clicked, - setClicked, - points, - setPoints, - } -} -export default useContextMenu @@ -73,7 +73,7 @@ export const accountApi = { password_1: string, password_2: string, current_password: string - ): Promise<{ status: number; data: { detail: string } }> { + ): Promise<{status:number,data:{detail:string}}> { const response = await axios.put( getApiUrl() + '/auth/reset-pass', { @@ -1,6 +1,7 @@ -import dynamic from 'next/dynamic'; +import dynamic from 'next/dynamic' +import type { ReactElement } from 'react' -type ClientOnlyProps = { children: JSX.Element }; +type ClientOnlyProps = { children: ReactElement } const ClientOnly = (props: ClientOnlyProps) => { const { children } = props; @@ -1,10 +1,9 @@ import axios from 'axios' import { JWT } from 'next-auth/jwt' +import { AuthConstants } from '#/shared/lib/auth/constants' import { getApiUrl } from '#/shared/lib/constants' -import { AuthConstants } from './constants' - export class AuthorizationProxy { public readonly loginByEmail = async (email: string, password: string) => { return await fetch(getApiUrl() + '/auth/login', { @@ -1,4 +1,3 @@ -import type { Env } from '#/shared/lib/env-types' import { getServerEnv } from '#/shared/lib/server-env' const env = getServerEnv() @@ -18,7 +17,7 @@ export abstract class AuthConstants { public static readonly sessionTime = Number(env.NEXT_SESSION_TIME ?? env.NEXT_PUBLIC_SESSION_TIME) * 1000 - + private static readonly expiresTime = this.sessionTime public static readonly getExpiresDate = () => Date.now() + this.expiresTime @@ -33,10 +32,10 @@ export const ERROR_MAPPING: Record = { export const ERROR_YANDEX_MAPPING: Record = { "Your credentials aren't allowed": 'yandex_credentials_not_allowed', - 'Invalid client_id parameter value.': 'yandex_client_id_not_correct', + 'Invalid client_id parameter value.': 'yandex_client_id_not_correct', } export const ERRROR_YANDEX_TRANSLATE_MAPPING: Record = { - 'yandex_credentials_not_allowed': 'Неверные учетные данные', - 'yandex_client_id_not_correct': 'Ошибка сервера (скоро поправим)', + yandex_credentials_not_allowed: 'Неверные учетные данные', + yandex_client_id_not_correct: 'Ошибка сервера (скоро поправим)', } @@ -1,4 +1,4 @@ -import { RegisterOptions } from 'react-hook-form/dist/types/validator' +import { RegisterOptions } from 'react-hook-form' const EMAIL_REGEXP = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\].,;:\s@"]{2,})$/iu @@ -1,3 +1,26 @@ +export const getApiDetail = (error: unknown): string => { + const data = (error as { response?: { data?: { detail?: unknown; message?: string } } })?.response?.data + if (!data) return '' + + if (typeof data.message === 'string') return data.message + + const detail = data.detail + if (typeof detail === 'string') return detail + if (Array.isArray(detail)) { + return detail + .map((item) => + typeof item === 'string' + ? item + : typeof item === 'object' && item !== null && 'msg' in item + ? String((item as { msg: unknown }).msg) + : String(item) + ) + .join(', ') + } + + return '' +} + export const decodeError = (err: any, defaultErr: string) => { if (err.response?.data.detail?.includes('Token balance')) { return 'Не хватает ' + err.response.data.detail.split(' ').filter(Boolean).at(-2) + ' токена' @@ -1,31 +0,0 @@ -import { Dispatch, SetStateAction, useEffect, useState } from 'react' - -export const useAutoLoad = (desktop: boolean): [boolean, Dispatch>] => { - const [fetching, setFetching] = useState(true) - - useEffect(() => { - const isMobile = desktop ? document : document.getElementById('messages-list') - - const scrollHandler = (e: any) => { - if ( - e.target.documentElement.scrollHeight - (e.target.documentElement.scrollTop + window.innerHeight) < - 100 - ) { - setFetching(true) - } - } - const scrollHandlerMobile = (e: any) => { - if (!desktop && e.target.scrollHeight - (e.target.scrollTop + window.innerHeight) < 100) { - setFetching(true) - } - } - - isMobile?.addEventListener('scroll', desktop ? scrollHandler : scrollHandlerMobile) - - return function () { - isMobile?.removeEventListener('scroll', desktop ? scrollHandler : scrollHandlerMobile) - } - }, [desktop]) - - return [fetching, setFetching] -} @@ -1,7 +1,7 @@ import React from 'react' export const useAutoScroll = (depend: any) => { - const refScroll = React.useRef() as any + const refScroll = React.useRef(null) React.useEffect(() => { const block = refScroll.current @@ -1,45 +1,50 @@ -import React, { useState } from 'react' -import { create } from 'zustand' +import { useCallback, useRef } from 'react' -export type Variant = 'error' | 'success' +import { + hide, + setMessage, + setOpened, + setVariant, + show, + ToastVariant, +} from '#/app/store/toast-slice' +import { useAppDispatch, useAppSelector } from '#/app/store/store' -interface ShowDataStore { - message: string - variant: Variant - isOpened: boolean - setOpened: (isOpened: boolean) => void - setMessage: (message: string) => void - setVariant: (variant: Variant) => void - showMessage: (message: string, variant?: Variant) => void -} +export type Variant = ToastVariant -export const useShowDataStore = create((set, get) => { - function setVariant(variant: Variant = 'error') { - set({ ...get(), variant }) - } +const TOAST_DURATION_MS = 5000 - function setMessage(message: string) { - set({ ...get(), message }) - } +export const useShowDataStore = () => { + const dispatch = useAppDispatch() + const { message, variant, isOpened } = useAppSelector((state) => state.toast) + const hideTimeoutRef = useRef | null>(null) - function setOpened(isOpened: boolean) { - set({ ...get(), isOpened }) + const clearHideTimeout = () => { + if (hideTimeoutRef.current) { + clearTimeout(hideTimeoutRef.current) + hideTimeoutRef.current = null + } } - function showMessage(message: string = 'Произошла ошибка', variant: Variant = 'error') { - setVariant(variant) - setOpened(true) - setMessage(message) - setTimeout(() => setOpened(false), 5000) - } + const showMessage = useCallback( + (messageText: string = 'Произошла ошибка', messageVariant: Variant = 'error') => { + clearHideTimeout() + dispatch(show({ message: messageText, variant: messageVariant })) + hideTimeoutRef.current = setTimeout(() => { + dispatch(hide()) + hideTimeoutRef.current = null + }, TOAST_DURATION_MS) + }, + [dispatch] + ) return { - message: '', - variant: 'error', - isOpened: false, - setOpened, - setVariant, - setMessage, + message, + variant, + isOpened, + setOpened: (value: boolean) => dispatch(setOpened(value)), + setMessage: (value: string) => dispatch(setMessage(value)), + setVariant: (value: Variant) => dispatch(setVariant(value)), showMessage, } -}) +} @@ -1,3 +1,7 @@ +.clickableIcon { + cursor: pointer; +} + .wrap { width: 85%; @@ -1,16 +0,0 @@ -.badge { - display: inline-block; - padding: 3px 10px; - &_primary{ - color: var(--air-color); - font-weight: 500; - background-color: rgba($color: #8280ff, $alpha: 0.1); - border-radius: 5px; - } - - &_outline{ - color: rgba($color: #A4AAB5, $alpha: 0.6); - border: 1px solid rgba($color: #A4AAB5, $alpha: 0.6); - border-radius: 10px; - } -} \ No newline at end of file @@ -1,18 +0,0 @@ -import React from 'react' -import styles from './common-badge.module.scss' -import { c } from '#/shared/lib/helpers' - -export type CommonBagdeVariant = 'primary' | 'outline' - -interface CommonBagdeProps extends React.HTMLAttributes { - variant?: CommonBagdeVariant - className?: string -} - -export const CommonBagde = ({ variant = 'primary', children, className, ...props }: CommonBagdeProps) => { - return ( -

- {children} -

- ) -} @@ -1 +0,0 @@ -export * from './common-badge' \ No newline at end of file @@ -1 +0,0 @@ -export * from './ui' \ No newline at end of file @@ -1,184 +0,0 @@ -import * as React from 'react' -import Box from '@mui/material/Box' -import CardContent from '@mui/material/CardContent' -import CardMedia from '@mui/material/CardMedia' -import Stack from '@mui/material/Stack' -import Typography from '@mui/material/Typography' -import Image from 'next/image' -import Link from 'next/link' - -import { translateTypeModel } from '#/shared' - -export const Card: React.FC = ({ - uid, - title, - image_link, - link, - languages, - description, - model_config, - device, - addToFavorites, - is_favourite, - deleteFromFavorites, -}) => { - const desktop = device === 'desktop' - - return ( - - - - - - - - {translateTypeModel(model_config.model_type)} - - - {languages.map((lang: any) => { - if (lang === 'Другие') { - return - } - return ( - - {lang} - - ) - })} - - - - {title} - - - {description} - - - - { - e.preventDefault() - deleteFromFavorites(uid) - } - : (e) => { - e.preventDefault() - addToFavorites(uid) - } - } - > - {is_favourite ? ( - {'1'}

- ) : ( - {'1'}

- )} - - - - - - - ) -} @@ -1,98 +0,0 @@ -import * as React from 'react' -import Box from '@mui/material/Box' -import CardContent from '@mui/material/CardContent' -import CardMedia from '@mui/material/CardMedia' -import Stack from '@mui/material/Stack' -import Typography from '@mui/material/Typography' - -import { translateTypeModel } from '#/shared' -import { Device } from '#/shared/lib/types/entities' - -export const UnActiveCard: React.FC = ({ title, image_link, languages, description, model_config, device }) => { - const desktop = device === 'desktop' - - return ( - - - - - - - {translateTypeModel(model_config.model_type)} - - - - - {title} - - - {description} - - - - - - - ) -} @@ -1,2 +0,0 @@ -export { Card } from './ui/card' -export { UnActiveCard } from './ui/un-active-card' @@ -1,7 +1,7 @@ import { c } from '#/shared/lib/helpers' import { FieldError } from 'react-hook-form' import styles from './common-input.module.scss' -import React, { ForwardedRef, forwardRef, useEffect } from 'react' +import React, { forwardRef } from 'react' export type InputVariant = 'outline' | 'primary' @@ -1,5 +1,5 @@ import React, { useEffect } from 'react' -import { DateTimePicker, LocalizationProvider } from '@mui/x-date-pickers' +import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers' import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs' import dayjs, { Dayjs } from 'dayjs' @@ -19,16 +19,17 @@ export const DateInput = ({ useEffect(() => { if (date) { - setDate(new Date().toISOString().split('T')[0]) + setDate(dayjs().format('YYYY-MM-DD')) } if (prevdate) { - setDate(dayjs(new Date().toISOString()).add(-1, 'year').format('YYYY-DD-MM')) + setDate(dayjs().subtract(1, 'year').format('YYYY-MM-DD')) } }, [date, prevdate]) return ( - { if (date?.isValid()) { - setDate(JSON.stringify(date).split('"')[1].split('T')[0]) + setDate(date.format('YYYY-MM-DD')) } }} - format='MM-DD-YYYY' + format='DD.MM.YYYY' views={['year', 'month', 'day']} /> @@ -1,70 +0,0 @@ -.expandableButton { - display: flex; - align-items: center; - justify-content: center; - background-color: white; - border-radius: 100px; - width: 40px; - height: 40px; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1); - transition: width 0.3s ease-in-out; - cursor: pointer; - position: relative; - - &:hover { - width: 140px; - padding: 12px; - - .expandableButton__icon { - opacity: 0; - display: none; - } - - .expandableButton__text { - opacity: 1; - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - animation: fadein 0.6s ease-in-out; - display: block; - } - } - - &__icon { - color: var(--air-color); - display: flex; - align-items: center; - justify-content: center; - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - font-weight: 600; - font-size: 14px; - transition: opacity 0.3s ease-in-out; - } - - &__text { - position: absolute; - color: var(--air-color); - font-weight: 500; - font-size: 14px; - opacity: 0; - display: none; - min-width: max-content !important; - white-space: nowrap; - } -} - -@keyframes fadein { - 0% { - opacity: 0; - } - 50% { - opacity: 0; - } - 100% { - opacity: 1; - } -} @@ -1,46 +0,0 @@ -import React from 'react' -import Link from 'next/link' - -import styles from './expandable-button.module.scss' - -interface ExpandableButtonProps { - shortText: string - expandedText: string - href?: string - onClick?: () => void - className?: string -} - -export function ExpandableButton({ - shortText, - expandedText, - href, - onClick, - className -}: ExpandableButtonProps) { - const buttonContent = ( - <> -

- {shortText} -

- {expandedText} - - ) - - if (href) { - return ( - - {buttonContent} - - ) - } - - return ( -

- {buttonContent} -

- ) -} @@ -1 +0,0 @@ -export { ExpandableButton } from './expandable-button' @@ -1,4 +1,3 @@ -import Link from 'next/link' import { CommonButton } from '../../button' import styles from './info-page-template.module.scss' import Image from 'next/image' @@ -1,188 +0,0 @@ -import React, { FC, useMemo, useRef } from 'react' -import { Box, InputAdornment, TextField, Typography } from '@mui/material' -import CircularProgress from '@mui/material/CircularProgress' -import IconButton from '@mui/material/IconButton' -import Stack from '@mui/material/Stack' -import { TextFieldProps } from '@mui/material/TextField/TextField' -import Image from 'next/image' - -import { Calculation } from '#/features/calculation-tokens-gpt' -import { styleInputWithoutBorderFocus } from '#/shared/ui/input' - -interface Input { - loading: boolean - requestImage: () => void - wonderMe?: () => void - desktop: boolean - image?: File | null - count?: number - quality?: string - unpinImage?: () => void - imageLoad?: React.ChangeEventHandler - openFilters: (event: React.MouseEvent) => void -} -export const InputImagesModels: FC = ({ - openFilters, - loading, - requestImage, - value, - image, - onChange, - wonderMe, - desktop, - count, - quality, - imageLoad, - unpinImage, -}) => { - - const isCalculatePrice = useMemo(() => quality && count && desktop, []) - - const ref = useRef(null) - - const LoadImage = () => { - if (!imageLoad || loading) { - return null - } - - if (image) { - return ( - - - {`Изображение ${image.name.slice(0, 9)} загружено! Нажмите чтобы открепить.`} - - - ) - } - - return ( - <> - -

(ref.current! as any).click()} - height={23} - width={23} - alt='Загрузка изображения' - className='pointer' - /> - - ) - } - - const WonderMe = () => { - if (!wonderMe || !desktop) { - return null - } - - return

- } - - const SendBtn = () => { - if (loading) { - return ( - - ) - } - - const src = `/svg/chatgpt/send_message_dark.svg` - - return ( - {'Отправить

- ) - } - - return ( - { - if (e.key === 'Enter') { - requestImage() - } - }} - InputLabelProps={{ - style: { - color: '#868686', - lineHeight: '21px', - fontSize: '15px', - fontWeight: '400px', - borderRadius: '13px', - }, - }} - value={value} - onChange={onChange} - InputProps={{ - endAdornment: ( - - - {!desktop && ( - - Error

- - )} - - - - - - ), - }} - /> - ) -} @@ -1,3 +1,7 @@ +.searchIcon { + margin-right: 15px; +} + .search { div { border-radius: 15px; @@ -14,7 +14,7 @@ export const Search = (props: TextFieldProps) => { {...props} InputProps={{ endAdornment: ( -

), }} /> @@ -0,0 +1,3 @@ +.sliderFullWidth { + width: 100%; +} @@ -2,7 +2,9 @@ import React from 'react' import { Typography } from '@mui/material' import Box from '@mui/material/Box' -import { PrettoSliderDark } from '#/widgets/filters-gpt/ui/filters' +import { PrettoSliderDark } from '#/widgets/filters-gpt/ui/pretto-slider' + +import styles from './slider.module.scss' export const Slider = ({ value, @@ -38,10 +40,10 @@ 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 - isAgreeError?: boolean - register?: UseFormRegister - name?: string - isEmailWhite: boolean -} - -export const CheckBoxAgreeWithRules: React.FC = ({ - isAgree, - changeAgree, - isAgreeError, - name, - register, - isEmailWhite, -}) => { - return ( - <> - - - - {' '} - Я соглашаюсь с условиями{' '} - - Политики обработки персональных данных - {' '} - и{' '} - - Публичной офертой - - - - {isAgreeError && ( - - Для продолжения примите соглашение - - )} - - ) -} @@ -1,235 +0,0 @@ -import * as React from 'react' -import { Box, Slider, Stack, Typography } from '@mui/material' -import Checkbox, { checkboxClasses } from '@mui/material/Checkbox' -import FormControlLabel from '@mui/material/FormControlLabel' -import FormGroup from '@mui/material/FormGroup' -import Menu from '@mui/material/Menu' -import MenuItem from '@mui/material/MenuItem' - - -interface IDalleFilterMenu { - anchorEl: null | HTMLElement - open: boolean - closeMenu: Function - format: string - changeFormat: Function - numberImages: number | number[] | undefined - sliderChange: Function -} - -export const DalleFilterMenu: React.FC = ({ - anchorEl, - closeMenu, - format, - changeFormat, - numberImages, - sliderChange, - open, -}) => { - return ( - closeMenu()} - MenuListProps={{ 'aria-labelledby': 'dalle-filter-button' }} - PaperProps={{ - sx: { - backgroundColor: '#151518', - }, - }} - > - - - - Формат - - - - - changeFormat('256x256')} - inputProps={{ - 'aria-label': 'controlled', - }} - sx={{ - [`&, &.${checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - [`&, &.${!checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - marginLeft: 2.5, - marginRight: 1, - width: '1em', - height: '1em', - }} - /> - } - label={ - - 256x256 - - } - /> - - - - - changeFormat('512x512')} - inputProps={{ - 'aria-label': 'controlled', - }} - sx={{ - [`&, &.${checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - [`&, &.${!checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - marginLeft: 2.5, - marginRight: 1, - width: '1em', - height: '1em', - }} - /> - } - label={ - - 512x512 - - } - /> - - - - - changeFormat('1024x1024')} - inputProps={{ - 'aria-label': 'controlled', - }} - sx={{ - [`&, &.${checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - [`&, &.${!checkboxClasses.checked}`]: { - color: '#7F7DF3', - }, - marginLeft: 2.5, - marginRight: 1, - width: '1em', - height: '1em', - }} - /> - } - label={ - - 1024x1024 - - } - /> - - - - - - Изображений - - - {numberImages} - - - - - - За одну генерацию - - - - sliderChange(e, current)} - max={10} - min={1} - step={1} - marks - sx={{ - width: '15vh', - color: '#7F7DF3', - marginLeft: 1, - marginRight: 1, - }} - /> - - - - ) -} @@ -10,6 +10,7 @@ type DrawerProps = { export function DrawerCustom(props: DrawerProps) { return ( void } const ErrorIcon = () => { - return {''}

+ return

} export const Error: React.FC = ({ handleClose }) => { @@ -23,10 +25,7 @@ export const Error: React.FC = ({ handleClose }) => { return ( void; filetrs: React.ReactNode }) { - const isDesktop = useMediaQuery('(min-width: 1025px)') - - if (isDesktop) { - return ( - - {props.filetrs} - - ) - } - - return ( - props.onClose(false)}> - - {props.filetrs} - - - ) -} @@ -1,5 +1,5 @@ import React from 'react' -import { RegisterOptions } from 'react-hook-form/dist/types/validator' +import { RegisterOptions } from 'react-hook-form' import { TextField } from '@mui/material' import { TextFieldProps } from '@mui/material/TextField/TextField' @@ -1,51 +0,0 @@ -import React from 'react' -import { Card, CardMedia } from '@mui/material' -import Stack from '@mui/material/Stack' -import Typography from '@mui/material/Typography' -import { getRandomImage } from '../lib/helpers' - - -export const RandomImage = () => { - const refImage = React.useRef(getRandomImage()) - - return ( - - - - - Midjourney - - - by honeynek - - - - - ) -} @@ -0,0 +1,3 @@ +.selectTransparent { + background-color: transparent; +} @@ -4,6 +4,8 @@ import { MenuItem, Select, SelectChangeEvent, Stack, Typography } from '@mui/mat import { baseColor } from '#/shared/lib/constants/colors' +import styles from './select.module.scss' + interface ISelect { value: any onChange: (e: SelectChangeEvent) => void @@ -43,9 +45,7 @@ export const SelectUI: React.FC = ({ }, }, }} - style={{ - backgroundColor: 'transparent', - }} + className={styles.selectTransparent} sx={{ boxShadow: 'none', borderRadius: '13px', @@ -1,33 +0,0 @@ -import { Box, Typography } from '@mui/material' -import Image from 'next/image' -import Link from 'next/link' - -export const TelegramBlock = () => { - return ( - - -

- - Бесплатные токены - - - Получите 5 токенов за подписку на наш телеграм канал! - - - - Подписаться - - - - - ) -} @@ -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 = () => { { useEffect(() => { if (Object.keys(query).length === 0) addQueryParams('setting') }, []) - const changePassword = async () => { - if (!data) return - if (newPassword1 !== newPassword2) { - showMessage('Укажите одинаковые новы пароли!') - return - } - const status = await accountApi.changePassword(data.access, newPassword1, newPassword2, currentPassword) - - if (Number(status) === 200) { - showMessage('Пароль успешно изменён!') - setNewPassword1('') - setNewPassword2('') - setCurrentPassword('') - setTimeout(() => setSuccess(''), 6000) - return - } - - showMessage('К сожалению, произошла ошибка') - } + if (!data) return + if (newPassword1 !== newPassword2) { + showMessage('Укажите одинаковые новые пароли!', 'error') + return + } + + { + const response = await accountApi.changePassword(data.access, newPassword1, newPassword2, currentPassword) + + if (response.status === 200) { + showMessage('Пароль успешно изменён!', 'success') + setNewPassword1('') + setNewPassword2('') + setCurrentPassword('') + setTimeout(() => setSuccess(''), 6000) + return + } + + showMessage(response.data.detail) + } +} function body() { if (type === 'regular') { @@ -231,7 +235,7 @@ const Account: NextPageWithLayout = () => { { headers: { Authorization: `Bearer ${data.access}` } } ) - showMessage('Данные успешно изменены!') + showMessage('Данные успешно изменены!', 'success') dispatch(getAllInfo(data.access)) } catch (e) {} } @@ -275,7 +279,7 @@ const Account: NextPageWithLayout = () => { alignItems='flex-start' spacing={2} sx={{ - width: desktop ? '90%' : '100%', + width: desktop ? (scope === 'referral' ? '97%' : '90%') : '100%', height: '100%', }} > @@ -323,7 +327,7 @@ const Account: NextPageWithLayout = () => { @@ -457,7 +461,7 @@ const Account: NextPageWithLayout = () => { onClick={changePassword} sx={{ marginTop: '20px' }} text={'Изменить пароль'} - style={{ width: '150px' }} + className={accountStyles.changePasswordButton} /> @@ -470,11 +474,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,10 +4,14 @@ 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 { useShowDataStore } from '#/shared/lib/hooks/use-show-data' import { InputStyleSmallDark } from '#/shared/ui/input' import axios from 'axios' +const isValidLimit = (value: string) => value === '' || /^[1-9]\d*$/.test(value) + export type KeyItemBaseProps = { keyValue: string name: string @@ -32,6 +36,7 @@ export const KeyItem: React.FC = ({ children, limit: initialLimit, const [isCopy, setIsCopy] = useState(false) const [limit, setLimit] = useState(initialLimit) const { data: session } = useSession() + const { showMessage } = useShowDataStore() useEffect(() => { setLimit(initialLimit) @@ -72,6 +77,10 @@ export const KeyItem: React.FC = ({ children, limit: initialLimit, }, [initialLimit, limit, name, session?.access]) const handleLimitChange = (value: string) => { + if (!isValidLimit(value)) { + showMessage('Укажите целое число больше нуля') + return + } setLimit(value) } @@ -127,7 +136,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 +332,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 && (

{ }} >

Спасибо!

Ваше сообщение направлено нашим специалистам. Ответ придет на почту, указанную при регистрации

- ) : ( -

Запрос для компаний и партнеров

- - Опишите ваш сценарий — подберем решение и ответим за день. Работаем для корпораций, агентств и интеграторов - - - setAutocompleteOpen(true)} - onClose={() => setAutocompleteOpen(false)} - /> - - setErrorMessage(evt.target.value)} - buttomSlot={ - <> - - - } - /> - {file && ( -

- -

- {file.name} - {(file.size / 1024).toFixed(1)} KB -

- - -

- )} -

- - Отправить - - - Отмена - -

- )} - - ) -} - -export default BusinessReportsMobile @@ -151,4 +151,12 @@ &__fileInfo svg { color: rgba(245, 245, 247, 0.85); } +} + +.fileInputHidden { + display: none; +} + +.fileInputLabel { + cursor: pointer; } \ No newline at end of file @@ -37,10 +37,10 @@ const ReportsMobile: NextPageWithLayout = () => { onChange={handleFileChange} type='file' accept='.jpg,.jpeg,.png' - style={{ display: 'none' }} + className={styles.fileInputHidden} id='report-file-input' /> - + @@ -0,0 +1,7 @@ +.closeLink { + position: absolute; + top: 45px; + right: 7%; + cursor: pointer; + font-size: 17px; +} @@ -5,12 +5,14 @@ import Button from '@mui/material/Button' import axios from 'axios' import Image from 'next/image' import Router from 'next/router' -import { Error, Input } from '#/shared' +import { Input } from '#/shared' import { getApiUrl } from '#/shared/lib/constants' import { getDeviceType, getRandomImage } from '#/shared/lib/helpers' import { NextPageWithLayout } from '#/pages/_app' import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' +import styles from './reset.module.scss' + const Reset: NextPageWithLayout = () => { const device = getDeviceType() @@ -120,16 +122,7 @@ const Reset: NextPageWithLayout = () => { set_Email(event.target.value)} type={'email'} fullWidth /> - + {''}

@@ -56,7 +56,7 @@ export const CurrentPlanAndBalance = ({ return ( - + { + const { showMessage } = useShowDataStore() + + const copyEmail = useCallback(async () => { + try { + await navigator.clipboard.writeText(contactEmail) + showMessage('Почта скопирована', 'success') + } catch { + showMessage('Не удалось скопировать', 'error') + } + }, [contactEmail, showMessage]) + + return ( + +

+ +

У вас указана индивидуальная подписка!

+ По вопросам платежей, тарификации или отключения индивидуальной подписки обращайтесь по адресу —{' '} + + + + +

+ + + Написать на почту + + + + + ) +} @@ -12,6 +12,7 @@ import { balanceSelector } from '#/shared/lib/selectors' import { IFeatures, IOffer } from '../api' import { CurrentPlanAndBalance } from './current-plan-and-balance' +import { IndividualSubscriptionNotice } from './individual-subscription-notice' import { FaqSection } from './faq-section' import { FeaturesSection } from './features-section' import { PlansSection } from './plans-section' @@ -87,6 +88,29 @@ export const SubscriptionRecurrentPage = () => { const planTokensFormatted = commaSeparated(Math.round(Number(planTokenLimit) || 0)) + if (isIndividual) { + return ( + + + Подписка + + + + + + + + + ) + } + return ( @@ -27,6 +27,14 @@ flex: 1; border-radius: 15px; + &_hidden { + display: none; + } + + &_corporate { + display: block; + } + .subTitle { font-weight: 600; font-style: Semi Bold; @@ -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; @@ -262,23 +262,15 @@ const VideoModelPage: NextPageWithLayout = () => { ) : (

{ 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 ? ( () const [toDate, setToDate] = useState('') const { data } = useSession() - const { message, isOpened } = useShowDataStore() + const { showMessage } = useShowDataStore() useEffect(() => { getPersons(data?.access, true).then((res) => setSecurityList(res ? res?.reverse() : null)) @@ -65,6 +65,10 @@ export default function BusinessHost() { } const download = () => { + if (dayjs(fromDate).isAfter(toDate) || dayjs(toDate).isAfter(dayjs())) { + showMessage('Указаны неверные даты') + return + } axios.get(getApiUrl() + `/auth/business-host/download-expenses?type=employees&from_date=${fromDate}&to_date=${toDate}`, { responseType: 'arraybuffer', headers: { Authorization: `Bearer ${data?.access}` }, @@ -95,12 +95,16 @@ color: var(--text-color-additional-two); } } - .titleModalLimit:global { + .titleModalLimit { border: 1px solid red; margin-bottom: 10px; } } +.emailAccent { + color: #7f7df3; +} + .logsList { margin-top: 15px; display: flex; @@ -7,11 +7,12 @@ import TableCell from '@mui/material/TableCell' import TableContainer from '@mui/material/TableContainer' import TableHead from '@mui/material/TableHead' import TableRow from '@mui/material/TableRow' -import { Dayjs } from 'dayjs' +import dayjs, { Dayjs } from 'dayjs' import { useSession } from 'next-auth/react' import { ResponseGetLogsList } from '#/features/invite-person-in-business/model/types' import { Search } from '#/shared' +import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' import { DateInput } from '#/shared/ui/date-input/date-input' import styles from '#/widgets/business-models/ui/models-list/models-list.module.scss' import { getLogsList } from '#/widgets/business-persons/api/get-logsList' @@ -29,8 +30,13 @@ export const LogList = () => { const [showPersons, setShowPersons] = useState(true) const [search, setSearch] = useState('') const { data } = useSession() + const { showMessage } = useShowDataStore() useEffect(() => { + if (fromDate && toDate && (dayjs(fromDate).isAfter(toDate) || dayjs(toDate).isAfter(dayjs()))) { + showMessage('Указаны неверные даты') + return + } getLogsList(offset, 20, logType, fromDate, toDate, data?.access).then((res) => setLogs(res ? res : null)) }, [data?.access, logType, fromDate, toDate]) @@ -107,7 +107,7 @@ color: var(--text-color-additional-two); } } - .titleModalLimit:global { + .titleModalLimit { border: 1px solid red; margin-bottom: 10px; } @@ -21,7 +21,7 @@ import { getPersons } from '#/widgets/business-persons/api/get-persons' import ArrowUpOrDown from '#/widgets/top-bar-model/ui/arrow-up-or-down' import { translateEmailStatus, formatDateStatus, formatEmail } from '../../lib/lib' -import { getModalById, PLATE_CHANGE_PASSWORD, RESEND_INVATION_PASSWORD } from '#/features/modals' +import { getModalById, PLATE_CHANGE_PASSWORD } from '#/features/modals' import { ResponseGetBusinessGroups } from '#/features/invite-person-in-business/model/types' import { useShowDataStore } from '#/shared/lib/hooks/use-show-data' import { resendInvation } from '#/features/resend-invation-corp/api/resend-invation' @@ -43,7 +43,6 @@ export const PersonsList = ({ const { data: session } = useSession() const passChangeModal = getModalById(PLATE_CHANGE_PASSWORD) - const passResendModal = getModalById(RESEND_INVATION_PASSWORD) useEffect(() => { setPersons(personsList) @@ -79,7 +78,7 @@ export const PersonsList = ({ }) ) setCurrentPerson(null) - showMessage(`Лимит пользователя ${email} успешно изменён!`, 'success') + showMessage(`Данные сотрудника ${email} изменены!`, 'success') } const handleOpenResendModal = async (email: string) => { @@ -1,6 +1,6 @@ import React, { FC, useEffect, useState } from 'react' import { useForm } from 'react-hook-form' -import { SubmitErrorHandler } from 'react-hook-form/dist/types/form' +import { SubmitErrorHandler } from 'react-hook-form' import { Box, TextField, Typography } from '@mui/material' import Paper from '@mui/material/Paper' import Table from '@mui/material/Table' @@ -9,7 +9,6 @@ import TableCell from '@mui/material/TableCell' import TableContainer from '@mui/material/TableContainer' import TableHead from '@mui/material/TableHead' import TableRow from '@mui/material/TableRow' -import axios, { AxiosResponse } from 'axios' import Image from 'next/image' import { useSession } from 'next-auth/react' @@ -35,10 +34,10 @@ import { Select, } from '#/shared' import { Search } from '#/shared' -// import styles from '#/widgets/business-models/ui/models-list/models-list.module.scss' import { getBusinessGroups } from '#/widgets/business-persons/api/get-businessGroups' import ArrowUpOrDown from '#/widgets/top-bar-model/ui/arrow-up-or-down' -import { getModalById, PLATE_CHANGE_PASSWORD, RESEND_INVATION_PASSWORD } from '#/features/modals' +import { getModalById, PLATE_CHANGE_PASSWORD } from '#/features/modals' +import { resendInvation } from '#/features/resend-invation-corp/api/resend-invation' import { formatDateStatus, formatEmail, translateEmailStatus } from '../../lib/lib' import { XMark } from '#/features/remove-person' @@ -59,7 +58,6 @@ export const SecurityList = ({ const [currentPerson, setCurrentPerson] = useState(null) const passChangeModal = getModalById(PLATE_CHANGE_PASSWORD) - const passResendModal = getModalById(RESEND_INVATION_PASSWORD) useEffect(() => { setPersons(securityList) @@ -82,7 +80,25 @@ export const SecurityList = ({ const [showPersons, setShowPersons] = useState(true) const { showMessage } = useShowDataStore() - const { data } = useSession() + const { data: session } = useSession() + + const handleResendInvation = async (email: string) => { + const response = await resendInvation(email, session?.access) + + if (response.status == 200) { + showMessage('Приглашение переотправлено!', 'success') + setPersons((prev) => + prev?.map((el) => { + if (el.email === email) { + return { ...el, acceptance_status: 'pending' as const } + } + return el + }) ?? null + ) + } else { + showMessage(response.data) + } + } const updateLimit = (limit: string, email?: string) => { setPersons((prev) => @@ -96,7 +112,7 @@ export const SecurityList = ({ }) ) setCurrentPerson(null) - showMessage(`Лимит пользователя ${email} успешно изменён!`, 'success') + showMessage(`Данные сотрудника ${email} изменены!`, 'success') } useEffect(() => { @@ -179,13 +195,7 @@ export const SecurityList = ({ {statusPerson === 'Приглашен' ? ( - {showConfigure && ( - <> - - changeTopP(e, current)} - max={1} - min={0} - step={0.1} - aria-label='pretto slider' - /> - - - changePresence(e, current)} - max={2} - min={-2} - step={0.1} - aria-label='pretto slider' - /> - - - )} - - Сбросить настройки - - - - ) : ( - - )} - - ) - } -) - -Filters.displayName = 'Filters' @@ -0,0 +1,51 @@ +import { Slider } from '@mui/material' +import { styled } from '@mui/material/styles' + +export const PrettoSlider = styled(Slider)({ + width: '90%', + color: '#EFF0F2', + height: 5, + '& .MuiSlider-track': { + border: 'none', + backgroundColor: '#EFF0F', + }, + '.MuiSlider-rail': { + border: 'none', + backgroundColor: '#EFF0F', + }, + '& .MuiSlider-thumb': { + height: 17, + width: 17, + backgroundColor: '#fff', + border: '2px solid #7F7DF3', + '&:focus, &:hover, &.Mui-active, &.Mui-focusVisible': { + boxShadow: 'inherit', + }, + '&:before': { + display: 'none', + }, + }, +}) + +export const PrettoSliderDark = styled(Slider)({ + width: '90%', + height: 5, + '& .MuiSlider-track': { + border: 'none', + backgroundColor: '#40404E', + }, + '.MuiSlider-rail': { + border: 'none', + backgroundColor: '#40404E', + }, + '& .MuiSlider-thumb': { + height: 17, + width: 17, + backgroundColor: '#373737', + border: '2px solid #7F7DF3', + '&:focus, &:hover, &.Mui-active, &.Mui-focusVisible': {}, + '&:before': { + display: 'none', + }, + }, +}) @@ -1 +1,4 @@ -export { Filters } from './ui/filters' +export { typeModels } from './lib/constants' +export type { TypeModelGPT } from './lib/constants' +export { PrettoSlider, PrettoSliderDark } from './ui/pretto-slider' +export { default as TooltipModelTypes } from './ui/tooltip-model-types' @@ -1,6 +0,0 @@ -export enum GeneratingModel { - 'stable-diffusion-v1-6', - 'stable-diffusion-xl-1024-v1-0', - 'sd3', - 'sd3-turbo', -} @@ -1,52 +0,0 @@ -import { IProps } from '#/shared/lib/types/entities' -import { Styles } from '#/widgets/filters-sd/ui/filters' - -export type TImageFormat = '512x512' | '640x384' | '384x640' | '768x512' | '512x768' | '1024x1024' -export type TClipGuidancePresets = - | 'FAST_BLUE' - | 'FAST_GREEN' - | 'Без фильтров' - | 'SIMPLE' - | 'SLOW' - | 'SLOWER' - | 'SLOWEST' -export type TSamplerTypes = - | 'DDIM' - | 'DDPM' - | 'K_DPMPP_2M' - | 'K_DPMPP_2S_ANCESTRAL' - | 'K_DPM_2' - | 'K_DPM_2_ANCESTRAL' - | 'K_EULER' - | 'K_EULER_ANCESTRAL' - | 'K_HEUN' - | 'K_LMS' - -export type TGeneratingModel = 'stable-diffusion-v1-6' | 'stable-diffusion-xl-1024-v1-0' | 'sd3' | 'sd3-turbo' - -export interface ISDFilters extends IProps { - formatImage: TImageFormat - stepsImage: number | string | Array - numberImages: number | number[] | undefined - sampleType: TSamplerTypes - samplerTypes: TSamplerTypes[] - cfgScale: number | string | Array - clipGuidancePreset: TClipGuidancePresets - clipGuidancePresets: TClipGuidancePresets[] - formatImages: TImageFormat[] - generatingModel: TGeneratingModel - isTranslate: boolean - style: Styles - - changeFormatImage: (e: TImageFormat) => void - changeClipGuidancePreset: (e: TClipGuidancePresets) => void - changeSampleType: (e: TSamplerTypes) => void - changeStepsImage: (e: Event, current: number | number[]) => void - changeNumberImage: (e: Event, current: number | number[]) => void - changeCfgScale: (e: Event, current: number | number[]) => void - changeGeneratingModel: (e: TGeneratingModel) => void - changeIsTranslate: () => void - changeStyle: (e: Styles) => void - - resetSettings: () => void -} @@ -1,207 +0,0 @@ -import React, { useState } from 'react' -import SettingsSuggestIcon from '@mui/icons-material/SettingsSuggest' -import { Box, Button, Drawer, Stack, Typography } from '@mui/material' - -import { Select, SwitchCustom } from '#/shared' -import { Slider } from '#/shared' -import { SelectUI } from '#/shared/ui/select' -import { PrettoSlider, PrettoSliderDark } from '#/widgets/filters-gpt/ui/filters' -import { GeneratingModel } from '#/widgets/filters-sd/lib/constants' -import { - ISDFilters, - TClipGuidancePresets, - TGeneratingModel, - TImageFormat, - TSamplerTypes, -} from '#/widgets/filters-sd/lib/types' -import { Styles, styles } from '#/widgets/filters-sd/ui/filters' - -interface ISDFiltersMobile extends ISDFilters { - isOpenDrawer: boolean - onCloseDrawer: () => void -} - -export const FiltersMobile: React.FC = ({ - stepsImage, - numberImages, - formatImage, - cfgScale, - clipGuidancePreset, - sampleType, - formatImages, - changeFormatImage, - changeClipGuidancePreset, - clipGuidancePresets, - samplerTypes, - changeSampleType, - changeStepsImage, - changeNumberImage, - changeCfgScale, - resetSettings, - onCloseDrawer, - isOpenDrawer, - isTranslate, - changeIsTranslate, - style, - changeStyle, - generatingModel, - changeGeneratingModel, -}) => { - const [showConfigure, setShowConfigure] = useState(false) - - return ( - - - - - changeClipGuidancePreset(e.target.value as TClipGuidancePresets) - } - list={clipGuidancePresets} - /> - - - -