feat: справочник компаний из api.tnsu.kz вместо копии в коде
Список юрлиц группы меняется без нашего участия, а две копии в репозитории (COMPANY_OPTIONS во фронте и COMPANY_NAMES на сервере) неизбежно разошлись бы с источником и между собой. Теперь единственный источник — /Dictionary/Companies: - GET /companies проксирует справочник, чтобы токен не утекал в браузер; - имя компании для колонки Company резолвится по нему же, на сервере; - в кэше 10 минут — новое юрлицо подхватится без перезапуска сервиса. Пока список грузится, в select показывается «Загружаем…»; если не загрузился — ошибка в слоте обязательного поля, а не пустой список. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,52 @@
|
|||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
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 companies = (await response.json()) as ICompany[];
|
||||||
|
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;
|
||||||
|
}
|
||||||
@@ -1,4 +1,5 @@
|
|||||||
import express from 'express';
|
import express from 'express';
|
||||||
|
import { getCompanies } from './companies';
|
||||||
import { config } from './config';
|
import { config } from './config';
|
||||||
import { getAppOnlyToken } from './graphAuth';
|
import { getAppOnlyToken } from './graphAuth';
|
||||||
import { submitFeedback } from './sharepoint';
|
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) => {
|
app.post('/feedback', async (req, res) => {
|
||||||
try {
|
try {
|
||||||
await submitFeedback(req.body);
|
await submitFeedback(req.body);
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { resolveCompanyName } from './companies';
|
||||||
import { config } from './config';
|
import { config } from './config';
|
||||||
import { getAppOnlyToken } from './graphAuth';
|
import { getAppOnlyToken } from './graphAuth';
|
||||||
|
|
||||||
@@ -11,27 +12,6 @@ const KIND_LABELS: Record<AppealKind, string> = {
|
|||||||
other: 'Другое'
|
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 {
|
export interface IFeedbackSubmission {
|
||||||
company: string;
|
company: string;
|
||||||
isAnonymous: boolean;
|
isAnonymous: boolean;
|
||||||
@@ -46,18 +26,13 @@ export interface IFeedbackSubmission {
|
|||||||
|
|
||||||
// Имена полей — internal name столбцов списка SharePoint (Company/Name/Position/
|
// Имена полей — internal name столбцов списка SharePoint (Company/Name/Position/
|
||||||
// Type/IssueDescription/SuggestionText/WantsFeedback), не отображаемые названия.
|
// Type/IssueDescription/SuggestionText/WantsFeedback), не отображаемые названия.
|
||||||
function buildFields(data: IFeedbackSubmission): Record<string, unknown> {
|
async function buildFields(data: IFeedbackSubmission): Promise<Record<string, unknown>> {
|
||||||
const typeLabel = data.kind === 'other' ? data.kindOther : KIND_LABELS[data.kind];
|
const typeLabel = data.kind === 'other' ? data.kindOther : KIND_LABELS[data.kind];
|
||||||
const name = data.isAnonymous ? '' : data.fullName;
|
const name = data.isAnonymous ? '' : data.fullName;
|
||||||
const companyName = COMPANY_NAMES[data.company];
|
|
||||||
|
|
||||||
if (!companyName) {
|
|
||||||
console.warn(`Неизвестный id компании из формы, отправляю как есть: ${data.company}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
const fields: Record<string, unknown> = {
|
const fields: Record<string, unknown> = {
|
||||||
Title: name ? `${typeLabel} — ${name}` : typeLabel,
|
Title: name ? `${typeLabel} — ${name}` : typeLabel,
|
||||||
Company: companyName ?? data.company,
|
Company: await resolveCompanyName(data.company),
|
||||||
Name: name,
|
Name: name,
|
||||||
Position: data.isAnonymous ? '' : data.position,
|
Position: data.isAnonymous ? '' : data.position,
|
||||||
Type: typeLabel,
|
Type: typeLabel,
|
||||||
@@ -90,7 +65,7 @@ export async function submitFeedback(data: IFeedbackSubmission): Promise<void> {
|
|||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
siteUrl: config.sharepointSiteUrl,
|
siteUrl: config.sharepointSiteUrl,
|
||||||
listName: config.sharepointListName,
|
listName: config.sharepointListName,
|
||||||
fields: buildFields(data)
|
fields: await buildFields(data)
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { COMPANY_OPTIONS, getAppealFieldsConfig } from './model';
|
import { getAppealFieldsConfig } from './model';
|
||||||
|
|
||||||
// Форма (AppealSection) и валидация (validateFeedback) читают одно и то же
|
// Форма (AppealSection) и валидация (validateFeedback) читают одно и то же
|
||||||
// правило из getAppealFieldsConfig — если оно разойдётся, форма и валидация
|
// правило из 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);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|||||||
@@ -18,27 +18,6 @@ export interface IFeedbackData {
|
|||||||
suggestion: string;
|
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), так что выбор пользователя.
|
// значением ниже (EMPTY_FEEDBACK.kind), так что выбор пользователя.
|
||||||
export const KIND_OPTIONS: ISelectOption[] = [
|
export const KIND_OPTIONS: ISelectOption[] = [
|
||||||
|
|||||||
@@ -1,24 +1,33 @@
|
|||||||
import { FormGrid, Select, TextInput, Toggle } from '@tnsu/ui-kit';
|
import { FormGrid, Select, TextInput, Toggle } from '@tnsu/ui-kit';
|
||||||
import { Field } from '../../../components/Field/Field';
|
import { Field } from '../../../components/Field/Field';
|
||||||
import { COMPANY_OPTIONS } from '../model';
|
|
||||||
import { TEXTS } from '../texts';
|
import { TEXTS } from '../texts';
|
||||||
|
import { useCompanies } from '../useCompanies';
|
||||||
import type { ISectionProps } from './ISectionProps';
|
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>
|
<FormGrid>
|
||||||
|
{/* Ошибку справочника показываем в слоте ошибки поля: без списка компанию
|
||||||
|
не выбрать, а обязательное поле молча пустым оставлять нельзя. */}
|
||||||
<Field
|
<Field
|
||||||
label={TEXTS.labels.company}
|
label={TEXTS.labels.company}
|
||||||
htmlFor="company"
|
htmlFor="company"
|
||||||
required
|
required
|
||||||
error={errors.company}
|
error={companies.error ? TEXTS.errors.companiesFailed : errors.company}
|
||||||
>
|
>
|
||||||
<Select
|
<Select
|
||||||
id="company"
|
id="company"
|
||||||
value={data.company}
|
value={data.company}
|
||||||
onChange={(v) => set('company', v)}
|
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>
|
</Field>
|
||||||
|
|
||||||
@@ -60,3 +69,4 @@ export const AuthorSection: React.FC<ISectionProps> = ({ data, errors, set }) =>
|
|||||||
) : null}
|
) : null}
|
||||||
</FormGrid>
|
</FormGrid>
|
||||||
);
|
);
|
||||||
|
};
|
||||||
|
|||||||
@@ -28,6 +28,7 @@ export const TEXTS = {
|
|||||||
|
|
||||||
placeholders: {
|
placeholders: {
|
||||||
company: 'Выберите компанию',
|
company: 'Выберите компанию',
|
||||||
|
companyLoading: 'Загружаем список компаний…',
|
||||||
fullName: 'Нурлан Нурланович Нурланов',
|
fullName: 'Нурлан Нурланович Нурланов',
|
||||||
position: 'Например: инженер-проектировщик',
|
position: 'Например: инженер-проектировщик',
|
||||||
kindOther: 'Свой вариант',
|
kindOther: 'Свой вариант',
|
||||||
@@ -47,7 +48,8 @@ export const TEXTS = {
|
|||||||
selectRequired: 'Выберите значение',
|
selectRequired: 'Выберите значение',
|
||||||
tooShort: 'Слишком короткий ответ — опишите подробнее',
|
tooShort: 'Слишком короткий ответ — опишите подробнее',
|
||||||
hasErrors: 'Проверьте выделенные поля — что-то заполнено не полностью.',
|
hasErrors: 'Проверьте выделенные поля — что-то заполнено не полностью.',
|
||||||
submitFailed: 'Не удалось отправить обращение. Попробуйте ещё раз позже.'
|
submitFailed: 'Не удалось отправить обращение. Попробуйте ещё раз позже.',
|
||||||
|
companiesFailed: 'Не удалось загрузить список компаний. Обновите страницу.'
|
||||||
},
|
},
|
||||||
|
|
||||||
thanks: {
|
thanks: {
|
||||||
|
|||||||
@@ -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 };
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user