diff --git a/frontend/package.json b/frontend/package.json index ed7ac8b..2c3d0c9 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,7 +16,8 @@ "bootstrap": "^5.3.7", "react": "^19.1.0", "react-bootstrap": "^2.10.10", - "react-dom": "^19.1.0" + "react-dom": "^19.1.0", + "react-router-dom": "^6.23.1" }, "devDependencies": { "@eslint/js": "^9.29.0", diff --git a/frontend/src/ServerManager.jsx b/frontend/src/ServerManager.jsx index e8feb15..f5dc8ee 100644 --- a/frontend/src/ServerManager.jsx +++ b/frontend/src/ServerManager.jsx @@ -213,6 +213,16 @@ function ServerManager() { if (e.key === 'Escape') handleCancelEdit(); }; + // Функция для преобразования кода страны в emoji-флаг + function countryToFlag(isoCode) { + if (!isoCode) return ''; + return isoCode + .toUpperCase() + .replace(/./g, char => + String.fromCodePoint(127397 + char.charCodeAt()) + ); + } + return ( <> {error && ( @@ -315,46 +325,6 @@ function ServerManager() { - {/* Bulk Update Card */} -
-
-

- - Массовое обновление туннелей -

-
-
-
- - setBulkFrom(e.target.value)} - /> -
-
- - setBulkTo(e.target.value)} - /> -
-
- -
-
-
- {/* Save Changes Card */}
@@ -482,7 +452,7 @@ function ServerManager() { {server.ip} {server.dns} - {server.country} + {countryToFlag(server.country)} {server.country} {server.provider} {server.tunnel} @@ -554,48 +524,51 @@ function ServerManager() { ); } -// Модальное окно для редактирования сервера +// Модальное окно для редактирования сервера с backdrop и анимацией function EditServerModal({ show, server, onChange, onSave, onClose }) { if (!show || !server) return null; return ( -
-
-
-
-
Редактировать сервер
- -
-
-
{ e.preventDefault(); onSave(); }}> -
- - onChange({ ...server, ip: e.target.value })} /> -
-
- - onChange({ ...server, dns: e.target.value })} /> -
-
- - onChange({ ...server, country: e.target.value })} /> -
-
- - onChange({ ...server, provider: e.target.value })} /> -
-
- - onChange({ ...server, tunnel: e.target.value })} /> -
-
-
-
- - + <> +
+
+
+
+
Редактировать сервер
+ +
+
+
{ e.preventDefault(); onSave(); }}> +
+ + onChange({ ...server, ip: e.target.value })} /> +
+
+ + onChange({ ...server, dns: e.target.value })} /> +
+
+ + onChange({ ...server, country: e.target.value })} /> +
+
+ + onChange({ ...server, provider: e.target.value })} /> +
+
+ + onChange({ ...server, tunnel: e.target.value })} /> +
+
+
+
+ + +
-
+
+ ); }