Skip to content

Commit 49c9534

Browse files
x0sinax0sina
committed
feat: logs ui updatated with new logic and controling in multiple components
1 parent 4955f3c commit 49c9534

File tree

16 files changed

+971
-653
lines changed

16 files changed

+971
-653
lines changed

‎dashboard/bun.lock‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@
4848
"embla-carousel-react": "^8.5.2",
4949
"es-toolkit": "^1.31.0",
5050
"eventsource": "^3.0.7",
51+
"fancy-ansi": "^0.1.3",
5152
"i18next": "^24.2.1",
5253
"i18next-browser-languagedetector": "^8.0.2",
5354
"i18next-http-backend": "^3.0.1",
@@ -1129,6 +1130,8 @@
11291130

11301131
"escalade": ["escalade@3.2.0", "", {}, "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="],
11311132

1133+
"escape-html": ["escape-html@1.0.3", "", {}, "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="],
1134+
11321135
"escape-string-regexp": ["escape-string-regexp@4.0.0", "", {}, "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA=="],
11331136

11341137
"eslint": ["eslint@9.31.0", "", { "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.12.1", "@eslint/config-array": "^0.21.0", "@eslint/config-helpers": "^0.3.0", "@eslint/core": "^0.15.0", "@eslint/eslintrc": "^3.3.1", "@eslint/js": "9.31.0", "@eslint/plugin-kit": "^0.3.1", "@humanfs/node": "^0.16.6", "@humanwhocodes/module-importer": "^1.0.1", "@humanwhocodes/retry": "^0.4.2", "@types/estree": "^1.0.6", "@types/json-schema": "^7.0.15", "ajv": "^6.12.4", "chalk": "^4.0.0", "cross-spawn": "^7.0.6", "debug": "^4.3.2", "escape-string-regexp": "^4.0.0", "eslint-scope": "^8.4.0", "eslint-visitor-keys": "^4.2.1", "espree": "^10.4.0", "esquery": "^1.5.0", "esutils": "^2.0.2", "fast-deep-equal": "^3.1.3", "file-entry-cache": "^8.0.0", "find-up": "^5.0.0", "glob-parent": "^6.0.2", "ignore": "^5.2.0", "imurmurhash": "^0.1.4", "is-glob": "^4.0.0", "json-stable-stringify-without-jsonify": "^1.0.1", "lodash.merge": "^4.6.2", "minimatch": "^3.1.2", "natural-compare": "^1.4.0", "optionator": "^0.9.3" }, "peerDependencies": { "jiti": "*" }, "optionalPeers": ["jiti"], "bin": { "eslint": "bin/eslint.js" } }, "sha512-QldCVh/ztyKJJZLr4jXNUByx3gR+TDYZCRXEktiZoUR3PGy4qCmSbkxcIle8GEwGpb5JBZazlaJ/CxLidXdEbQ=="],
@@ -1165,6 +1168,8 @@
11651168

11661169
"exit-hook": ["exit-hook@2.2.1", "", {}, "sha512-eNTPlAD67BmP31LDINZ3U7HSF8l57TxOY2PmBJ1shpCvpnxBF93mWCE8YHBnXs8qiUZJc9WDcWIeC3a2HIAMfw=="],
11671170

1171+
"fancy-ansi": ["fancy-ansi@0.1.3", "", { "dependencies": { "escape-html": "^1.0.3" } }, "sha512-tRQVTo5jjdSIiydqgzIIEZpKddzSsfGLsSVt6vWdjVm7fbvDTiQkyoPu6Z3dIPlAM4OZk0jP5jmTCX4G8WGgBw=="],
1172+
11681173
"fast-deep-equal": ["fast-deep-equal@3.1.3", "", {}, "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="],
11691174

11701175
"fast-equals": ["fast-equals@5.2.2", "", {}, "sha512-V7/RktU11J3I36Nwq2JnZEM7tNm17eBJz+u25qdxBZeCKiX6BkVSZQjwWIr+IobgnZy+ag73tTZgZi7tr0LrBw=="],

‎dashboard/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@
5555
"embla-carousel-react": "^8.5.2",
5656
"es-toolkit": "^1.31.0",
5757
"eventsource": "^3.0.7",
58+
"fancy-ansi": "^0.1.3",
5859
"i18next": "^24.2.1",
5960
"i18next-browser-languagedetector": "^8.0.2",
6061
"i18next-http-backend": "^3.0.1",

