feat(pwa): значки операций в выписке

За неделю у активного водителя два десятка строк, и половина одинаковая по виду
(«аренда автомобиля» каждый день) — список сливается в стену текста. Значок даёт
зацепку для глаза: нужное находится, не читая каждую строку.

Подбор по тегу 1С, а не по знаку суммы: аренда, пени, штраф, ДТП, депозит,
пополнение, компенсация, коррекция — у каждого свой. Общий компонент, как в
складе CRM: разложенные по местам иконки разъезжаются размерами при первой правке.

Монохромные намеренно — цвет в этом списке уже занят и означает направление
денег, цветной значок с ним бы спорил.

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

driver-pwa/frontend/src/components/operationIcon.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from "vitest";
+import { operationIcon } from "./operationIcon";
+
+/** Названия — настоящие теги 1С из выписки (finance_ledger_entries.tag). */
+describe("значок операции", () => {
+  it("разные виды операций различаются", () => {
+    const names = [
+      "Аренда автомобиля",
+      "Пени",
+      "Штраф ГИБДД",
+      "Пополнение баланса через мобильное приложение",
+      "ДТП",
+      "Перевод с депозита на баланс",
+    ].map((t) => operationIcon(t));
+    expect(new Set(names).size).toBe(names.length);
+  });
+
+  it("штраф ГИБДД и штраф компании — один значок: для водителя это одно и то же", () => {
+    expect(operationIcon("Штраф ГИБДД")).toBe(operationIcon("Штраф компании"));
+  });
+
+  it("незнакомый тег получает нейтральный значок, а не пустоту", () => {
+    expect(operationIcon("Списание за что-то новое")).toBeTruthy();
+  });
+});