Реестр пакетов и ссылки на git.tnsu.kz — по https

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
+    }
+  ]
+}

.dockerignore

@@ -0,0 +1,7 @@
+node_modules
+dist
+dist-ssr
+.git
+.vscode
+.idea
+npm-debug.log*

.gitea/workflows/deploy.yml

@@ -0,0 +1,123 @@
+name: build-and-deploy
+
+# Прод — единственное окружение деплоя, поэтому катим при каждом пуше в main.
+# Раннер должен быть self-hosted во внутренней сети: Nexus (nexus.tnsu.kz) снаружи
+# не достаётся. workflow_dispatch — на случай ручного передеплоя (например, старым тегом).
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+    inputs:
+      image_tag:
+        description: "Тег образа (по умолчанию — короткий sha коммита)"
+        required: false
+        default: ""
+
+env:
+  REGISTRY: nexus.tnsu.kz:8082
+
+jobs:
+  # Единый источник тега для образа и для деплоя
+  prepare:
+    runs-on: ubuntu-22.04
+    outputs:
+      tag: ${{ steps.vars.outputs.tag }}
+    steps:
+      - name: Resolve image tag
+        id: vars
+        run: |
+          TAG="${{ github.event.inputs.image_tag }}"
+          if [ -z "$TAG" ]; then TAG="${GITHUB_SHA::8}"; fi
+          echo "tag=$TAG" >> "$GITHUB_OUTPUT"
+
+  build-and-push:
+    needs: prepare
+    runs-on: ubuntu-22.04
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - image: hr-appeals-web
+            context: .
+            dockerfile: Dockerfile
+          - image: hr-appeals-auth
+            context: server
+            dockerfile: server/Dockerfile
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Ensure docker CLI is installed
+        run: |
+          set -e
+          SUDO=""
+          if [ "$(id -u)" -ne 0 ]; then SUDO="sudo"; fi
+          if ! command -v docker >/dev/null 2>&1; then
+            $SUDO apt-get update
+            $SUDO env DEBIAN_FRONTEND=noninteractive apt-get install -y --no-install-recommends docker.io
+          fi
+
+      - name: Docker login to Nexus
+        run: echo "${{ secrets.NEXUS_PASSWORD }}" | docker login "$REGISTRY" -u "${{ secrets.NEXUS_USER }}" --password-stdin
+
+      - name: Build image
+        run: |
+          docker build \
+            -f "${{ matrix.dockerfile }}" \
+            -t "$REGISTRY/${{ matrix.image }}:${{ needs.prepare.outputs.tag }}" \
+            -t "$REGISTRY/${{ matrix.image }}:latest" \
+            "${{ matrix.context }}"
+
+      - name: Push image
+        run: |
+          docker push "$REGISTRY/${{ matrix.image }}:${{ needs.prepare.outputs.tag }}"
+          docker push "$REGISTRY/${{ matrix.image }}:latest"
+
+      - name: Docker logout
+        if: always()
+        run: docker logout "$REGISTRY"
+
+  deploy:
+    needs: [prepare, build-and-push]
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Ensure ssh client is installed
+        run: |
+          set -e
+          SUDO=""
+          if [ "$(id -u)" -ne 0 ]; then SUDO="sudo"; fi
+          if ! command -v ssh >/dev/null 2>&1 || ! command -v scp >/dev/null 2>&1 || ! command -v ssh-keyscan >/dev/null 2>&1; then
+            $SUDO apt-get update
+            $SUDO env DEBIAN_FRONTEND=noninteractive apt-get install -y --no-install-recommends openssh-client
+          fi
+
+      - name: Configure SSH
+        run: |
+          mkdir -p ~/.ssh
+          printf '%s\n' "${{ secrets.DEPLOY_SSH_KEY }}" > ~/.ssh/deploy_key
+          chmod 600 ~/.ssh/deploy_key
+          ssh-keyscan -H "${{ vars.DEPLOY_HOST }}" >> ~/.ssh/known_hosts
+
+      - name: Upload compose file
+        run: |
+          scp -i ~/.ssh/deploy_key docker-compose.yml \
+            "${{ vars.DEPLOY_USER }}@${{ vars.DEPLOY_HOST }}:${{ vars.DEPLOY_PATH }}/docker-compose.yml"
+
+      - name: Roll out
+        run: |
+          ssh -i ~/.ssh/deploy_key "${{ vars.DEPLOY_USER }}@${{ vars.DEPLOY_HOST }}" "
+            set -e
+            cd '${{ vars.DEPLOY_PATH }}'
+            sed -i '/^IMAGE_TAG=/d' .env
+            echo 'IMAGE_TAG=${{ needs.prepare.outputs.tag }}' >> .env
+            docker compose pull
+            docker compose up -d --remove-orphans
+            docker image prune -f
+          "
+
+      - name: Cleanup SSH key
+        if: always()
+        run: rm -f ~/.ssh/deploy_key

