diff --git a/src/app/[locale]/(core)/meditation/[id]/result/[resultId]/page.module.scss b/src/app/[locale]/(core)/meditation/[id]/result/[resultId]/page.module.scss index 245bcc2..73ed5b8 100644 --- a/src/app/[locale]/(core)/meditation/[id]/result/[resultId]/page.module.scss +++ b/src/app/[locale]/(core)/meditation/[id]/result/[resultId]/page.module.scss @@ -5,7 +5,8 @@ background-color: #000; position: absolute; overflow: hidden; + overflow-y: auto; left: 0; top: 56px; - padding: 16px 16px 64px; + padding: 16px 16px 220px; } diff --git a/src/components/domains/chat/ChatHeader/ChatHeader.module.scss b/src/components/domains/chat/ChatHeader/ChatHeader.module.scss index e32de2b..5ef5bdc 100644 --- a/src/components/domains/chat/ChatHeader/ChatHeader.module.scss +++ b/src/components/domains/chat/ChatHeader/ChatHeader.module.scss @@ -20,9 +20,12 @@ gap: 4px; cursor: pointer; - & > .badge { + & > .badge.badge { background-color: #fbbf24; - width: 24px; + min-width: 24px; + min-height: 24px; + max-width: 28px; + max-height: 28px; } } diff --git a/src/components/domains/chat/ChatHeader/ChatHeader.tsx b/src/components/domains/chat/ChatHeader/ChatHeader.tsx index 5a65eac..4cb8074 100644 --- a/src/components/domains/chat/ChatHeader/ChatHeader.tsx +++ b/src/components/domains/chat/ChatHeader/ChatHeader.tsx @@ -1,7 +1,6 @@ "use client"; import { use, useEffect, useState } from "react"; -import Image from "next/image"; import { useRouter } from "next/navigation"; import { useTranslations } from "next-intl"; @@ -11,6 +10,7 @@ import { IconName, OnlineIndicator, Typography, + UserAvatar, } from "@/components/ui"; import { revalidateChatsPage } from "@/entities/chats/actions"; import { IGetChatsListResponse } from "@/entities/chats/types"; @@ -60,19 +60,16 @@ export default function ChatHeader({ chatsPromise }: ChatHeaderProps) { {!!totalUnreadCount && ( - {totalUnreadCount} + {totalUnreadCount > 99 ? "99+" : totalUnreadCount} )}
{!!currentChat?.assistantAvatar ? ( - Aaron (Taro) avatar ) : (
diff --git a/src/components/domains/dashboard/sections/AdvisersSection/AdvisersSection.tsx b/src/components/domains/dashboard/sections/AdvisersSection/AdvisersSection.tsx index 1f95f79..b8747c5 100644 --- a/src/components/domains/dashboard/sections/AdvisersSection/AdvisersSection.tsx +++ b/src/components/domains/dashboard/sections/AdvisersSection/AdvisersSection.tsx @@ -19,6 +19,11 @@ const getChatByAssistantId = (assistantId: string, chats: IChat[]) => { return chats.find(chat => chat.assistantId === assistantId) || null; }; +const getOptimalColumns = (count: number) => { + if (count <= 6) return count; + return Math.ceil(count / 2); +}; + export default function AdvisersSection({ promiseAssistants, promiseChats, @@ -26,7 +31,7 @@ export default function AdvisersSection({ }: AdvisersSectionProps) { const assistants = use(promiseAssistants); const chats = use(promiseChats); - const columns = Math.ceil(assistants?.length / 2); + const columns = getOptimalColumns(assistants?.length || 0); return (
diff --git a/src/components/domains/profile/Billing/Billing.tsx b/src/components/domains/profile/Billing/Billing.tsx index 2d19e8e..99ff2ca 100644 --- a/src/components/domains/profile/Billing/Billing.tsx +++ b/src/components/domains/profile/Billing/Billing.tsx @@ -32,7 +32,10 @@ function Billing() {
{t("credits.title", { - credits: isLoading || roundedBalance === null ? "..." : String(roundedBalance), + credits: + isLoading || roundedBalance === null + ? "..." + : String(roundedBalance), })} .badge.badge { + min-width: 16px; + min-height: 16px; + max-width: 18px; + max-height: 18px; + border: 1px solid #fff; + position: absolute; + top: -1px; + right: -1px; + + & > .badgeContent { + display: block; + font-size: 10px; + } + } +} diff --git a/src/components/layout/Header/Header.tsx b/src/components/layout/Header/Header.tsx index 25940c8..1aa5253 100644 --- a/src/components/layout/Header/Header.tsx +++ b/src/components/layout/Header/Header.tsx @@ -4,7 +4,7 @@ import { use } from "react"; import Link from "next/link"; import clsx from "clsx"; -import { Button, Icon, IconName } from "@/components/ui"; +import { Badge, Button, Icon, IconName, Typography } from "@/components/ui"; import { IGetChatsListResponse } from "@/entities/chats/types"; import { useChatsSocket } from "@/hooks/chats/useChatsSocket"; import { ROUTES } from "@/shared/constants/client-routes"; @@ -34,7 +34,21 @@ export default function Header({ className, chatsPromise }: HeaderProps) {
- + + + + {totalUnreadCount > 99 ? "99+" : totalUnreadCount} + + +
diff --git a/src/components/layout/NavigationBar/NavigationBar.module.scss b/src/components/layout/NavigationBar/NavigationBar.module.scss index d372f40..d2b90cb 100644 --- a/src/components/layout/NavigationBar/NavigationBar.module.scss +++ b/src/components/layout/NavigationBar/NavigationBar.module.scss @@ -27,6 +27,15 @@ position: absolute; bottom: 7px; left: 17px; + + min-width: 20px; + min-height: 20px; + max-width: 26px; + max-height: 26px; + + & > .badgeContent { + display: block; + } } & > .label { diff --git a/src/components/layout/NavigationBar/NavigationBar.tsx b/src/components/layout/NavigationBar/NavigationBar.tsx index f13a166..eb3639d 100644 --- a/src/components/layout/NavigationBar/NavigationBar.tsx +++ b/src/components/layout/NavigationBar/NavigationBar.tsx @@ -50,8 +50,13 @@ export default function NavigationBar({ chatsPromise }: NavigationBarProps) { {!!badge && ( - - {badge} + + {badge > 99 ? "99+" : badge} )} diff --git a/src/components/ui/Icon/icons/Notification.tsx b/src/components/ui/Icon/icons/Notification.tsx index d804543..52b6ab8 100644 --- a/src/components/ui/Icon/icons/Notification.tsx +++ b/src/components/ui/Icon/icons/Notification.tsx @@ -18,7 +18,7 @@ export default function NotificationIcon(props: SVGProps) { /> - @@ -28,7 +28,8 @@ export default function NotificationIcon(props: SVGProps) { /> {props.children} - + */} + {props.children} @@ -31,8 +33,17 @@ export default function UserAvatar({ className={styles.avatar} width={sizes[size]} height={sizes[size]} + style={{ + width: sizes[size], + height: sizes[size], + }} /> - + {isOnlineIndicator && isOnline !== undefined && ( + + )}
); } diff --git a/src/components/widgets/ChatItem/ChatItem.module.scss b/src/components/widgets/ChatItem/ChatItem.module.scss index 3bde80b..eb7f84f 100644 --- a/src/components/widgets/ChatItem/ChatItem.module.scss +++ b/src/components/widgets/ChatItem/ChatItem.module.scss @@ -35,9 +35,17 @@ line-height: 20px; } - & > .badge { - width: 24px; + & > .badge.badge { + min-width: 24px; + min-height: 24px; + max-width: 28px; + max-height: 28px; background-color: #fbbf24; + + & > .badgeContent { + display: block; + min-width: 16px; + } } } } diff --git a/src/components/widgets/ChatItem/ChatItem.tsx b/src/components/widgets/ChatItem/ChatItem.tsx index 77f9eaf..0f2cf61 100644 --- a/src/components/widgets/ChatItem/ChatItem.tsx +++ b/src/components/widgets/ChatItem/ChatItem.tsx @@ -19,7 +19,7 @@ export interface ChatItemProps { name: string; messagePreiew: LastMessagePreviewProps | null; time: string | null; - badgeContent: React.ReactNode; + badgeContent: number; className?: string; style?: React.CSSProperties; onClick?: () => void; @@ -53,8 +53,13 @@ export default function ChatItem({ {!!badgeContent && ( - - {badgeContent} + + {badgeContent > 99 ? "99+" : badgeContent} )} diff --git a/src/entities/balance/api.ts b/src/entities/balance/api.ts index adbc213..580eebd 100644 --- a/src/entities/balance/api.ts +++ b/src/entities/balance/api.ts @@ -25,9 +25,9 @@ export const getUserBalance = async (): Promise => { const response = await fetch(url.toString(), { method: "GET", headers: { - "Authorization": `Bearer ${accessToken}`, - "Content-Type": "application/json" - } + Authorization: `Bearer ${accessToken}`, + "Content-Type": "application/json", + }, }); if (!response.ok) { diff --git a/src/entities/dashboard/types.ts b/src/entities/dashboard/types.ts index a917b5e..d1a6806 100644 --- a/src/entities/dashboard/types.ts +++ b/src/entities/dashboard/types.ts @@ -17,6 +17,7 @@ export const AssistantSchema = z.object({ clientSource: z.string(), createdAt: z.string(), updatedAt: z.string(), + personality: z.string().optional(), }); export type Assistant = z.infer; diff --git a/src/hooks/balance/useUserBalance.ts b/src/hooks/balance/useUserBalance.ts index 48c36f5..41c54fe 100644 --- a/src/hooks/balance/useUserBalance.ts +++ b/src/hooks/balance/useUserBalance.ts @@ -16,7 +16,9 @@ export const useUserBalance = () => { const response = await getUserBalance(); setBalance(response.balance); } catch (err) { - setError(err instanceof Error ? err : new Error("Failed to fetch balance")); + setError( + err instanceof Error ? err : new Error("Failed to fetch balance") + ); // Используем devLogger или другой механизм логирования в продакшене if (process.env.NODE_ENV !== "production") { // eslint-disable-next-line no-console