‎dashboard/public/statics/locales/en.json‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -61,26 +61,31 @@
6161
"title": "Logs",
6262
"description": "View and monitor node logs",
6363
"noLogs": "No logs available",
64-
"loading": "Loading logs...",
6564
"timestamps": "Timestamps",
66-
"autoScroll": "Auto Scroll",
67-
"scrollToEnd": "Scroll to End",
68-
"clear": "Clear Logs",
6965
"search": "Search logs",
7066
"filter": "Filter Logs",
71-
"levels": "Log Levels",
7267
"debug": "Debug",
7368
"info": "Info",
7469
"warning": "Warning",
7570
"error": "Error",
76-
"maxLogsTooltip": "Maximum logs to keep in memory",
77-
"memory": "Memory Usage",
78-
"custom": "Custom",
79-
"unlimited": "Unlimited",
80-
"memoryWarning": "High values may cause browser performance issues",
81-
"setCustom": "Set Custom Limit",
82-
"customLimit": "Enter custom limit",
83-
"apply": "Apply"
71+
"download": "Download logs",
72+
"paused": "Logs paused",
73+
"resume": "Resume",
74+
"pause": "Pause",
75+
"messagesBuffered": "messages buffered",
76+
"linesLabel": "Lines:",
77+
"linesCount": "{{count}} lines",
78+
"sinceLabel": "Since:",
79+
"all": "All",
80+
"timeFilters": {
81+
"all": "All time",
82+
"1m": "1 minute",
83+
"5m": "5 minutes",
84+
"15m": "15 minutes",
85+
"30m": "30 minutes",
86+
"1h": "1 hour",
87+
"2h": "2 hours"
88+
}
8489
}
8590
},
8691
"groups": "Groups",

‎dashboard/public/statics/locales/fa.json‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1095,26 +1095,31 @@
10951095
"title": "لاگ‌ها",
10961096
"description": "مشاهده و نظارت بر لاگ‌های گره‌ها",
10971097
"noLogs": "لاگی موجود نیست",
1098-
"loading": "در حال بارگذاری لاگ‌ها...",
10991098
"timestamps": "زمان",
1100-
"autoScroll": "اسکرول خودکار",
1101-
"scrollToEnd": "اسکرول به پایین",
1102-
"clear": "پاک کردن لاگ‌ها",
11031099
"search": "جستجوی لاگ",
11041100
"filter": "فیلتر لاگ‌ها",
1105-
"levels": "سطوح لاگ",
11061101
"debug": "دیباگ",
11071102
"info": "اطلاعات",
11081103
"warning": "هشدار",
11091104
"error": "خطا",
1110-
"maxLogsTooltip": "حداکثر لاگ‌های ذخیره شده در حافظه",
1111-
"memory": "استفاده از حافظه",
1112-
"custom": "سفارشی",
1113-
"unlimited": "نامحدود",
1114-
"memoryWarning": "مقادیر بالا ممکن است باعث مشکلات عملکردی مرورگر شود",
1115-
"setCustom": "تنظیم محدودیت سفارشی",
1116-
"customLimit": "وارد کردن محدودیت سفارشی",
1117-
"apply": "اعمال"
1105+
"download": "دانلود لاگ‌ها",
1106+
"paused": "لاگ‌ها متوقف شده",
1107+
"resume": "ادامه",
1108+
"pause": "توقف",
1109+
"messagesBuffered": "پیام‌های ذخیره شده",
1110+
"linesLabel": "خطوط:",
1111+
"linesCount": "{{count}} خط",
1112+
"sinceLabel": "از:",
1113+
"all": "همه",
1114+
"timeFilters": {
1115+
"all": "کل زمان",
1116+
"1m": "۱ دقیقه",
1117+
"5m": "۵ دقیقه",
1118+
"15m": "۱۵ دقیقه",
1119+
"30m": "۳۰ دقیقه",
1120+
"1h": "۱ ساعت",
1121+
"2h": "۲ ساعت"
1122+
}
11181123
}
11191124
},
11201125
"success": "موفق",