.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=https://git.tnsu.kz/api/packages/tansu/npm/

Dockerfile

@@ -0,0 +1,16 @@
+# syntax=docker/dockerfile:1
+
+FROM node:20-alpine AS build
+WORKDIR /app
+
+COPY package.json package-lock.json .npmrc ./
+RUN npm ci
+
+COPY . .
+RUN npm run build
+
+FROM nginx:1.27-alpine AS runtime
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=build /app/dist /usr/share/nginx/html
+
+EXPOSE 80

README.md

@@ -11,7 +11,7 @@
 - React 17 + TypeScript (строгий режим)
 - Vite 6
 - SCSS Modules
-- [`@tnsu/ui-kit`](http://git.tnsu.kz/timur.gorodetskiy/tnsu-ui-kit) — общие UI-компоненты
+- [`@tnsu/ui-kit`](https://git.tnsu.kz/timur.gorodetskiy/tnsu-ui-kit) — общие UI-компоненты
 - Vitest — тесты бизнес-логики
 
 React именно 17-й: `@tnsu/ui-kit` объявляет его в `peerDependencies`.
@@ -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

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

nginx.conf

@@ -0,0 +1,18 @@
+server {
+    listen 80;
+    server_name _;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    # Запросы к Graph/SharePoint идут не из браузера, а через сервис
+    # hr-appeals-auth — он подписывает JWT сертификатом и меняет его на
+    # app-only токен, клиенту токен и приватный ключ не видны.
+    location /api/ {
+        proxy_pass http://hr-appeals-auth:3000/;
+    }
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

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": "https://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/.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+dist

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/Dockerfile

@@ -0,0 +1,22 @@
+# syntax=docker/dockerfile:1
+
+FROM node:20-alpine AS build
+WORKDIR /app
+
+COPY package.json package-lock.json ./
+RUN npm ci
+
+COPY . .
+RUN npm run build
+
+FROM node:20-alpine AS runtime
+WORKDIR /app
+ENV NODE_ENV=production
+
+COPY package.json package-lock.json ./
+RUN npm ci --omit=dev
+
+COPY --from=build /app/dist ./dist
+
+EXPOSE 3000
+CMD ["node", "dist/index.js"]

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

@@ -0,0 +1,24 @@
+{
+  "name": "hr-appeals-auth",
+  "version": "0.1.0",
+  "private": true,
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "build": "tsc",
+    "start": "node dist/index.js",
+    "dev": "tsc && node --env-file=.env dist/index.js",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "express": "^4.21.2",
+    "jsonwebtoken": "^9.0.2"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.21",
+    "@types/jsonwebtoken": "^9.0.7",
+    "@types/node": "^22.20.1",
+    "typescript": "~5.8.0"
+  }
+}

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

@@ -0,0 +1,33 @@
+import { join, resolve } from 'node:path';
+
+function requireEnv(name: string): string {
+  const value = process.env[name];
+  if (!value) {
+    throw new Error(`Не задана переменная окружения ${name}`);
+  }
+  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: join(secretsDir, 'SPFxDeploy_cert.pem'),
+  keyPath: join(secretsDir, 'SPFxDeploy_key.pem'),
+  // Токен нужен не для 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

@@ -0,0 +1,96 @@
+import { readFileSync } from 'node:fs';
+import { createHash, randomUUID } from 'node:crypto';
+import jwt from 'jsonwebtoken';
+import { config } from './config';
+
+interface CachedToken {
+  accessToken: string;
+  expiresAt: number;
+}
+
+interface TokenResponse {
+  access_token: string;
+  expires_in: number;
+}
+
+const TOKEN_ENDPOINT = `https://login.microsoftonline.com/${config.tenantId}/oauth2/v2.0/token`;
+
+// Обновляем токен заранее, а не строго по истечении — иначе запрос, уже летящий
+// к Graph с почти протухшим токеном, может получить 401.
+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 = readSecret(config.certPath);
+  const privateKey = readSecret(config.keyPath);
+
+  // x5t — SHA-1 отпечаток DER-сертификата, base64url. По нему Azure AD находит
+  // публичный ключ приложения и проверяет подпись JWT.
+  const der = certificatePem
+    .replace(/-----BEGIN CERTIFICATE-----/, '')
+    .replace(/-----END CERTIFICATE-----/, '')
+    .replace(/\s+/g, '');
+  const thumbprint = createHash('sha1').update(Buffer.from(der, 'base64')).digest('base64url');
+
+  const nowSeconds = Math.floor(Date.now() / 1000);
+
+  return jwt.sign(
+    {
+      aud: TOKEN_ENDPOINT,
+      iss: config.clientId,
+      sub: config.clientId,
+      jti: randomUUID(),
+      nbf: nowSeconds,
+      exp: nowSeconds + 5 * 60
+    },
+    privateKey,
+    { algorithm: 'RS256', header: { alg: 'RS256', x5t: thumbprint } }
+  );
+}
+
+export async function getAppOnlyToken(): Promise<string> {
+  if (cached && cached.expiresAt - REFRESH_MARGIN_MS > Date.now()) {
+    return cached.accessToken;
+  }
+
+  const body = new URLSearchParams({
+    grant_type: 'client_credentials',
+    client_id: config.clientId,
+    client_assertion_type: 'urn:ietf:params:oauth:client-assertion-type:jwt-bearer',
+    client_assertion: buildClientAssertion(),
+    scope: config.scope
+  });
+
+  const response = await fetch(TOKEN_ENDPOINT, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    body
+  });
+
+  if (!response.ok) {
+    throw new Error(`Не удалось получить app-only токен: ${response.status} ${await response.text()}`);
+  }
+
+  const data = (await response.json()) as TokenResponse;
+  cached = {
+    accessToken: data.access_token,
+    expiresAt: Date.now() + data.expires_in * 1000
+  };
+  return cached.accessToken;
+}

server/src/index.ts

@@ -0,0 +1,54 @@
+import express from 'express';
+import { getCompanies } from './companies';
+import { config } from './config';
+import { getAppOnlyToken } from './graphAuth';
+import { submitFeedback } from './sharepoint';
+
+const app = express();
+app.use(express.json());
+
+app.get('/healthz', (_req, res) => {
+  res.status(200).send('ok');
+});
+
+// Временный диагностический эндпоинт: подтверждает, что связка
+// "сертификат -> подписанный JWT -> access-токен" реально работает,
+// до того как появится сама логика сохранения формы в Graph/SharePoint.
+app.get('/diag/token', async (_req, res) => {
+  try {
+    await getAppOnlyToken();
+    res.status(200).json({ ok: true });
+  } catch (error) {
+    res.status(502).json({ ok: false, error: (error as Error).message });
+  }
+});
+
+// Справочник компаний для выпадающего списка формы. Ходит в 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);
+    res.status(201).json({ ok: true });
+  } catch (error) {
+    const message = (error as Error).message;
+    // Логируем целиком в stdout прод-контейнера — если отвалится авторизация
+    // (протухший/незарегистрированный сертификат, неверный scope), это должно
+    // быть видно сразу в логах, а не тонуть в одной строке ответа клиенту.
+    console.error('Не удалось отправить обращение в SharePoint:', message);
+    res.status(502).json({ ok: false, error: message });
+  }
+});
+
+app.listen(config.port, () => {
+  console.log(`hr-appeals-auth listening on :${config.port}`);
+});

