chore: release v2.7.2

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@remnawave/frontend",
-  "version": "2.7.1",
+  "version": "2.7.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@remnawave/frontend",
-      "version": "2.7.1",
+      "version": "2.7.2",
       "license": "AGPL-3.0-only",
       "dependencies": {
         "@dnd-kit/core": "^6.3.1",

package.json

@@ -2,7 +2,7 @@
   "name": "@remnawave/frontend",
   "private": false,
   "type": "module",
-  "version": "2.7.1",
+  "version": "2.7.2",
   "license": "AGPL-3.0-only",
   "author": "REMNAWAVE <github.com/remnawave>",
   "homepage": "https://github.com/remnawave",

public/locales/ru/remnawave.json

@@ -781,7 +781,7 @@
             "requirements": "Условия",
             "warning-activity": "IP адрес будет показан, когда <highlight>Xray-Core</highlight> считает подключение <highlight>еще действительным</highlight>. Это может привести к отображению IP адресов, которые в настоящий момент не подключены. Используйте значок <highlight>часов</highlight> для отслеживания последней активности данного IP.",
             "warning-version": "Версия Remnawave Node <highlight>{{version}}</highlight> или выше",
-            "warning-docker": "Добавьте эти строки к <highlight>docker-compose.yml</highlight> Remnawave Node (/opt/remnanode)",
+            "warning-docker": "</highlight>Добавьте эти строки к <highlight>docker-compose.yml</highlight> Remnawave Node (/opt/remnanode)",
             "warning-patience": "Получение данных может занять некоторое время, не закрывайте это окно!",
             "warning-n-plus-one": "<highlight>Пожалуйста, обратите внимание</highlight>: данный запрос выполняет <highlight>N+1</highlight> операциий к gRPC API <highlight>Xray-Core</highlight> так как API не предоставляет методов для массового получения данных. <highlight>N</highlight> — количество пользователей онлайн на данной ноде.",
             "get-data": "Получить данные",
@@ -2044,7 +2044,7 @@
     },
     "torrent-blocker-reports-table": {
         "widget": {
-            "truncate-reports": "Репорты по убыванию",
+            "truncate-reports": "Очистить список",
             "truncate-reports-description": "Все репорты Torrent Blocker будут удалены навсегда."
         }
     },
@@ -2115,21 +2115,21 @@
     },
     "mobile-stats": {
         "widget": {
-            "billing-nodes": "Billing nodes",
-            "upcoming": "Upcoming",
-            "per-month": "Per month",
-            "total-spent": "Total spent"
+            "billing-nodes": "Биллинг нод",
+            "upcoming": "Предстоящие",
+            "per-month": "За месяц",
+            "total-spent": "Всего потрачено"
         }
     },
     "mobile-providers-list": {
         "widget": {
-            "invoices": "Invoices"
+            "invoices": "Счета"
         }
     },
     "mobile-infra-billing": {
         "widget": {
-            "history": "History",
-            "providers": "Providers"
+            "history": "История",
+            "providers": "Провайдеры"
         }
     }
 }

public/locales/zh/remnawave.json

@@ -2115,21 +2115,21 @@
     },
     "mobile-stats": {
         "widget": {
-            "billing-nodes": "Billing nodes",
-            "upcoming": "Upcoming",
-            "per-month": "Per month",
-            "total-spent": "Total spent"
+            "billing-nodes": "计费节点",
+            "upcoming": "即将到来",
+            "per-month": "每月",
+            "total-spent": "合计花费"
         }
     },
     "mobile-providers-list": {
         "widget": {
-            "invoices": "Invoices"
+            "invoices": "发票"
         }
     },
     "mobile-infra-billing": {
         "widget": {
-            "history": "History",
-            "providers": "Providers"
+            "history": "历史",
+            "providers": "服务商"
         }
     }
 }

src/shared/ui/overlays/base-overlay-header/index.tsx