‎dashboard/public/statics/locales/ru.json‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -74,26 +74,31 @@
7474
"title": "Журналы",
7575
"description": "Просмотр и мониторинг журналов узла",
7676
"noLogs": "Нет доступных журналов",
77-
"loading": "Загрузка журналов...",
7877
"timestamps": "Метки времени",
79-
"autoScroll": "Автопрокрутка",
80-
"scrollToEnd": "Прокрутить вниз",
81-
"clear": "Очистить журналы",
8278
"search": "Поиск в журналах",
8379
"filter": "Фильтр журналов",
84-
"levels": "Уровни журнала",
8580
"debug": "Отладка",
8681
"info": "Инфо",
8782
"warning": "Предупреждение",
8883
"error": "Ошибка",
89-
"maxLogsTooltip": "Максимальное количество записей в памяти",
90-
"memory": "Использование памяти",
91-
"custom": "Пользовательский",
92-
"unlimited": "Неограниченно",
93-
"memoryWarning": "Высокие значения могут вызвать проблемы с производительностью браузера",
94-
"setCustom": "Установить пользовательский лимит",
95-
"customLimit": "Введите пользовательский лимит",
96-
"apply": "Применить"
84+
"download": "Скачать журналы",
85+
"paused": "Журналы приостановлены",
86+
"resume": "Продолжить",
87+
"pause": "Пауза",
88+
"messagesBuffered": "сообщений в буфере",
89+
"linesLabel": "Строки:",
90+
"linesCount": "{{count}} строк",
91+
"sinceLabel": "С:",
92+
"all": "Все",
93+
"timeFilters": {
94+
"all": "Всё время",
95+
"1m": "1 минута",
96+
"5m": "5 минут",
97+
"15m": "15 минут",
98+
"30m": "30 минут",
99+
"1h": "1 час",
100+
"2h": "2 часа"
101+
}
97102
}
98103
},
99104
"groups": "Группы",

‎dashboard/public/statics/locales/zh.json‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -56,26 +56,31 @@
5656
"title": "日志",
5757
"description": "查看和监控节点日志",
5858
"noLogs": "没有可用的日志",
59-
"loading": "正在加载日志...",
6059
"timestamps": "时间戳",
61-
"autoScroll": "自动滚动",
62-
"scrollToEnd": "滚动到底部",
63-
"clear": "清除日志",
6460
"search": "搜索日志",
6561
"filter": "过滤日志",
66-
"levels": "日志级别",
6762
"debug": "调试",
6863
"info": "信息",
6964
"warning": "警告",
7065
"error": "错误",
71-
"maxLogsTooltip": "内存中保留的最大日志数",
72-
"memory": "内存使用",
73-
"custom": "自定义",
74-
"unlimited": "无限制",
75-
"memoryWarning": "高值可能导致浏览器性能问题",
76-
"setCustom": "设置自定义限制",
77-
"customLimit": "输入自定义限制",
78-
"apply": "应用"
66+
"download": "下载日志",
67+
"paused": "日志已暂停",
68+
"resume": "恢复",
69+
"pause": "暂停",
70+
"messagesBuffered": "条消息已缓冲",
71+
"linesLabel": "行数:",
72+
"linesCount": "{{count}} 行",
73+
"sinceLabel": "从:",
74+
"all": "全部",
75+
"timeFilters": {
76+
"all": "所有时间",
77+
"1m": "1分钟",
78+
"5m": "5分钟",
79+
"15m": "15分钟",
80+
"30m": "30分钟",
81+
"1h": "1小时",
82+
"2h": "2小时"
83+
}
7984
}
8085
},
8186
"groups": "群组",

