Реализован интерфейс согласий

codebase/backend/frontend-test-site/app/index.tsx

@@ -1,10 +1,11 @@
 import { useQuery } from "@tanstack/react-query";
 import { useRouter } from "expo-router";
 import React, { useState } from "react";
-import { Linking, ScrollView, Switch, Text, View } from "react-native";
+import { ScrollView, Text, View } from "react-native";
 import { useApp } from "../src/app-context";
 import { AppHeader } from "../src/components/AppHeader";
 import { ChatInputBar } from "../src/components/ChatInputBar";
+import { ConsentModal } from "../src/components/ConsentModal";
 import { HanLogo } from "../src/components/HanLogo";
 import { PopularQuestionsList } from "../src/components/PopularQuestionsList";
 import { QuickActions } from "../src/components/QuickActions";
@@ -17,14 +18,13 @@ import {
 } from "../src/pending-intent";
 import { dialogApi, publicApi, uploadAttachment } from "../src/services";
 import type { Consents } from "../src/types";
-import { Button, ErrorNotice, Loading, styles } from "../src/ui";
+import { ErrorNotice, Loading, styles } from "../src/ui";
 
 export default function HomeScreen() {
   const { authStatus, authorize } = useApp();
   const config = useQuery({ queryKey: ["public-config"], queryFn: publicApi.config });
   const content = useQuery({ queryKey: ["public-content"], queryFn: publicApi.content });
   const [consentOpen, setConsentOpen] = useState(false);
-  const [required, setRequired] = useState({ personal: false, agreement: false, marketing: false });
   const [pending, setPending] = useState<PendingTextIntent | null>(null);
   const [message, setMessage] = useState("");
   const [sendError, setSendError] = useState<unknown>();
@@ -111,13 +111,16 @@ export default function HomeScreen() {
     }
   };
 
-  const accept = async () => {
-    if (!required.personal || !required.agreement) return;
+  const accept = async (accepted: {
+    personal_data: boolean;
+    user_agreement: boolean;
+    marketing: boolean;
+  }) => {
     const versions = config.data?.consents;
     const consents: Consents = {
-      personal_data: { accepted: true, version: versions?.personal_data?.version ?? "current" },
-      user_agreement: { accepted: true, version: versions?.user_agreement?.version ?? "current" },
-      marketing: { accepted: required.marketing, version: versions?.marketing?.version ?? "current" },
+      personal_data: { accepted: accepted.personal_data, version: versions?.personal_data?.version ?? "current" },
+      user_agreement: { accepted: accepted.user_agreement, version: versions?.user_agreement?.version ?? "current" },
+      marketing: { accepted: accepted.marketing, version: versions?.marketing?.version ?? "current" },
     };
     setConsentOpen(false);
     try {
@@ -165,46 +168,18 @@ export default function HomeScreen() {
       </View>
 
       {consentOpen && (
-        <View accessibilityViewIsModal style={styles.modalBackdrop}>
-          <View style={styles.modal}>
-            <Text accessibilityRole="header" style={styles.heading}>Согласия перед входом</Text>
-            <Text style={styles.text}>Для отправки сообщения или файла необходимо войти по номеру телефона. Код вводится только на защищённой странице авторизации.</Text>
-            {(["personal_data", "user_agreement", "marketing"] as const).map((key) => {
-              const item = config.data?.consents?.[key];
-              if (!item) return null;
-              return item.document_url ? (
-                <Text key={key} accessibilityRole="link" style={styles.link} onPress={() => void Linking.openURL(item.document_url!)}>
-                  {key === "personal_data" ? "Политика персональных данных" : key === "user_agreement" ? "Пользовательское соглашение" : "Согласие на рекламу"} · версия {item.version}
-                </Text>
-              ) : null;
-            })}
-            <ConsentRow label="Обработка персональных данных (обязательно)" value={required.personal} onChange={(personal) => setRequired({ ...required, personal })} />
-            <ConsentRow label="Пользовательское соглашение (обязательно)" value={required.agreement} onChange={(agreement) => setRequired({ ...required, agreement })} />
-            <ConsentRow label="Рекламные коммуникации (необязательно)" value={required.marketing} onChange={(marketing) => setRequired({ ...required, marketing })} />
-            <View style={styles.row}>
-              <Button title="Продолжить" disabled={!required.personal || !required.agreement} onPress={() => void accept()} />
-              <Button
-                title="Отмена"
-                secondary
-                onPress={() => {
-                  setConsentOpen(false);
-                  setPending(null);
-                  clearPendingTextIntent();
-                }}
-              />
-            </View>
-          </View>
-        </View>
+        <ConsentModal
+          consents={config.data?.consents}
+          onAccept={(accepted) => void accept(accepted)}
+          onCancel={() => {
+            setConsentOpen(false);
+            setPending(null);
+            clearPendingTextIntent();
+          }}
+        />
       )}
     </ScreenShell>
   );
 }
 
 const spacing = 16;
-
-function ConsentRow({ label, value, onChange }: { label: string; value: boolean; onChange: (value: boolean) => void }) {
-  return <View style={[styles.row, { justifyContent: "space-between" }]}>
-    <Text style={[styles.text, { flex: 1 }]}>{label}</Text>
-    <Switch accessibilityLabel={label} value={value} onValueChange={onChange} />
-  </View>;
-}