From 6f76809e9ebbc0b68996b27b0b975be2c2b35885 Mon Sep 17 00:00:00 2001
From: vladtechno <vladtechno@gmail.com>
Date: Thu, 18 Jun 2026 19:27:21 +1000
Subject: [PATCH] feat(driver-pwa): onboarding (connect TG/MAX bot)

Co-Authored-By: claude-flow <ruv@ruv.net>
---
 .../src/pages/OnboardingPage.test.tsx         | 17 ++++++++++++
 .../frontend/src/pages/OnboardingPage.tsx     | 27 ++++++++++++++++++-
 2 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 driver-pwa/frontend/src/pages/OnboardingPage.test.tsx

diff --git a/driver-pwa/frontend/src/pages/OnboardingPage.test.tsx b/driver-pwa/frontend/src/pages/OnboardingPage.test.tsx
new file mode 100644
index 0000000..126639a
--- /dev/null
+++ b/driver-pwa/frontend/src/pages/OnboardingPage.test.tsx
@@ -0,0 +1,17 @@
+import { describe, it, expect, beforeEach } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { MemoryRouter } from "react-router-dom";
+import { OnboardingPage } from "./OnboardingPage";
+
+describe("OnboardingPage", () => {
+  beforeEach(() =>
+    sessionStorage.setItem("pp-onboarding", JSON.stringify({ tg: "https://t.me/b?start=x", max: "https://max.ru/b?start=x", phone: "9143054400" }))
+  );
+  it("shows both bot links + back-to-code action", () => {
+    render(<MemoryRouter><OnboardingPage /></MemoryRouter>);
+    expect(screen.getByText(/Подключите бот/i)).toBeInTheDocument();
+    expect(screen.getByRole("link", { name: /Telegram/i })).toHaveAttribute("href", "https://t.me/b?start=x");
+    expect(screen.getByRole("link", { name: /MAX/i })).toHaveAttribute("href", "https://max.ru/b?start=x");
+    expect(screen.getByRole("button", { name: /запросить код/i })).toBeInTheDocument();
+  });
+});
diff --git a/driver-pwa/frontend/src/pages/OnboardingPage.tsx b/driver-pwa/frontend/src/pages/OnboardingPage.tsx
index ea25e3f..a7e1ce9 100644
--- a/driver-pwa/frontend/src/pages/OnboardingPage.tsx
+++ b/driver-pwa/frontend/src/pages/OnboardingPage.tsx
@@ -1 +1,26 @@
-export function OnboardingPage() { return null; }
+import { useNavigate } from "react-router-dom";
+
+export function OnboardingPage() {
+  const nav = useNavigate();
+  const raw = sessionStorage.getItem("pp-onboarding");
+  const data = raw ? (JSON.parse(raw) as { tg: string; max: string; phone: string }) : null;
+  if (!data) return null;
+
+  return (
+    <div className="pt-16">
+      <h1 className="text-xl font-extrabold mb-1">Подключите бот</h1>
+      <p className="text-muted text-sm mb-8">
+        Чтобы получать код входа, откройте бот и нажмите «Старт». Затем вернитесь и запросите код снова.
+      </p>
+      <a href={data.tg} target="_blank" rel="noopener" className="btn-primary mb-3 no-underline block">
+        Подключить Telegram
+      </a>
+      <a href={data.max} target="_blank" rel="noopener" className="btn-ghost mb-6 no-underline block">
+        Подключить MAX
+      </a>
+      <button className="btn-ghost" onClick={() => nav("/login")}>
+        Я подключил — запросить код
+      </button>
+    </div>
+  );
+}