Обновлён @tnsu/ui-kit до 0.14.0, реестр @tnsu — организация Tansu

Все версии ui-kit скопированы в публичный реестр организации Tansu (контрольные суммы совпадают),
токен для установки больше не нужен. Сборка проекта проверена.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

.claude/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.0.1",
+  "configurations": [
+    {
+      "name": "hr-appeals-web",
+      "runtimeExecutable": "npm",
+      "runtimeArgs": ["run", "dev"],
+      "port": 3000
+    }
+  ]
+}

.gitignore

@@ -13,3 +13,10 @@ Thumbs.db
 npm-debug.log*
 yarn-error.log*
 pnpm-debug.log*
+
+.env
+
+# Сертификаты и ключи. Каталог подменяется целиком: локально это secrets/,
+# в контейнере — примонтированный /certs (см. docker-compose.yml).
+secrets/*
+!secrets/README.md

.npmrc

@@ -1 +1 @@
-@tnsu:registry=http://git.tnsu.kz/api/packages/timur.gorodetskiy/npm/
+@tnsu:registry=http://git.tnsu.kz/api/packages/Tansu/npm/

README.md

@@ -26,9 +26,21 @@ npm install
 npm run dev
 ```
 
+`npm run dev` поднимает сразу оба процесса: фронтенд на `:3000` и сервис
+авторизации `hr-appeals-auth` на `:3100` (логи помечены `[web]` и `[auth]`).
+Форма отправляется на `/api/feedback`, dev-сервер проксирует это на `:3100` —
+так же, как nginx в проде (`nginx.conf`). Без запущенного `[auth]` отправка
+формы отдаёт 500 от прокси.
+
+Сервису нужны две вещи: `server/.env` (скопируйте
+[server/.env.example](server/.env.example)) и сертификат Azure AD в каталоге
+[`secrets/`](secrets/README.md). Сами `.pem`-файлы в git не хранятся — их надо
+взять у администратора. Подробнее — в [server/README.md](server/README.md).
+
 Прочие команды:
 
 ```bash
+npm run dev:web    # только фронтенд, без сервиса авторизации
 npm run build      # проверка типов + тесты + production-сборка в dist/
 npm run typecheck  # только проверка типов
 npm run test       # тесты один раз (то же, что гоняет CI)

docker-compose.yml

@@ -3,7 +3,7 @@ services:
     image: nexus.tnsu.kz:8082/hr-appeals-web:${IMAGE_TAG:-latest}
     restart: unless-stopped
     ports:
-      - "80:80"
+      - "127.0.0.1:8082:80"
     depends_on:
       - hr-appeals-auth
 
@@ -13,8 +13,9 @@ services:
     environment:
       GRAPH_TENANT_ID: ${GRAPH_TENANT_ID:?в .env на сервере не задан GRAPH_TENANT_ID}
       GRAPH_CLIENT_ID: ${GRAPH_CLIENT_ID:?в .env на сервере не задан GRAPH_CLIENT_ID}
-      GRAPH_CERT_PATH: /certs/SPFxDeploy_cert.pem
+      # Один параметр на весь каталог с секретами — имена файлов внутри
-      GRAPH_KEY_PATH: /certs/SPFxDeploy_key.pem
+      # фиксированы (см. server/src/config.ts).
+      SECRETS_DIR: /certs
     volumes:
       # Каталог с сертификатом/ключом на сервере — путь задаётся в .env
       # (GRAPH_CERT_DIR), сами файлы в git не попадают.

package-lock.json

@@ -9,7 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "@fluentui/react": "^8.106.4",
-        "@tnsu/ui-kit": "^0.8.0",
+        "@tnsu/ui-kit": "^0.14.0",
         "react": "17.0.2",
         "react-dom": "17.0.2",
         "tslib": "^2.3.1"
@@ -19,6 +19,7 @@
         "@types/react": "17.0.45",
         "@types/react-dom": "17.0.17",
         "@vitejs/plugin-react": "^4.3.4",
+        "concurrently": "^10.0.5",
         "sass": "^1.83.0",
         "typescript": "~5.8.0",
         "vite": "^6.0.7",
@@ -1700,9 +1701,9 @@
       }
     },
     "node_modules/@tnsu/ui-kit": {
-      "version": "0.8.0",
+      "version": "0.14.0",
-      "resolved": "http://git.tnsu.kz/api/packages/timur.gorodetskiy/npm/%40tnsu%2Fui-kit/-/0.8.0/ui-kit-0.8.0.tgz",
+      "resolved": "http://git.tnsu.kz/api/packages/Tansu/npm/%40tnsu%2Fui-kit/-/0.14.0/ui-kit-0.14.0.tgz",
-      "integrity": "sha512-PdAxr09JVkbK8XmxSM5Lgfz1Iq56RGFsoz4bI1YBd8quPzM3g/r4gRqqjbhCxyemzfK1d4w4WJD0ZBSs8jJbdA==",
+      "integrity": "sha512-Vun9AUM9jL8rttbsbKo5Yh6TUz1srkNqxiO6mmzebrSo1JOASNJqNjJPMTS+8Jt3MTrJPklvh0TbeqGQzw7qxQ==",
       "license": "ISC",
       "peerDependencies": {
         "@fluentui/react": "^8.106.4",
@@ -1957,6 +1958,32 @@
         "url": "https://opencollective.com/vitest"
       }
     },
+    "node_modules/ansi-regex": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.3.0.tgz",
+      "integrity": "sha512-WpDfL7NO6j7tH88IDBNVdUJxDh9nmCteAVW9dsep846XdwF4naCBK+/tGLX3KJgcpgMRXCFlTM2hKGoK9FsdrQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
     "node_modules/assertion-error": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
@@ -2045,6 +2072,19 @@
         "node": ">=18"
       }
     },
+    "node_modules/chalk": {
+      "version": "5.6.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.2.tgz",
+      "integrity": "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
     "node_modules/chokidar": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-5.0.0.tgz",
@@ -2061,6 +2101,46 @@
         "url": "https://paulmillr.com/funding/"
       }
     },
+    "node_modules/cliui": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz",
+      "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/concurrently": {
+      "version": "10.0.5",
+      "resolved": "https://registry.npmjs.org/concurrently/-/concurrently-10.0.5.tgz",
+      "integrity": "sha512-JaP/CoftUrCcAFW/g//RbgEGwlelnEae6cfBLgH6ZdO6s8jPkn6p9SB9u6pdVxYXoiSnFqseOlHfrEfF82TVOg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "5.6.2",
+        "rxjs": "7.8.2",
+        "shell-quote": "1.9.0",
+        "supports-color": "10.2.2",
+        "tree-kill": "1.2.2",
+        "yargs": "18.0.0"
+      },
+      "bin": {
+        "conc": "dist/bin/index.js",
+        "concurrently": "dist/bin/index.js"
+      },
+      "engines": {
+        "node": ">=22"
+      },
+      "funding": {
+        "url": "https://github.com/open-cli-tools/concurrently?sponsor=1"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -2110,6 +2190,13 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/es-module-lexer": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.3.2.tgz",
@@ -2232,6 +2319,29 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
+    "node_modules/get-east-asian-width": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.6.0.tgz",
+      "integrity": "sha512-QRbvDIbx6YklUe6RxeTeleMR0yv3cYH6PsPZHcnVn7xv7zO1BHN8r0XETu8n6Ye3Q+ahtSarc3WgtNWmehIBfA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/immutable": {
       "version": "5.1.9",
       "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.9.tgz",
@@ -2548,6 +2658,16 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/rxjs": {
+      "version": "7.8.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
+      "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
     "node_modules/sass": {
       "version": "1.103.0",
       "resolved": "https://registry.npmjs.org/sass/-/sass-1.103.0.tgz",
@@ -2589,6 +2709,19 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/shell-quote": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.9.0.tgz",
+      "integrity": "sha512-Iov+JwFv/2HcTpcwNMKd8+IWNb8tboQJNQTkAY/LLVK7gGH9jy+LGkVqPxfekHl+yMmiqXszdGWXgkfml7hjqA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/siginfo": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
@@ -2620,6 +2753,53 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
+      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.2.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/supports-color": {
+      "version": "10.2.2",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-10.2.2.tgz",
+      "integrity": "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
     "node_modules/tinybench": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
@@ -2664,6 +2844,16 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/tree-kill": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
+      "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "tree-kill": "cli.js"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
@@ -2904,12 +3094,68 @@
         "node": ">=8"
       }
     },
+    "node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
       "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
       "dev": true,
       "license": "ISC"
+    },
+    "node_modules/yargs": {
+      "version": "18.0.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz",
+      "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^9.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "string-width": "^7.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^22.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=23"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "22.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz",
+      "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=23"
+      }
     }
   }
 }

package.json

@@ -7,7 +7,8 @@
     "node": ">=20"
   },
   "scripts": {
-    "dev": "vite",
+    "dev": "concurrently -n web,auth -c cyan,magenta -k \"vite\" \"npm --prefix server run dev\"",
+    "dev:web": "vite",
     "build": "tsc --noEmit && vitest run && vite build",
     "preview": "vite preview",
     "typecheck": "tsc --noEmit",
@@ -17,7 +18,7 @@
   },
   "dependencies": {
     "@fluentui/react": "^8.106.4",
-    "@tnsu/ui-kit": "^0.8.0",
+    "@tnsu/ui-kit": "^0.14.0",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "tslib": "^2.3.1"
@@ -27,6 +28,7 @@
     "@types/react": "17.0.45",
     "@types/react-dom": "17.0.17",
     "@vitejs/plugin-react": "^4.3.4",
+    "concurrently": "^10.0.5",
     "sass": "^1.83.0",
     "typescript": "~5.8.0",
     "vite": "^6.0.7",

secrets/README.md

@@ -0,0 +1,34 @@
+# secrets
+
+Сертификат и приватный ключ приложения Azure AD, под которым сервис
+`hr-appeals-auth` получает app-only токен. **В git не попадают** — всё
+содержимое каталога, кроме этого файла, в `.gitignore`.
+
+Положите сюда два файла (взять у администратора):
+
+```
+secrets/
+  SPFxDeploy_cert.pem
+  SPFxDeploy_key.pem
+```
+
+Имена фиксированные — их ждёт [server/src/config.ts](../server/src/config.ts).
+
+## Подменить каталог целиком
+
+Путь задаётся одной переменной `SECRETS_DIR`, поэтому каталог можно заменить
+не трогая код:
+
+```bash
+SECRETS_DIR=/path/to/other/secrets npm run dev --prefix server
+```
+
+По умолчанию — этот каталог. В продовом контейнере `SECRETS_DIR=/certs`, куда
+смонтирован каталог с хоста: путь на хосте задаёт `GRAPH_CERT_DIR` в `.env`
+рядом с `docker-compose.yml` на сервере.
+
+## Если ключ утёк
+
+Сертификат перевыпускается в Azure AD (App registrations → нужное приложение →
+Certificates & secrets), старый оттуда удаляется. Замена файлов здесь без этого
+ничего не даёт: Azure AD продолжит принимать подпись старым ключом.

server/.env.example

@@ -0,0 +1,13 @@
+# Локальный запуск: скопируйте в server/.env.
+# На проде эти переменные задаёт docker-compose (см. docker-compose.yml).
+
+GRAPH_TENANT_ID=b4c2af35-bfd6-4cff-9af9-556efb53e65a
+GRAPH_CLIENT_ID=26d2e058-0b27-4a00-b49f-1f17c4eecd1d
+
+# 3000 занят vite (см. vite.config.ts), поэтому локально сервис слушает 3100 —
+# именно туда проксирует /api из dev-сервера.
+PORT=3100
+
+# Каталог с сертификатом и ключом. По умолчанию — secrets/ в корне репозитория,
+# задавать нужно только чтобы подменить его на другой (см. secrets/README.md).
+# SECRETS_DIR=/path/to/secrets

server/README.md

@@ -0,0 +1,77 @@
+# hr-appeals-auth
+
+Сервис получает app-only токен Azure AD (JWT client
+assertion) и используется для авторизованных запросов к внутреннему API
+`api.tnsu.kz`. Сам токен наружу не отдаётся — из HTTP-эндпоинтов сервиса
+доступны только `/healthz` и `/diag/token` (последний подтверждает, что
+токен получен, но не возвращает его значение). Детали получения токена — в
+[graphAuth.ts](src/graphAuth.ts).
+
+## Переменные окружения
+
+| Переменная | Назначение |
+|---|---|
+| `GRAPH_TENANT_ID` | Tenant ID Azure AD |
+| `GRAPH_CLIENT_ID` | Client ID App Registration, к которому привязан сертификат `SPFxDeploy` |
+| `SECRETS_DIR` | Каталог с `SPFxDeploy_cert.pem` и `SPFxDeploy_key.pem` (имена файлов фиксированы). По умолчанию — [`secrets/`](../secrets/README.md) в корне репозитория; в контейнере `/certs`, куда смонтирован каталог с хоста. Задавать нужно только чтобы подменить каталог целиком |
+| `GRAPH_SCOPE` | OAuth-scope запрашиваемого токена. По умолчанию — App ID URI самого `api.tnsu.kz` (`api://9232d9e2-.../.default`), задавать не нужно. Токен для `https://graph.microsoft.com/.default` тут не подойдёт: `api.tnsu.kz` проверяет `aud` входящего JWT и отвечает 401 |
+| `PORT` | Порт HTTP-сервера сервиса, по умолчанию `3000` (локально — `3100`, см. `.env.example`) |
+
+## Локальный запуск
+
+Из корня репозитория `npm run dev` поднимает сервис вместе с фронтендом. Отдельно:
+
+```bash
+cp .env.example .env   # tenant/client id и порт
+npm run dev            # tsc + запуск с чтением .env (--env-file, Node 20+)
+```
+
+Сертификат и ключ при этом должны лежать в [`secrets/`](../secrets/README.md) —
+в git они не хранятся.
+
+Проверить, что авторизация работает: `curl http://localhost:3100/diag/token` →
+`{"ok":true}`. Если вернулась ошибка — в ней будет ответ Azure AD целиком.
+
+## Как обратиться к api.tnsu.kz с авторизацией
+
+Токен запрашивается через `getAppOnlyToken()` и передаётся в заголовке
+`Authorization: Bearer <token>`. Функция сама кэширует токен до истечения,
+повторно вызывать её на каждый запрос не накладно — за сеть она сходит
+только когда кэш устарел.
+
+```ts
+import { getAppOnlyToken } from './graphAuth';
+
+async function callApiTnsu(path: string, init: RequestInit = {}) {
+  const token = await getAppOnlyToken();
+
+  const response = await fetch(`https://api.tnsu.kz${path}`, {
+    ...init,
+    headers: {
+      ...init.headers,
+      Authorization: `Bearer ${token}`
+    }
+  });
+
+  if (!response.ok) {
+    throw new Error(`api.tnsu.kz ответил ${response.status}: ${await response.text()}`);
+  }
+
+  return response.json();
+}
+```
+
+Перед тем как писать реальные вызовы, убедитесь, что обмен сертификата на
+токен вообще работает — на запущенном сервисе:
+
+```bash
+curl http://localhost:3000/diag/token
+# {"ok":true} — сертификат подошёл, токен получен и закэширован
+# {"ok":false,"error":"..."} — см. текст ошибки: неверный tenant/client id,
+# истёкший сертификат, неверный scope и т.п.
+```
+
+Если `/diag/token` отвечает `ok:true`, но реальный вызов `api.tnsu.kz`
+падает с `401`/`403` — вероятная причина в `GRAPH_SCOPE`: токен получен, но
+выпущен не для этого API (Azure AD не проверяет аудиторию на этапе выдачи
+токена — она проверяется уже на стороне `api.tnsu.kz`).

server/package.json

@@ -8,6 +8,7 @@
   "scripts": {
     "build": "tsc",
     "start": "node dist/index.js",
+    "dev": "tsc && node --env-file=.env dist/index.js",
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {

server/src/companies.ts

@@ -0,0 +1,66 @@
+import { getAppOnlyToken } from './graphAuth';
+
+const COMPANIES_URL = 'https://api.tnsu.kz/Dictionary/Companies';
+
+// Справочник компаний меняется редко (новое юрлицо в группе), но перезапуск
+// сервиса ради этого — лишнее, поэтому кэш с коротким временем жизни.
+const CACHE_TTL_MS = 10 * 60 * 1000;
+
+export interface ICompany {
+  Id: string;
+  Name: string;
+}
+
+/**
+ * Компании из справочника, которые по сути не действуют и не должны попадать
+ * в форму (просьба HR, 2026-09-09): СЛМ (CL MANAGEMENT), Selin Invest,
+ * ОСН Беркут, ТехЛаб, Seline Holding Ltd.
+ */
+const EXCLUDED_COMPANY_IDS = new Set<string>([
+  '9de064a4-44c8-88ef-11ec-831c058b1141', // ТОО CL MANAGEMENT (СЛМ)
+  '15009595-005d-00fa-11ef-11309f5e395d', // ТОО Selin Invest
+  '8028beac-ac23-8fd8-11f0-5351706e5996', // ТОО ОСН Беркут
+  '15009595-005d-00fa-11ef-1131801d9f3e', // ТОО ТехЛаб
+  '03f4deac-f543-e8cf-11f1-84f51483f59e' // Частная компания Seline Holding Ltd
+]);
+
+let cached: { companies: ICompany[]; expiresAt: number } | null = null;
+
+export async function getCompanies(): Promise<ICompany[]> {
+  if (cached && cached.expiresAt > Date.now()) {
+    return cached.companies;
+  }
+
+  const token = await getAppOnlyToken();
+  const response = await fetch(COMPANIES_URL, {
+    headers: { Authorization: `Bearer ${token}` }
+  });
+
+  if (!response.ok) {
+    throw new Error(
+      `Не удалось получить справочник компаний: ${response.status} ${await response.text()}`
+    );
+  }
+
+  const allCompanies = (await response.json()) as ICompany[];
+  const companies = allCompanies.filter((company) => !EXCLUDED_COMPANY_IDS.has(company.Id));
+  cached = { companies, expiresAt: Date.now() + CACHE_TTL_MS };
+  return companies;
+}
+
+/**
+ * Колонка Company в списке текстовая и ждёт название, а форма присылает Id из
+ * справочника. Если Id неизвестен — возвращаем его как есть: потерять обращение
+ * из-за рассинхрона справочника хуже, чем записать в колонку сырой Id.
+ */
+export async function resolveCompanyName(id: string): Promise<string> {
+  const companies = await getCompanies();
+  const found = companies.find((company) => company.Id === id);
+
+  if (!found) {
+    console.warn(`Неизвестный Id компании из формы, пишу как есть: ${id}`);
+    return id;
+  }
+
+  return found.Name;
+}

