Add MAX Mini App frontend flow

app/pages/login.vue

@@ -5,8 +5,8 @@ import {
   RequestLoginCodeDocument,
   VerifyLoginCodeDocument,
 } from '~/composables/graphql/generated';
+import { useMessengerMiniApp } from '~/composables/useMessengerMiniApp';
 import { useMessengerStart } from '~/composables/useMessengerStart';
-import { useTelegramMiniApp } from '~/composables/useTelegramMiniApp';
 
 const config = useRuntimeConfig();
 const route = useRoute();
@@ -31,7 +31,13 @@ const requestCodeMutation = useMutation(RequestLoginCodeDocument, { throws: 'nev
 const verifyCodeMutation = useMutation(VerifyLoginCodeDocument, { throws: 'never' });
 const consumeLoginTokenMutation = useMutation(ConsumeLoginTokenDocument, { throws: 'never' });
 const { openMessengerBot, pendingChannel } = useMessengerStart();
-const { isAvailable: isTelegramMiniApp, initData: telegramMiniAppInitData, displayName: telegramMiniAppDisplayName } = useTelegramMiniApp();
+const {
+  channel: messengerMiniAppChannel,
+  channelLabel: messengerMiniAppChannelLabel,
+  displayName: messengerMiniAppDisplayName,
+  initData: messengerMiniAppInitData,
+  isAvailable: isMessengerMiniApp,
+} = useMessengerMiniApp();
 
 const telegramBotUrl = computed(() => config.public.telegramBotUrl || '');
 const maxBotUrl = computed(() => config.public.maxBotUrl || '');
@@ -79,6 +85,9 @@ function normalizeApolloErrorMessage(message: string) {
   if (message.includes('Telegram initData')) {
     return 'Не получилось проверить Telegram Mini App. Откройте кабинет из Telegram заново.';
   }
+  if (message.includes('MAX initData')) {
+    return 'Не получилось проверить MAX Mini App. Откройте кабинет из MAX заново.';
+  }
   return message;
 }
 
@@ -159,7 +168,7 @@ async function verifyCode() {
   }
 
   await finalizeSession(payload.accessToken);
-  await connectTelegramMiniApp();
+  await connectMessengerMiniApp();
   await navigateAfterLogin(payload.user);
 }
 
@@ -183,8 +192,20 @@ async function consumeLoginToken(loginToken: string) {
   await navigateAfterLogin(payload.user);
 }
 
-async function connectTelegramMiniApp() {
-  if (!isTelegramMiniApp.value || !telegramMiniAppInitData.value) {
+function resolveMessengerMiniAppEndpoint(mode: 'session' | 'connect') {
+  if (messengerMiniAppChannel.value === 'MAX') {
+    return `/api/auth/max-mini-app/${mode}`;
+  }
+
+  return `/api/auth/telegram-mini-app/${mode}`;
+}
+
+function resolveMessengerMiniAppLabel() {
+  return messengerMiniAppChannelLabel.value || 'Mini App';
+}
+
+async function connectMessengerMiniApp() {
+  if (!isMessengerMiniApp.value || !messengerMiniAppInitData.value) {
     return;
   }
   if (telegramMiniAppMode.value === 'authenticated') {
@@ -192,19 +213,19 @@ async function connectTelegramMiniApp() {
   }
 
   try {
-    await $fetch('/api/auth/telegram-mini-app/connect', {
+    await $fetch(resolveMessengerMiniAppEndpoint('connect'), {
       method: 'POST',
       body: {
-        initData: telegramMiniAppInitData.value,
+        initData: messengerMiniAppInitData.value,
       },
     });
   } catch (error) {
-    console.error('telegram mini app connect failed', error);
+    console.error('messenger mini app connect failed', error);
   }
 }
 
-async function tryTelegramMiniAppLogin() {
-  if (!isTelegramMiniApp.value || !telegramMiniAppInitData.value) {
+async function tryMessengerMiniAppLogin() {
+  if (!isMessengerMiniApp.value || !messengerMiniAppInitData.value) {
     return;
   }
 
@@ -217,10 +238,11 @@ async function tryTelegramMiniAppLogin() {
       accessToken?: string;
       user?: { company?: { id: string } | null; companyId?: string | null };
       telegramUser?: { displayName?: string };
-    }>('/api/auth/telegram-mini-app/session', {
+      maxUser?: { displayName?: string };
+    }>(resolveMessengerMiniAppEndpoint('session'), {
       method: 'POST',
       body: {
-        initData: telegramMiniAppInitData.value,
+        initData: messengerMiniAppInitData.value,
       },
     });
 
@@ -232,9 +254,10 @@ async function tryTelegramMiniAppLogin() {
     }
 
     telegramMiniAppMode.value = 'needs_email';
-    feedback.value = payload.telegramUser?.displayName
-      ? `${payload.telegramUser.displayName}, введите рабочий e-mail. После входа мы привяжем этот Telegram к вашему кабинету.`
-      : 'Введите рабочий e-mail. После входа мы привяжем этот Telegram к вашему кабинету.';
+    const messengerUser = payload.maxUser ?? payload.telegramUser;
+    feedback.value = messengerUser?.displayName
+      ? `${messengerUser.displayName}, введите рабочий e-mail. После входа мы привяжем этот ${resolveMessengerMiniAppLabel()} к вашему кабинету.`
+      : `Введите рабочий e-mail. После входа мы привяжем этот ${resolveMessengerMiniAppLabel()} к вашему кабинету.`;
     feedbackTone.value = 'success';
   } catch (error) {
     telegramMiniAppMode.value = 'idle';
@@ -242,7 +265,7 @@ async function tryTelegramMiniAppLogin() {
       ? String(error.data.error || '')
       : error instanceof Error
         ? error.message
-        : 'Не получилось проверить Telegram Mini App.';
+        : `Не получилось проверить ${resolveMessengerMiniAppLabel()}.`;
     feedback.value = normalizeApolloErrorMessage(message);
     feedbackTone.value = 'error';
   }
@@ -319,7 +342,7 @@ onMounted(async () => {
     return;
   }
 
-  await tryTelegramMiniAppLogin();
+  await tryMessengerMiniAppLogin();
 });
 
 onBeforeUnmount(() => {
@@ -337,13 +360,17 @@ onBeforeUnmount(() => {
             v-if="telegramMiniAppMode === 'checking'"
             class="mt-2 text-sm text-base-content/70"
           >
-            Проверяем аккаунт Telegram…
+            {{ `Проверяем аккаунт ${resolveMessengerMiniAppLabel()}…` }}
           </p>
           <p
-            v-else-if="isTelegramMiniApp"
+            v-else-if="isMessengerMiniApp"
             class="mt-2 text-sm text-base-content/70"
           >
-            {{ telegramMiniAppDisplayName ? `Вы вошли из Telegram как ${telegramMiniAppDisplayName}.` : 'Вы открыли кабинет внутри Telegram.' }}
+            {{
+              messengerMiniAppDisplayName
+                ? `Вы вошли из ${resolveMessengerMiniAppLabel()} как ${messengerMiniAppDisplayName}.`
+                : `Вы открыли кабинет внутри ${resolveMessengerMiniAppLabel()}.`
+            }}
           </p>
         </div>
 
@@ -362,7 +389,7 @@ onBeforeUnmount(() => {
 
           <div class="grid gap-2 sm:grid-cols-2">
             <button
-              v-if="!isTelegramMiniApp"
+              v-if="messengerMiniAppChannel !== 'TELEGRAM'"
               class="btn btn-secondary"
               :class="{ 'btn-disabled pointer-events-none': !telegramBotUrl || !isEmailReady }"
               :disabled="pendingChannel === 'TELEGRAM' || !telegramBotUrl || !isEmailReady"
@@ -371,6 +398,7 @@ onBeforeUnmount(() => {
               {{ pendingChannel === 'TELEGRAM' ? 'Открываем Telegram…' : 'Войти через Telegram' }}
             </button>
             <button
+              v-if="messengerMiniAppChannel !== 'MAX'"
               class="btn btn-accent"
               :class="{ 'btn-disabled pointer-events-none': !maxBotUrl || !isEmailReady }"
               :disabled="pendingChannel === 'MAX' || !maxBotUrl || !isEmailReady"