server/src/sharepoint.ts

@@ -0,0 +1,96 @@
+import { resolveCompanyName } from './companies';
+import { config } from './config';
+import { getAppOnlyToken } from './graphAuth';
+
+const SHAREPOINT_API_URL = 'https://api.tnsu.kz/SharePoint/ListItem';
+
+export type AppealKind = 'complaint' | 'suggestion' | 'other';
+
+const KIND_LABELS: Record<AppealKind, string> = {
+  complaint: 'Обращение',
+  suggestion: 'Предложение',
+  other: 'Другое'
+};
+
+export interface IFeedbackSubmission {
+  company: string;
+  isAnonymous: boolean;
+  fullName: string;
+  position: string;
+  wantsFeedback: boolean;
+  kind: AppealKind;
+  kindOther: string;
+  situation: string;
+  suggestion: string;
+}
+
+// 5 рабочих дней от текущей даты, выходные (сб/вс) не считаются днём срока —
+// используется как крайний срок обработки обращения (AppealDueDate).
+function addBusinessDays(from: Date, days: number): Date {
+  const result = new Date(from);
+  let remaining = days;
+
+  while (remaining > 0) {
+    result.setDate(result.getDate() + 1);
+    const dayOfWeek = result.getDay(); // 0 = воскресенье, 6 = суббота
+    if (dayOfWeek !== 0 && dayOfWeek !== 6) {
+      remaining -= 1;
+    }
+  }
+
+  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: await resolveCompanyName(data.company),
+    Name: name,
+    Position: data.isAnonymous ? '' : data.position,
+    Type: typeLabel,
+    IssueDescription: data.situation,
+    SuggestionText: data.suggestion,
+    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> {
+  const token = await getAppOnlyToken();
+
+  const response = await fetch(SHAREPOINT_API_URL, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${token}`
+    },
+    body: JSON.stringify({
+      siteUrl: config.sharepointSiteUrl,
+      listName: config.sharepointListName,
+      fields: await buildFields(data)
+    })
+  });
+
+  if (!response.ok) {
+    throw new Error(
+      `api.tnsu.kz вернул ошибку при создании элемента списка: ${response.status} ${await response.text()}`
+    );
+  }
+}

server/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "lib": ["ES2022"],
+    "outDir": "dist",
+    "rootDir": "src",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": ["src"]
+}

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,10 +1,10 @@
-import { COMPANY_OPTIONS, getAppealFieldsConfig } from './model';
+import { getAppealFieldsConfig } from './model';
 
 // Форма (AppealSection) и валидация (validateFeedback) читают одно и то же
 // правило из getAppealFieldsConfig — если оно разойдётся, форма и валидация
 // начнут спорить друг с другом. Эти тесты фиксируют контракт правила.
 describe('getAppealFieldsConfig', () => {
-  it('жалоба: описание обязательно, предложение показано, но необязательно', () => {
+  it('обращение: описание обязательно, предложение показано, но необязательно', () => {
     const fields = getAppealFieldsConfig('complaint');
     expect(fields.situation).toEqual({ visible: true, required: true });
     expect(fields.suggestion).toEqual({ visible: true, required: false });
@@ -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,32 +18,11 @@ 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[] = [
   { value: 'suggestion', label: 'Предложение' },
-  { value: 'complaint', label: 'Жалоба' },
+  { value: 'complaint', label: 'Обращение' },
   { value: 'other', label: 'Другое' }
 ];
 
@@ -61,7 +40,7 @@ export interface IAppealFieldsConfig {
 
 /**
  * Состав полей зависит от вида обращения:
- *   жалоба      — обязательно описание, а предложение — на желание автора;
+ *   обращение   — обязательно описание, а предложение — на желание автора;
  *   предложение — только само предложение, «ситуации» ещё нет;
  *   другое      — свободное описание, без предложения.
  * Одно правило на форму и на валидацию, чтобы они не разошлись.

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,7 +33,8 @@ export const TEXTS = {
 
   placeholders: {
     company: 'Выберите компанию',
-    fullName: 'Иванов Иван Иванович',
+    companyLoading: 'Загружаем список компаний…',
+    fullName: 'Нурлан Нурланович Нурланов',
     position: 'Например: инженер-проектировщик',
     kindOther: 'Свой вариант',
     situation: 'Опишите, что произошло: когда, где, кто участвовал',
@@ -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 => {

src/features/feedback/validateFeedback.test.ts

@@ -6,7 +6,7 @@ const VALID_COMPANY = '9de064a4-44c8-88ef-11ec-8285925d83d2';
 const LONG_TEXT = 'Развёрнутое описание, которого достаточно для проверки правила';
 const SHORT_TEXT = 'коротко';
 
-/** Полностью заполненное «жалоба»-обращение — стартовая точка для тестов. */
+/** Полностью заполненное обращение — стартовая точка для тестов. */
 function buildValidComplaint(overrides: Partial<IFeedbackData> = {}): IFeedbackData {
   return {
     ...EMPTY_FEEDBACK,
@@ -61,17 +61,17 @@ describe('validateFeedback: вид обращения "Другое"', () => {
 // Состав обязательных полей зависит от вида обращения (см. getAppealFieldsConfig
 // в model.ts) — эти тесты фиксируют контракт, чтобы форма и валидация не разошлись.
 describe('validateFeedback: обязательность полей по видам обращения', () => {
-  it('жалоба: описание ситуации обязательно', () => {
+  it('обращение: описание ситуации обязательно', () => {
     const errors = validateFeedback(buildValidComplaint({ situation: '' }));
     expect(errors.situation).toBeDefined();
   });
 
-  it('жалоба: предложение по улучшению НЕ обязательно', () => {
+  it('обращение: предложение по улучшению НЕ обязательно', () => {
     const errors = validateFeedback(buildValidComplaint({ suggestion: '' }));
     expect(errors.suggestion).toBeUndefined();
   });
 
-  it('жалоба: если предложение всё же указано, но слишком коротко — ошибка', () => {
+  it('обращение: если предложение всё же указано, но слишком коротко — ошибка', () => {
     const errors = validateFeedback(buildValidComplaint({ suggestion: SHORT_TEXT }));
     expect(errors.suggestion).toBeDefined();
   });

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.