feat(telegram): Mini App embedding enhancements #136

Merged

developer merged 7 commits from feature/telegram-embedding into development 2026-06-24 11:41:15 +00:00

Conversation 1 Commits 7 Files Changed 12

+352 -31

developer commented 2026-06-24 07:21:18 +00:00

Owner

Copy Link

Copy Source

Audit of our Telegram Mini App integration against the current Mini Apps API, implementing the approved set of enhancements. One PR, landed step by step: each item is its own commit, reviewed live on iOS + Android on the test contour, then the next.

Steps:

• A. themeChanged — live light/dark theme re-apply (the SPA read the theme only once at launch, so a mid-session theme switch was missed until a relaunch)
• B. SafeAreaInset — full insets (bottom/left/right; only top was used)
• D. Native dialogs inside Telegram (showConfirm for destructive confirms + showPopup for the deep-link info modals)
• E. SettingsButton → our Settings screen (our own gear entry stays)
• F. CloudStorage — sync client prefs (theme/reduceMotion/boardLabels) across the user's devices
• G. is_bot — deny at validation (validator)

Out of scope: deeper CSS palette blending (keep our brand + the current 8 tokens), MainButton, and requestFullscreen / native BackButton / close-confirmation (deliberately unused).

Audit of our Telegram Mini App integration against the current Mini Apps API, implementing the approved set of enhancements. One PR, landed step by step: each item is its own commit, reviewed live on iOS + Android on the test contour, then the next. Steps: - [x] A. themeChanged — live light/dark theme re-apply (the SPA read the theme only once at launch, so a mid-session theme switch was missed until a relaunch) - [ ] B. SafeAreaInset — full insets (bottom/left/right; only top was used) - [ ] D. Native dialogs inside Telegram (showConfirm for destructive confirms + showPopup for the deep-link info modals) - [ ] E. SettingsButton → our Settings screen (our own gear entry stays) - [ ] F. CloudStorage — sync client prefs (theme/reduceMotion/boardLabels) across the user's devices - [ ] G. is_bot — deny at validation (validator) Out of scope: deeper CSS palette blending (keep our brand + the current 8 tokens), MainButton, and requestFullscreen / native BackButton / close-confirmation (deliberately unused).

developer added 1 commit 2026-06-24 07:21:18 +00:00

feat(telegram): re-apply theme live on themeChanged ... 0fb6004a8b

The Mini App read Telegram's themeParams/colorScheme only once at launch, so
switching Telegram's light/dark theme (or its auto day/night) while the app was
open left the SPA on stale colours until a relaunch.

Subscribe to the themeChanged WebApp event and re-apply the theme live. Extract
the launch-time token + colour-scheme + chrome application into syncTelegramTheme
(reading live themeParams when no launch snapshot is passed) and call it from both
applyTelegramChrome (launch) and the new event handler. Add a telegramThemeParams
live getter (+ unit test). Drop the stale 'immersive fullscreen' note from
applyTelegramChrome — the app deliberately does not request fullscreen.

developer added 1 commit 2026-06-24 08:24:58 +00:00

feat(telegram): clear bottom and side safe-area insets ... b84bd1297e

Only the device safe-area TOP inset was mirrored, so on phones with a home
indicator the rack / bottom bar sat under it, and in landscape the notch
clipped the screen edges.

Mirror the full device safe-area inset (bottom / left / right) into new
--tg-safe-bottom / --tg-safe-left / --tg-safe-right CSS vars (0 outside
Telegram) and pad the shared Screen wrapper by them, so every screen clears the
home indicator and the landscape notch; the top inset stays owned by the header.
Replace telegramSafeAreaTop with telegramSafeAreaInset (the full inset object),
with a unit test.

developer added 1 commit 2026-06-24 08:41:28 +00:00

fix(telegram): paint the home-indicator strip with the bottom bar's colour ... d0f60ee41d

The safe-area bottom inset was reserved on the Screen wrapper, so the strip
that holds space for the home indicator showed the content background and read
as detached from the coloured bottom bar / header above it.

Move the bottom inset onto the bottom bar: the Screen .tabbar wrapper now paints
--bg-elev and pads itself by --tg-safe-bottom, so the strip continues the
TabBar's chrome; a screen with no tab bar pads its bottom-most content
(.content:last-child) instead, so the strip takes that content's own colour.

developer added 1 commit 2026-06-24 08:47:07 +00:00

feat(telegram): native SettingsButton opens our Settings screen ... ea931c6680

Inside the Mini App, reveal Telegram's native Settings button (Bot API 7.0)
and route its taps to the Settings screen — the standard Mini App affordance.
The in-app gear entry stays the primary path (two entry points by design).
No-op outside Telegram or on a client predating the button.

developer added 1 commit 2026-06-24 09:39:31 +00:00

feat(telegram): sync client display prefs via CloudStorage ... 8a5a5d6c4d

Theme, reduce-motion and board labels lived only in local IndexedDB/localStorage,
so they did not follow the user across devices and could be lost when the Telegram
WebView cleared storage.

Mirror these three device-independent prefs to Telegram CloudStorage (Bot API 6.9)
from the single local-persist point (persistPrefs), and reconcile them from
CloudStorage in the background on launch (reconcileCloudPrefs) so a change made on
another device follows the user here. The local store stays the instant-render
cache; the interface language is intentionally excluded (it syncs via the durable
account). Pure encode/decode extracted to cloudprefs.ts with unit tests; the
CloudStorage transport wrappers are added to telegram.ts. No-op outside Telegram or
on a client predating CloudStorage.

developer added 1 commit 2026-06-24 09:55:33 +00:00

feat(telegram): deny bot users at initData validation ... 8de9fb1ecd

The validator parsed only id/username/first_name/language_code from the signed
Telegram user, so a WebAppUser flagged is_bot would have been provisioned a normal
account. The HMAC already proves Telegram signed the payload, so is_bot==true is
Telegram itself attesting the launching principal is a bot.

Parse is_bot and reject it (ErrInvalidInitData -> gateway 4xx -> launch error). A
real user opening the Mini App never carries it, so this is a defensive deny. Tests
cover both the denied (is_bot true) and allowed (is_bot false) paths.

developer added 1 commit 2026-06-24 10:19:52 +00:00

docs(telegram): document the Mini App embedding enhancements ... 29b6c7e4d8

Record the current state in ARCHITECTURE and FUNCTIONAL (+ _ru mirror): inside the
Mini App the client tracks Telegram's live theme switch, fits the full device
safe-area, exposes a native Settings button into the in-app settings, and syncs the
device-independent display prefs (theme, reduce-motion, board labels — not the
interface language) across the user's Telegram devices via CloudStorage; the
validator denies a bot user (is_bot) before provisioning an account.

developer referenced this pull request 2026-06-24 10:37:12 +00:00

feat(telegram): native dialogs (experimental, stacked on #136) #137

owner approved these changes 2026-06-24 11:40:22 +00:00

developer merged commit 2495446a47 into development 2026-06-24 11:41:15 +00:00

developer deleted branch feature/telegram-embedding 2026-06-24 11:41:15 +00:00

developer referenced this issue from a commit 2026-06-24 11:41:30 +00:00

Merge pull request 'feat(telegram): native dialogs (experimental, stacked on #136)' (#137) from feature/telegram-native-dialogs into development

developer referenced this pull request 2026-06-24 11:47:46 +00:00

release: v1.7.0 — Telegram Mini App embedding enhancements #138

Sign in to join this conversation.

Reviewers

No Reviewers

owner

Labels

No items

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

owner (Ilia) developer

No Assignees

2 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: developer/scrabble-game#136