server/src/config.ts

@@ -1,3 +1,5 @@
+import { join, resolve } from 'node:path';
+
 function requireEnv(name: string): string {
   const value = process.env[name];
   if (!value) {
@@ -6,12 +8,25 @@ function requireEnv(name: string): string {
   return value;
 }
 
+/**
+ * Каталог с сертификатом и приватным ключом приложения. Одна переменная на весь
+ * каталог, а не путь к каждому файлу: так его можно подменить централизованно —
+ * локально это `secrets/` в корне репозитория (в git не попадает), в контейнере
+ * SECRETS_DIR=/certs, куда смонтирован каталог с хоста (см. docker-compose.yml).
+ *
+ * __dirname здесь — server/dist, поэтому до корня репозитория два уровня вверх.
+ */
+const secretsDir = process.env.SECRETS_DIR ?? resolve(__dirname, '../../secrets');
+
 export const config = {
   tenantId: requireEnv('GRAPH_TENANT_ID'),
   clientId: requireEnv('GRAPH_CLIENT_ID'),
-  certPath: requireEnv('GRAPH_CERT_PATH'),
+  certPath: join(secretsDir, 'SPFxDeploy_cert.pem'),
-  keyPath: requireEnv('GRAPH_KEY_PATH'),
+  keyPath: join(secretsDir, 'SPFxDeploy_key.pem'),
-  scope: process.env.GRAPH_SCOPE ?? 'https://graph.microsoft.com/.default',
+  // Токен нужен не для Graph напрямую, а для api.tnsu.kz — он сам ходит в
+  // SharePoint. Это его App ID URI: с graph.microsoft.com/.default api вернёт
+  // 401, потому что проверяет aud во входящем JWT.
+  scope: process.env.GRAPH_SCOPE ?? 'api://9232d9e2-9807-4753-808f-07250e5474b0/.default',
   port: Number(process.env.PORT ?? 3000),
   sharepointSiteUrl: 'https://tnsukz.sharepoint.com/sites/hrm',
   sharepointListName: 'Обращения'

server/src/graphAuth.ts

@@ -21,9 +21,24 @@ const REFRESH_MARGIN_MS = 60_000;
 
 let cached: CachedToken | null = null;
 
+function readSecret(path: string): string {
+  try {
+    return readFileSync(path, 'utf8');
+  } catch (cause) {
+    // Самая частая причина на свежем клоне — файлов просто нет: в git они не
+    // хранятся. Ошибка ENOENT сама по себе не подсказывает, что делать.
+    throw new Error(
+      `Не удалось прочитать ${path}. Сертификат и ключ в git не хранятся — ` +
+        'положите их в каталог secrets/ (см. secrets/README.md) или укажите ' +
+        'другой каталог через SECRETS_DIR.',
+      { cause }
+    );
+  }
+}
+
 function buildClientAssertion(): string {
-  const certificatePem = readFileSync(config.certPath, 'utf8');
+  const certificatePem = readSecret(config.certPath);
-  const privateKey = readFileSync(config.keyPath, 'utf8');
+  const privateKey = readSecret(config.keyPath);
 
   // x5t — SHA-1 отпечаток DER-сертификата, base64url. По нему Azure AD находит
   // публичный ключ приложения и проверяет подпись JWT.

server/src/index.ts

@@ -1,4 +1,5 @@
 import express from 'express';
+import { getCompanies } from './companies';
 import { config } from './config';
 import { getAppOnlyToken } from './graphAuth';
 import { submitFeedback } from './sharepoint';
@@ -22,6 +23,18 @@ app.get('/diag/token', async (_req, res) => {
   }
 });
 
+// Справочник компаний для выпадающего списка формы. Ходит в api.tnsu.kz за
+// нас, чтобы токен не утекал в браузер, и отдаёт список как есть.
+app.get('/companies', async (_req, res) => {
+  try {
+    res.status(200).json(await getCompanies());
+  } catch (error) {
+    const message = (error as Error).message;
+    console.error('Не удалось получить справочник компаний:', message);
+    res.status(502).json({ ok: false, error: message });
+  }
+});
+
 app.post('/feedback', async (req, res) => {
   try {
     await submitFeedback(req.body);

server/src/sharepoint.ts

@@ -1,3 +1,4 @@
+import { resolveCompanyName } from './companies';
 import { config } from './config';
 import { getAppOnlyToken } from './graphAuth';
 
@@ -11,27 +12,6 @@ const KIND_LABELS: Record<AppealKind, string> = {
   other: 'Другое'
 };
 
-// Форма присылает id компании из справочника (см. COMPANY_OPTIONS во фронтовом
-// src/features/feedback/model.ts) — колонка Company в SharePoint текстовая и
-// ждёт название, а не id, поэтому здесь его резолвим. Список держим в синхроне
-// с фронтовым вручную — общего пакета между сервером и клиентом сейчас нет.
-const COMPANY_NAMES: Record<string, string> = {
-  '8028abac-ac23-8fd8-11ef-cb57631a9ab0': 'ТОО AFL Engineering',
-  '9de064a4-44c8-88ef-11ec-831c058b1141': 'ТОО CL MANAGEMENT',
-  '9de064a4-44c8-88ef-11ec-8287fb7737a2': 'ТОО KazPromService',
-  'ec3c78a7-29ef-4725-11ed-a6d8fcd0911d': 'ТОО QAZGEOMAX',
-  '15009595-005d-00fa-11ef-11309f5e395d': 'ТОО Selin Invest',
-  '03f4deac-f543-e8cf-11f1-84eb25329fc3': 'ТОО Selin Studio',
-  '9de064a4-44c8-88ef-11ec-8284930fad96': 'ТОО TANSU Construction',
-  '9de064a4-44c8-88ef-11ec-8285925d83d2': 'ТОО АСТЕЛ-К',
-  '15009595-005d-00fa-11ef-0b8bb5ec1a88': 'ТОО ГеоТрек',
-  '15009595-005d-00fa-11ef-0b8714483372': 'ТОО Монтажник-Т',
-  '8028beac-ac23-8fd8-11f0-5351706e5996': 'ТОО ОСН Беркут',
-  '8028b0ac-ac23-8fd8-11ef-dcdb24b82e02': 'ТОО СТ Global',
-  '15009595-005d-00fa-11ef-1131801d9f3e': 'ТОО ТехЛаб',
-  '03f4deac-f543-e8cf-11f1-84f51483f59e': 'Частная компания Seline Holding Ltd'
-};
-
 export interface IFeedbackSubmission {
   company: string;
   isAnonymous: boolean;
@@ -44,27 +24,52 @@ export interface IFeedbackSubmission {
   suggestion: string;
 }
 
-// Имена полей — internal name столбцов списка SharePoint (Company/Name/Position/
+// 5 рабочих дней от текущей даты, выходные (сб/вс) не считаются днём срока —
-// Type/IssueDescription/SuggestionText/WantsFeedback), не отображаемые названия.
+// используется как крайний срок обработки обращения (AppealDueDate).
-function buildFields(data: IFeedbackSubmission): Record<string, unknown> {
+function addBusinessDays(from: Date, days: number): Date {
-  const typeLabel = data.kind === 'other' ? data.kindOther : KIND_LABELS[data.kind];
+  const result = new Date(from);
-  const name = data.isAnonymous ? '' : data.fullName;
+  let remaining = days;
-  const companyName = COMPANY_NAMES[data.company];
 
-  if (!companyName) {
+  while (remaining > 0) {
-    console.warn(`Неизвестный id компании из формы, отправляю как есть: ${data.company}`);
+    result.setDate(result.getDate() + 1);
+    const dayOfWeek = result.getDay(); // 0 = воскресенье, 6 = суббота
+    if (dayOfWeek !== 0 && dayOfWeek !== 6) {
+      remaining -= 1;
+    }
   }
 
-  return {
+  return result;
+}
+
+// Имена полей — internal name столбцов списка SharePoint (Company/Name/Position/
+// Type/IssueDescription/SuggestionText/WantsFeedback/AppealDueDate), не
+// отображаемые названия.
+async function buildFields(data: IFeedbackSubmission): Promise<Record<string, unknown>> {
+  const typeLabel = data.kind === 'other' ? data.kindOther : KIND_LABELS[data.kind];
+  const name = data.isAnonymous ? '' : data.fullName;
+
+  const fields: Record<string, unknown> = {
     Title: name ? `${typeLabel} — ${name}` : typeLabel,
-    Company: companyName ?? data.company,
+    Company: await resolveCompanyName(data.company),
     Name: name,
     Position: data.isAnonymous ? '' : data.position,
     Type: typeLabel,
     IssueDescription: data.situation,
     SuggestionText: data.suggestion,
-    WantsFeedback: data.wantsFeedback
+    WantsFeedback: data.wantsFeedback,
+    AppealDueDate: addBusinessDays(new Date(), 5).toISOString()
   };
+
+  // Состав полей зависит от вида обращения и анонимности, поэтому часть строк
+  // заведомо пустая (у предложения нет описания ситуации, у анонимного — ФИО).
+  // Такие поля не отправляем вовсе: пустая строка в списке выглядит как
+  // заполненное значение, а не как «поля не было». WantsFeedback при этом
+  // остаётся всегда — false здесь осмысленное значение, а не пустота.
+  return Object.fromEntries(
+    Object.entries(fields)
+      .map(([key, value]) => [key, typeof value === 'string' ? value.trim() : value])
+      .filter(([, value]) => value !== '')
+  );
 }
 
 export async function submitFeedback(data: IFeedbackSubmission): Promise<void> {
@@ -79,7 +84,7 @@ export async function submitFeedback(data: IFeedbackSubmission): Promise<void> {
     body: JSON.stringify({
       siteUrl: config.sharepointSiteUrl,
       listName: config.sharepointListName,
-      fields: buildFields(data)
+      fields: await buildFields(data)
     })
   });
 

src/features/feedback/FeedbackForm.tsx

@@ -20,6 +20,10 @@ export const FeedbackForm: React.FC = () => {
     // (App.tsx) — второй здесь был бы дублем. Пустая строка убирает текст,
     // а гэпа не оставляет: у ui-kit пустой title-блок не создаёт строки.
     <FormCard title="">
+      <div className={styles.notice}>
+        <Alert variant="ok">{TEXTS.helpText}</Alert>
+      </div>
+
       {formError ? (
         <div className={styles.notice}>
           <Alert variant="err">{formError}</Alert>

src/features/feedback/model.test.ts

@@ -1,4 +1,4 @@
-import { COMPANY_OPTIONS, getAppealFieldsConfig } from './model';
+import { getAppealFieldsConfig } from './model';
 
 // Форма (AppealSection) и валидация (validateFeedback) читают одно и то же
 // правило из getAppealFieldsConfig — если оно разойдётся, форма и валидация
@@ -32,18 +32,3 @@ describe('getAppealFieldsConfig', () => {
     });
   });
 });
-
-// Справочник компаний используется бэкендом по Id (см. комментарий в model.ts) —
-// дубликат Id незаметно перепутал бы два разных юрлица.
-describe('COMPANY_OPTIONS', () => {
-  it('не содержит повторяющихся Id', () => {
-    const ids = COMPANY_OPTIONS.map((option) => option.value);
-    expect(new Set(ids).size).toBe(ids.length);
-  });
-
-  it('у каждой компании есть непустое название', () => {
-    COMPANY_OPTIONS.forEach((option) => {
-      expect(option.label.trim().length).toBeGreaterThan(0);
-    });
-  });
-});

src/features/feedback/model.ts

@@ -18,27 +18,6 @@ export interface IFeedbackData {
   suggestion: string;
 }
 
-/**
- * Компании группы. В value — реальный Id из справочника, а не slug: именно его
- * ждёт бэкенд, когда появится отправка. Порядок как в источнике (по алфавиту).
- */
-export const COMPANY_OPTIONS: ISelectOption[] = [
-  { value: '8028abac-ac23-8fd8-11ef-cb57631a9ab0', label: 'ТОО AFL Engineering' },
-  { value: '9de064a4-44c8-88ef-11ec-831c058b1141', label: 'ТОО CL MANAGEMENT' },
-  { value: '9de064a4-44c8-88ef-11ec-8287fb7737a2', label: 'ТОО KazPromService' },
-  { value: 'ec3c78a7-29ef-4725-11ed-a6d8fcd0911d', label: 'ТОО QAZGEOMAX' },
-  { value: '15009595-005d-00fa-11ef-11309f5e395d', label: 'ТОО Selin Invest' },
-  { value: '03f4deac-f543-e8cf-11f1-84eb25329fc3', label: 'ТОО Selin Studio' },
-  { value: '9de064a4-44c8-88ef-11ec-8284930fad96', label: 'ТОО TANSU Construction' },
-  { value: '9de064a4-44c8-88ef-11ec-8285925d83d2', label: 'ТОО АСТЕЛ-К' },
-  { value: '15009595-005d-00fa-11ef-0b8bb5ec1a88', label: 'ТОО ГеоТрек' },
-  { value: '15009595-005d-00fa-11ef-0b8714483372', label: 'ТОО Монтажник-Т' },
-  { value: '8028beac-ac23-8fd8-11f0-5351706e5996', label: 'ТОО ОСН Беркут' },
-  { value: '8028b0ac-ac23-8fd8-11ef-dcdb24b82e02', label: 'ТОО СТ Global' },
-  { value: '15009595-005d-00fa-11ef-1131801d9f3e', label: 'ТОО ТехЛаб' },
-  { value: '03f4deac-f543-e8cf-11f1-84f51483f59e', label: 'Частная компания Seline Holding Ltd' }
-];
-
 // Порядок как в исходной форме: «Предложение» первым — совпадает с дефолтным
 // значением ниже (EMPTY_FEEDBACK.kind), так что выбор пользователя.
 export const KIND_OPTIONS: ISelectOption[] = [

src/features/feedback/sections/AuthorSection.tsx

@@ -1,24 +1,33 @@
 import { FormGrid, Select, TextInput, Toggle } from '@tnsu/ui-kit';
 import { Field } from '../../../components/Field/Field';
-import { COMPANY_OPTIONS } from '../model';
 import { TEXTS } from '../texts';
+import { useCompanies } from '../useCompanies';
 import type { ISectionProps } from './ISectionProps';
 
 /** Кто обращается: компания, анонимность, ФИО и должность. */
-export const AuthorSection: React.FC<ISectionProps> = ({ data, errors, set }) => (
+export const AuthorSection: React.FC<ISectionProps> = ({ data, errors, set }) => {
+  const companies = useCompanies();
+
+  return (
   <FormGrid>
+    {/* Ошибку справочника показываем в слоте ошибки поля: без списка компанию
+        не выбрать, а обязательное поле молча пустым оставлять нельзя. */}
     <Field
       label={TEXTS.labels.company}
       htmlFor="company"
       required
-      error={errors.company}
+      error={companies.error ? TEXTS.errors.companiesFailed : errors.company}
     >
       <Select
         id="company"
         value={data.company}
         onChange={(v) => set('company', v)}
-        options={COMPANY_OPTIONS}
+        options={companies.options}
-        placeholder={TEXTS.placeholders.company}
+        placeholder={
+          companies.isLoading
+            ? TEXTS.placeholders.companyLoading
+            : TEXTS.placeholders.company
+        }
       />
     </Field>
 
@@ -59,4 +68,5 @@ export const AuthorSection: React.FC<ISectionProps> = ({ data, errors, set }) =>
       </>
     ) : null}
   </FormGrid>
-);
+  );
+};

src/features/feedback/texts.ts

@@ -6,6 +6,11 @@ export const TEXTS = {
   pageTitle: 'Обращение',
   pageSubtitle: 'Данное обращение будет направлено в HR департамент',
 
+  helpText:
+    'Обращение в HR — единый канал для вопросов, предложений и обратной связи ' +
+    'сотрудников по трудовым отношениям, рабочим процессам, условиям труда, ' +
+    'взаимодействию, адаптации, развитию и другим вопросам, связанным с работой в компании.',
+
   // Две сноски с разным числом звёздочек — как в исходной форме, чтобы читалось
   // как два отдельных примечания, а не слитный абзац. Field рендерит их построчно.
   anonymousHint:
@@ -28,6 +33,7 @@ export const TEXTS = {
 
   placeholders: {
     company: 'Выберите компанию',
+    companyLoading: 'Загружаем список компаний…',
     fullName: 'Нурлан Нурланович Нурланов',
     position: 'Например: инженер-проектировщик',
     kindOther: 'Свой вариант',
@@ -46,7 +52,9 @@ export const TEXTS = {
     required: 'Заполните поле',
     selectRequired: 'Выберите значение',
     tooShort: 'Слишком короткий ответ — опишите подробнее',
-    hasErrors: 'Проверьте выделенные поля — что-то заполнено не полностью.'
+    hasErrors: 'Проверьте выделенные поля — что-то заполнено не полностью.',
+    submitFailed: 'Не удалось отправить обращение. Попробуйте ещё раз позже.',
+    companiesFailed: 'Не удалось загрузить список компаний. Обновите страницу.'
   },
 
   thanks: {

src/features/feedback/useCompanies.ts

@@ -0,0 +1,57 @@
+import { useEffect, useState } from 'react';
+import type { ISelectOption } from '@tnsu/ui-kit';
+
+interface ICompanyDto {
+  Id: string;
+  Name: string;
+}
+
+export interface ICompaniesState {
+  options: ISelectOption[];
+  isLoading: boolean;
+  /** Непустая строка — справочник не загрузился, выбрать компанию нельзя. */
+  error: string;
+}
+
+/**
+ * Справочник компаний приходит из api.tnsu.kz через наш сервис (/api/companies),
+ * а не лежит в коде: список юрлиц группы меняется без нашего участия, а копия в
+ * репозитории неизбежно разошлась бы с источником.
+ */
+export function useCompanies(): ICompaniesState {
+  const [options, setOptions] = useState<ISelectOption[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    // Форма живёт до перезагрузки страницы, но размонтирование в dev-режиме
+    // (StrictMode, hot reload) случается — не даём setState после него.
+    let cancelled = false;
+
+    fetch('/api/companies')
+      .then(async (response) => {
+        if (!response.ok) {
+          throw new Error(`Сервер вернул ${response.status}`);
+        }
+        return (await response.json()) as ICompanyDto[];
+      })
+      .then((companies) => {
+        if (cancelled) return;
+        setOptions(companies.map(({ Id, Name }) => ({ value: Id, label: Name })));
+        setIsLoading(false);
+      })
+      .catch((cause) => {
+        if (cancelled) return;
+        // eslint-disable-next-line no-console
+        console.error('Не удалось загрузить справочник компаний:', cause);
+        setError(String(cause));
+        setIsLoading(false);
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  return { options, isLoading, error };
+}

src/features/feedback/useFeedbackForm.ts

@@ -18,8 +18,8 @@ export interface IFeedbackForm {
 
 /**
  * Состояние формы обращения: данные, валидация, отправка.
- * Бэкенда пока нет — submit только имитирует отправку (см. TODO ниже),
+ * Отправка идёт через nginx (/api/... -> hr-appeals-auth) — сервис сам
- * поэтому вся логика синхронная и живёт здесь, без сервисного слоя.
+ * меняет её на app-only токен и создаёт элемент в списке SharePoint.
  */
 export function useFeedbackForm(): IFeedbackForm {
   const [data, setData] = useState<IFeedbackData>(EMPTY_FEEDBACK);
@@ -53,11 +53,24 @@ export function useFeedbackForm(): IFeedbackForm {
     setFormError('');
     setStatus('submitting');
 
-    // TODO: заменить на реальную отправку, когда определимся с бэкендом.
+    fetch('/api/feedback', {
-    // Сейчас это заглушка по договорённости: делаем только UI.
+      method: 'POST',
-    // eslint-disable-next-line no-console
+      headers: { 'Content-Type': 'application/json' },
-    console.info('Обращение (заглушка отправки):', data);
+      body: JSON.stringify(data)
+    })
+      .then(async (response) => {
+        if (!response.ok) {
+          const body = await response.json().catch(() => null);
+          throw new Error(body?.error ?? `Сервер вернул ${response.status}`);
+        }
         setStatus('done');
+      })
+      .catch((error) => {
+        // eslint-disable-next-line no-console
+        console.error('Не удалось отправить обращение:', error);
+        setFormError(TEXTS.errors.submitFailed);
+        setStatus('idle');
+      });
   }, [data]);
 
   const reset = useCallback((): void => {

vite.config.ts

@@ -12,7 +12,16 @@ export default defineConfig({
   },
   server: {
     port: 3000,
-    open: true
+    open: true,
+    // Как nginx в проде (nginx.conf): /api/... идёт на hr-appeals-auth без
+    // префикса. Локально сервис запускаем на 3100 — порт 3000 занят самим vite.
+    proxy: {
+      '/api': {
+        target: 'http://localhost:3100',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, '')
+      }
+    }
   },
   test: {
     // globals: true — describe/it/expect доступны без импорта, как привычно по Jest.