Panel klienta VulCode

VulCode - наш собственный бренд, поэтому эту панель мы строили для себя, и это оказалось самым трудным из возможных клиентом. Когда делаете что-то для себя, спрятаться не за кого: каждое упрощение, каждое число, которое не сходится, возвращается прямо к вам. Поэтому с самого начала этот проект должен был стать образцом того, как вообще выглядит у нас клиентская панель, а не времянкой для внутреннего пользования.

Задача звучала просто: дать клиенту одно место, где он видит всё, что его касается, и сам решает вопросы, которые раньше требовали письма. На практике это означало связать сразу несколько миров - состояние проектов, счета, обращения в поддержку и партнёрскую программу, считающую реальные деньги - в один цельный экран, который одинаково работает на столе и в кармане. Это исследование показывает, где были настоящие ловушки и как мы их обошли.

До панели каждый вопрос об этапе проекта или о документе заканчивался письмом, а ответ зависел от того, кто его прочитал и помнил ли он контекст. Это не масштабируется даже на десяток клиентов: одна и та же информация жила в почтовом ящике одного человека, а клиент ждал вместо того, чтобы просто посмотреть.

Панель переворачивает это. Клиент входит и сразу видит перед собой свои проекты со статусом работ, список счетов с тем, что оплачено и что к оплате, и историю всех обращений, которые он когда-либо открывал. Ничего не нужно выискивать в письмах, потому что источник правды - одно представление, а не чья-то память.

Эффект ощутим с обеих сторон. Клиент перестаёт ждать человека, чтобы узнать то, что система и так знает. Команда перестаёт отвечать на одни и те же вопросы в сотый раз, потому что ответ уже на экране раньше, чем кто-либо его наберёт.

Партнёрская программа выглядит безобидно, пока не начнёте считать комиссии на суммах с grosze. Тут начинаются классические драмы: десять процентов от 19.99 zł, посчитанные на числе с плавающей точкой, могут дать три слегка разных результата в списке комиссий, в кошельке и на выплате, и тогда балансы перестают сходиться и панели никто не доверяет.

Поэтому по всей панели мы храним деньги как целые числа в grosze и считаем каждую комиссию на целых. Здесь никогда нет доли злотого, которая могла бы округлиться то в одну, то в другую сторону. Одна операция, одно правило округления вниз, один и тот же результат везде, где эта сумма появляется.

Клиентская панель показывает деньги и документы, поэтому вопрос "кто вправе это видеть" не косметический. Клиент должен видеть исключительно свои данные, команда - только то, на что имеет право, и граница между ними не может зависеть от того, спрятал ли фронтенд кнопку.

Мы построили это на ролевом контроле доступа и безопасной аутентификации, но ключевое решение архитектурное: объём того, что можно увидеть и сделать, проверяет бэкенд на входе в API, а не интерфейс. Фронтенд может показывать или прятать что угодно, но если запрос касается чужих данных, API отклоняет его ещё до того, как он доберётся до базы.

Это тот же принцип, который мы применяем везде: границу стерегут там, где входят данные извне, то есть на API, и не рассчитывают на то, что пользователь не подменит идентификатор в адресе.

Клиент не сидит всё время за компьютером. Счёт он проверяет в трамвае, на уведомление об обращении реагирует с телефона. Строить для этого отдельное мобильное приложение означало бы второй код для поддержки и уверенность, что рано или поздно две версии разойдутся.

Вместо этого панель - веб-приложение, которое ставится на телефон как PWA, с манифестом и service worker. Тот же код, тот же бэкенд, та же логика комиссий. На компьютере это полноценный рабочий стол, на телефоне - иконка на главном экране и окно без панели браузера, ведущее себя как нативное приложение.

Проще всего сделать панель, которая красиво выглядит на заранее подготовленных числах. Она выглядит красиво, пока кто-нибудь не кликнет и не окажется, что под ней ничего нет. Мы пошли обратным путём: панель с первого дня стоит на настоящем бэкенде, и каждый экран показывает то, что действительно есть в базе.

Этот выбор дороже на старте, потому что нужен работающий API прежде, чем что-либо нарисуется. Но он окупается сразу, потому что нет момента "данные подключим позже", в котором обычно всплывают все допущения, не пережившие контакта с реальностью. То, что видно в панели, - это то, что система на самом деле знает.

Клиент получает одно место, где он видит своё состояние и сам решает вопросы, которые раньше требовали письма команде. Он входит, проверяет проект, скачивает счёт, отвечает в обращении, смотрит на баланс комиссий из партнёрской программы, а если он в дороге, делает то же самое с телефона, потому что это то же приложение. Ничто из этого не зависит от того, сидит ли кто-то из команды у почтового ящика.

С нашей стороны выгода столь же конкретна. Партнёрская программа работает без того, чтобы кто-то пересчитывал что-либо вручную, потому что её стережёт код на целых числах, а не таблица, которую кто-то должен сводить. Балансы сходятся, потому что нет места, где мог бы родиться сбой округления. Команда возвращает себе время, которое раньше уходило на ответы на одни и те же вопросы.

Самое важное, однако, в том, что эта панель стала нашим образцом. Ядро, на котором она стоит, - роли, кошельки, комиссии, обращения, i18n, режим приложения - достаточно чистое, чтобы его удалось перенести на другие бренды без переписывания с нуля. Мы начали с самого трудного клиента, с самих себя, и получилась архитектура, которую потом мы лишь одевали в новые цвета.