@@ -15,6 +15,7 @@ type IProps = {
     themeIconProps?: ThemeIconProps
     title: string
     titleOrder?: TitleProps['order']
+    truncateTitle?: boolean
     withCopy?: boolean
 }
 
@@ -31,13 +32,14 @@ export const BaseOverlayHeader = (props: IProps) => {
         titleOrder = 4,
         withCopy = false,
         hideIcon = false,
-        icon
+        icon,
+        truncateTitle = false
     } = props
 
     const { copy } = useClipboard()
 
     return (
-        <Group gap="sm" wrap="nowrap">
+        <Group gap="sm" style={truncateTitle ? { minWidth: 0 } : undefined} wrap="nowrap">
             {!hideIcon && (
                 <ThemeIcon color={iconColor} size="lg" variant={iconVariant} {...themeIconProps}>
                     <IconComponent size={iconSize} />
@@ -50,13 +52,18 @@ export const BaseOverlayHeader = (props: IProps) => {
                 <ReactCountryFlag countryCode={countryCode} style={{ fontSize: '1.5em' }} />
             )}
 
-            <Stack gap="0">
+            <Stack gap="0" style={truncateTitle ? { overflow: 'hidden' } : undefined}>
                 <Title
                     c="white"
                     onClick={() => withCopy && copy(title)}
                     order={titleOrder}
                     style={{
-                        cursor: withCopy ? 'copy' : 'default'
+                        cursor: withCopy ? 'copy' : 'default',
+                        ...(truncateTitle && {
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            whiteSpace: 'nowrap'
+                        })
                     }}
                 >
                     {title}

src/widgets/dashboard/sessions-explorer/sessions-explorer-widget/grid-components.tsx

@@ -9,9 +9,9 @@ export const SessionsExplorerVirtualizedGridComponents = {
                 cols={{
                     base: 1,
                     '800px': 2,
-                    '1000px': 3,
-                    '1200px': 4,
-                    '1800px': 5,
+                    '1200px': 3,
+                    '1600px': 4,
+                    '2000px': 5,
                     '2400px': 6,
                     '3000px': 7
                 }}

src/widgets/dashboard/sessions-explorer/sessions-explorer-widget/sessions-explorer-card.tsx

@@ -78,15 +78,30 @@ export const SessionsExplorerCard = memo(
         return (
             <SectionCard.Root dividerOpacity={0} gap="xs">
                 <SectionCard.Section>
-                    <Group gap="xs" justify="space-between">
+                    <Group gap="xs" justify="space-between" wrap="nowrap">
                         <BaseOverlayHeader
-                            iconColor="blue"
+                            hideIcon
+                            icon={
+                                <Tooltip label={t('node-active-session.item.widget.view-user')}>
+                                    <ActionIcon
+                                        color="cyan"
+                                        loading={isLoading}
+                                        onClick={handleViewUser}
+                                        size="lg"
+                                        variant="soft"
+                                    >
+                                        <PiUserCircle size={20} />
+                                    </ActionIcon>
+                                </Tooltip>
+                            }
                             IconComponent={TbId}
                             iconVariant="soft"
                             title={user.userId}
+                            titleOrder={5}
+                            truncateTitle
                         />
 
-                        <Group gap="xs">
+                        <Group gap="xs" style={{ flexShrink: 0 }} wrap="nowrap">
                             <Tooltip label={t('sessions-explorer.widget.unique-ips')}>
                                 <Badge
                                     color={getIpCountColor(
@@ -111,18 +126,6 @@ export const SessionsExplorerCard = memo(
                                     {user.totalIps}
                                 </Badge>
                             </Tooltip>
-
-                            <Tooltip label={t('node-active-session.item.widget.view-user')}>
-                                <ActionIcon
-                                    color="cyan"
-                                    loading={isLoading}
-                                    onClick={handleViewUser}
-                                    size="lg"
-                                    variant="soft"
-                                >
-                                    <PiUserCircle size={20} />
-                                </ActionIcon>
-                            </Tooltip>
                         </Group>
                     </Group>
                 </SectionCard.Section>