‎dashboard/src/components/LineCountFilter.tsx‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import {
2+
Select,
3+
SelectContent,
4+
SelectItem,
5+
SelectTrigger,
6+
SelectValue,
7+
} from "@/components/ui/select";
8+
import { useTranslation } from "react-i18next";
9+
import { toPersianNumerals } from "@/utils/formatByte";
10+
import useDirDetection from "@/hooks/use-dir-detection";
11+
12+
interface LineCountFilterProps {
13+
value: number;
14+
onValueChange: (value: number) => void;
15+
}
16+
17+
export function LineCountFilter({ value, onValueChange }: LineCountFilterProps) {
18+
const { t, i18n } = useTranslation();
19+
const dir = useDirDetection();
20+
21+
const LINE_COUNT_OPTIONS = [
22+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(50)} خط` : '50 lines', value: 50 },
23+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(100)} خط` : '100 lines', value: 100 },
24+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(200)} خط` : '200 lines', value: 200 },
25+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(500)} خط` : '500 lines', value: 500 },
26+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(1000)} خط` : '1000 lines', value: 1000 },
27+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(2000)} خط` : '2000 lines', value: 2000 },
28+
{ label: i18n.language === 'fa' ? `${toPersianNumerals(5000)} خط` : '5000 lines', value: 5000 },
29+
];
30+
31+
return (
32+
<div className="flex items-center gap-2">
33+
<span className="text-sm text-muted-foreground">{t('nodes.logs.linesLabel', { defaultValue: 'Lines:' })}</span>
34+
<Select
35+
dir={dir}
36+
value={value.toString()}
37+
onValueChange={(value) => onValueChange(Number(value))}
38+
>
39+
<SelectTrigger className="w-24 h-9">
40+
<SelectValue />
41+
</SelectTrigger>
42+
<SelectContent>
43+
{LINE_COUNT_OPTIONS.map((option) => (
44+
<SelectItem key={option.value} value={option.value.toString()}>
45+
{option.label}
46+
</SelectItem>
47+
))}
48+
</SelectContent>
49+
</Select>
50+
</div>
51+
);
52+
}

‎dashboard/src/components/SinceLogsFilter.tsx‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import { Clock } from "lucide-react";
2+
import {
3+
Select,
4+
SelectContent,
5+
SelectItem,
6+
SelectTrigger,
7+
SelectValue,
8+
} from "@/components/ui/select";
9+
import { Switch } from "@/components/ui/switch";
10+
import { useTranslation } from "react-i18next";
11+
import useDirDetection from "@/hooks/use-dir-detection";
12+
13+
export type TimeFilter = "all" | "1m" | "5m" | "15m" | "30m" | "1h" | "2h" | "6h" | "12h" | "24h";
14+
15+
interface SinceLogsFilterProps {
16+
value: TimeFilter;
17+
onValueChange: (value: TimeFilter) => void;
18+
showTimestamp: boolean;
19+
onTimestampChange: (show: boolean) => void;
20+
}
21+
22+
export function SinceLogsFilter({
23+
value,
24+
onValueChange,
25+
showTimestamp,
26+
onTimestampChange
27+
}: SinceLogsFilterProps) {
28+
const { t } = useTranslation();
29+
const dir = useDirDetection();
30+
31+
const TIME_FILTER_OPTIONS: { label: string; value: TimeFilter }[] = [
32+
{ label: t('nodes.logs.timeFilters.all'), value: "all" },
33+
{ label: t('nodes.logs.timeFilters.1m'), value: "1m" },
34+
{ label: t('nodes.logs.timeFilters.5m'), value: "5m" },
35+
{ label: t('nodes.logs.timeFilters.15m'), value: "15m" },
36+
{ label: t('nodes.logs.timeFilters.30m'), value: "30m" },
37+
{ label: t('nodes.logs.timeFilters.1h'), value: "1h" },
38+
{ label: t('nodes.logs.timeFilters.2h'), value: "2h" }
39+
];
40+
41+
return (
42+
<div className="flex items-center gap-4">
43+
<div className="flex items-center gap-2">
44+
<span className="text-sm text-muted-foreground">{t('nodes.logs.sinceLabel')}</span>
45+
<Select
46+
value={value}
47+
onValueChange={(value) => onValueChange(value as TimeFilter)}
48+
>
49+
<SelectTrigger className="w-32 h-9">
50+
<SelectValue />
51+
</SelectTrigger>
52+
<SelectContent>
53+
{TIME_FILTER_OPTIONS.map((option) => (
54+
<SelectItem dir={dir} key={option.value} value={option.value}>
55+
{option.label}
56+
</SelectItem>
57+
))}
58+
</SelectContent>
59+
</Select>
60+
</div>
61+
<div className="flex items-center gap-2">
62+
<Clock size={14} className="text-muted-foreground" />
63+
<span className="text-sm text-muted-foreground">{t('nodes.logs.timestamps')}</span>
64+
<Switch
65+
checked={showTimestamp}
66+
onCheckedChange={onTimestampChange}
67+
className="scale-75"
68+
/>
69+
</div>
70+
</div>
71+
);
72+
}

0 commit comments

Comments
 (0)