mapflow/flutter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace Telegram widget with bot login
All checks were successful
Build and deploy Flutter Web / build (push) Successful in 2m22s
Details

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-05-08 19:32:01 +07:00
parent cd62a0a428
commit 5f33a5e880
9 changed files with 276 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
lib/auth/telegram_login_button.dart
View File

@@ -1,2 +1,26 @@
export 'telegram_login_button_stub.dart'
if (dart.library.html) 'telegram_login_button_web.dart';
import 'package:flutter/material.dart';
class TelegramLoginButton extends StatelessWidget {
const TelegramLoginButton({
required this.onPressed,
required this.loading,
super.key,
});
final VoidCallback? onPressed;
final bool loading;
@override
Widget build(BuildContext context) {
return FilledButton.icon(
onPressed: loading ? null : onPressed,
icon: loading
? const SizedBox.square(
dimension: 18,
child: CircularProgressIndicator(strokeWidth: 2),
)
: const Icon(Icons.telegram),
label: const Text('Войти через Telegram'),
);
}
}

12
lib/auth/telegram_login_button_stub.dart
View File

@@ -1,12 +0,0 @@
import 'package:flutter/material.dart';
class TelegramLoginButton extends StatelessWidget {
const TelegramLoginButton({required this.onAuthenticated, super.key});
final VoidCallback onAuthenticated;
@override
Widget build(BuildContext context) {
return const FilledButton(onPressed: null, child: Text('Telegram'));
}
}

77
lib/auth/telegram_login_button_web.dart
View File

@@ -1,77 +0,0 @@
import 'dart:js_interop';
import 'dart:js_interop_unsafe';
import 'dart:ui_web' as ui_web;
import 'package:flutter/widgets.dart';
import 'package:web/web.dart' as web;
import 'telegram_session_web.dart';
const _telegramBotUsername = String.fromEnvironment(
'TELEGRAM_BOT_USERNAME',
defaultValue: 'carfteebot',
);
@JS('window')
external JSObject get _window;
class TelegramLoginButton extends StatefulWidget {
const TelegramLoginButton({required this.onAuthenticated, super.key});
final VoidCallback onAuthenticated;
@override
State<TelegramLoginButton> createState() => _TelegramLoginButtonState();
}
class _TelegramLoginButtonState extends State<TelegramLoginButton> {
late final String _callbackName =
'mapflowTelegramAuth${DateTime.now().microsecondsSinceEpoch}';
late final String _viewType = 'mapflow-telegram-login-$_callbackName';
@override
void initState() {
super.initState();
final callback = ((JSAny? user) {
saveTelegramLoginData(user);
if (mounted) {
widget.onAuthenticated();
}
web.window.location.reload();
}).toJS;
_window.setProperty(_callbackName.toJS, callback);
ui_web.platformViewRegistry.registerViewFactory(_viewType, _buildElement);
}
web.HTMLElement _buildElement(int viewId) {
final container = web.HTMLDivElement()
..style.width = '100%'
..style.height = '48px'
..style.display = 'flex'
..style.justifyContent = 'center'
..style.alignItems = 'center';
final script = web.HTMLScriptElement()
..src = 'https://telegram.org/js/telegram-widget.js?22'
..async = true;
script
..setAttribute('data-telegram-login', _telegramBotUsername)
..setAttribute('data-size', 'large')
..setAttribute('data-radius', '8')
..setAttribute('data-userpic', 'false')
..setAttribute('data-onauth', '$_callbackName(user)');
container.append(script);
return container;
}
@override
Widget build(BuildContext context) {
return SizedBox(
height: 48,
width: 240,
child: HtmlElementView(viewType: _viewType),
);
}
}

16
lib/auth/telegram_session_stub.dart
View File

@@ -1,3 +1,19 @@
String telegramInitData() => '';
String telegramLoginData() => '';
String mapflowSessionToken() => '';
String pendingTelegramLoginToken() => '';
String telegramLoginTokenFromUrl() => '';
void saveMapflowSessionToken(String token) {}
void savePendingTelegramLoginToken(String token) {}
void clearPendingTelegramLoginToken() {}
void openExternalUrl(String url) {}
void reloadApp() {}

33
lib/auth/telegram_session_web.dart
View File

@@ -3,6 +3,8 @@ import 'dart:js_interop';
import 'package:web/web.dart' as web;
const telegramLoginStorageKey = 'mapflow.telegramLoginData';
const mapflowSessionStorageKey = 'mapflow.sessionToken';
const pendingTelegramLoginStorageKey = 'mapflow.pendingTelegramLoginToken';
@JS('window.Telegram.WebApp.initData')
external JSString? get _telegramInitData;
@@ -15,7 +17,38 @@ String telegramInitData() => _telegramInitData?.toDart ?? '';
String telegramLoginData() =>
web.window.localStorage.getItem(telegramLoginStorageKey) ?? '';
String mapflowSessionToken() =>
web.window.localStorage.getItem(mapflowSessionStorageKey) ?? '';
String pendingTelegramLoginToken() =>
web.window.localStorage.getItem(pendingTelegramLoginStorageKey) ?? '';
String telegramLoginTokenFromUrl() {
final uri = Uri.parse(web.window.location.href);
return uri.queryParameters['telegram_login'] ?? '';
}
void saveTelegramLoginData(JSAny? user) {
final encoded = _jsonStringify(user).toDart;
web.window.localStorage.setItem(telegramLoginStorageKey, encoded);
}
void saveMapflowSessionToken(String token) {
web.window.localStorage.setItem(mapflowSessionStorageKey, token);
}
void savePendingTelegramLoginToken(String token) {
web.window.localStorage.setItem(pendingTelegramLoginStorageKey, token);
}
void clearPendingTelegramLoginToken() {
web.window.localStorage.removeItem(pendingTelegramLoginStorageKey);
}
void openExternalUrl(String url) {
web.window.open(url, '_blank', 'noopener,noreferrer');
}
void reloadApp() {
web.window.location.assign(web.window.location.origin);
}