fix(ui): Android Telegram nav — windowed mode, no close guard
CI / changes (pull_request) Successful in 2s
CI / unit (pull_request) Has been skipped
CI / integration (pull_request) Has been skipped
CI / ui (pull_request) Successful in 56s
CI / gate (pull_request) Successful in 0s
CI / deploy (pull_request) Successful in 1m18s
CI / changes (pull_request) Successful in 2s
CI / unit (pull_request) Has been skipped
CI / integration (pull_request) Has been skipped
CI / ui (pull_request) Successful in 56s
CI / gate (pull_request) Successful in 0s
CI / deploy (pull_request) Successful in 1m18s
Three Android Mini App issues, all in the Telegram chrome: - Entering a game showed no native back button, and the Android system swipe-back minimised the app instead of navigating. Root cause: immersive fullscreen (requestFullscreen). On Android, fullscreen replaces the native header — and its BackButton, which also captures the system back — with a bare close/menu pill, so back navigation has no control to land on. Request fullscreen on iOS only; Android stays windowed, keeping the native header + BackButton (and the system swipe-back that routes to it). iOS is unchanged. - Closing the game board always prompted "changes that you made may not be saved", even on a board just opened and untouched. The close-confirmation was armed unconditionally on game mount. Remove it entirely: move drafts auto-save (debounced during play + flushed on destroy), so nothing is lost on close. Drops the now-unused telegramClosingConfirmation + isMobilePlatform helpers and their SDK interface fields. Docs: UI_DESIGN.md.
This commit is contained in:
+7
-34
@@ -26,8 +26,6 @@ interface TelegramWebApp {
|
||||
setBackgroundColor?: (color: string) => void;
|
||||
setBottomBarColor?: (color: string) => void;
|
||||
disableVerticalSwipes?: () => void;
|
||||
enableClosingConfirmation?: () => void;
|
||||
disableClosingConfirmation?: () => void;
|
||||
HapticFeedback?: {
|
||||
impactOccurred?: (style: string) => void;
|
||||
notificationOccurred?: (type: string) => void;
|
||||
@@ -293,40 +291,15 @@ export function telegramHaptic(kind: Haptic): void {
|
||||
}
|
||||
|
||||
/**
|
||||
* isMobilePlatform reports whether the Mini App runs on a Telegram mobile client — iOS or
|
||||
* Android (the latter reported as 'android' by Telegram for Android and 'android_x' by
|
||||
* Telegram X). Desktop clients (tdesktop, macOS, web) report other values. Used to limit
|
||||
* mobile-only chrome such as the close guard and immersive fullscreen.
|
||||
*/
|
||||
function isMobilePlatform(): boolean {
|
||||
const p = webApp()?.platform;
|
||||
return p === 'ios' || p === 'android' || p === 'android_x';
|
||||
}
|
||||
|
||||
/**
|
||||
* telegramRequestFullscreen asks Telegram to open the Mini App in fullscreen (Bot API 8.0+),
|
||||
* but only on mobile clients — mirroring how Telegram's own Mini Apps go immersive on phones
|
||||
* while staying a standard window on desktop (where the bot's full-size setting already fills
|
||||
* the window). A no-op outside Telegram, on desktop, or on clients predating the method.
|
||||
* telegramRequestFullscreen asks Telegram to open the Mini App in immersive fullscreen (Bot API
|
||||
* 8.0+), but only on iOS. On Android, fullscreen replaces the native header — and its BackButton —
|
||||
* with a bare close/menu pill: the back control disappears and the Android system swipe-back falls
|
||||
* through to minimising the app instead of navigating, so the app stays windowed there to keep the
|
||||
* native header + BackButton (which also captures the system back). A no-op outside Telegram, on
|
||||
* Android, on desktop, or on clients predating the method.
|
||||
*/
|
||||
export function telegramRequestFullscreen(): void {
|
||||
if (isMobilePlatform()) webApp()?.requestFullscreen?.();
|
||||
}
|
||||
|
||||
/**
|
||||
* telegramClosingConfirmation toggles the confirmation Telegram shows when the user swipes
|
||||
* the Mini App closed — enabled during an active game so it is not lost by accident. The
|
||||
* guard is only armed on mobile clients: on desktop, closing a window is deliberate and
|
||||
* Telegram surfaces a "changes may not be saved" dialog that is just noise here (drafts
|
||||
* auto-save), so the confirmation is skipped there.
|
||||
*/
|
||||
export function telegramClosingConfirmation(on: boolean): void {
|
||||
const w = webApp();
|
||||
if (on) {
|
||||
if (isMobilePlatform()) w?.enableClosingConfirmation?.();
|
||||
} else {
|
||||
w?.disableClosingConfirmation?.();
|
||||
}
|
||||
if (webApp()?.platform === 'ios') webApp()?.requestFullscreen?.();
|
||||
}
|
||||
|
||||
let backHandler: (() => void) | null = null;
|
||||
|
||||
Reference in New Issue
Block a user