dialogs_chatbot_flutter 1.0.0 copy "dialogs_chatbot_flutter: ^1.0.0" to clipboard
dialogs_chatbot_flutter: ^1.0.0 copied to clipboard

EnX Chatbot Flutter Plugin — A complete, drop-in chat UI plugin for the EnableX Dialogs platform. Supports iOS and Android only.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:dialogs_chatbot_flutter/dialogs_chatbot_flutter.dart';

// ---------------------------------------------------------------------------
// Entry point
// ---------------------------------------------------------------------------

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(const EnxChatExampleApp());
}

// ---------------------------------------------------------------------------
// Root application
// ---------------------------------------------------------------------------

class EnxChatExampleApp extends StatelessWidget {
  const EnxChatExampleApp({super.key});

  static const String _botId = 'Bot-id';
  static const String _host = 'host-url';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'EnX Chat Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        useMaterial3: true,
        colorSchemeSeed: const Color(0xFF075E54),
      ),
      home: const HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String? _lastConnectedBot;

  void _openClassicChat(BuildContext context) {
    Navigator.of(context).push(
      PageRouteBuilder(
        transitionDuration: Duration.zero,
        reverseTransitionDuration: Duration.zero,
        pageBuilder: (_, __, ___) => ClassicChatPage(
          onBotInfo: (info) {
            final botName = info['name'] as String?;
            if (botName != null && botName.trim().isNotEmpty && mounted) {
              setState(() => _lastConnectedBot = botName.trim());
            }
          },
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('EnX Chat Flutter Demo'),
        backgroundColor: const Color(0xFF075E54),
        foregroundColor: Colors.white,
      ),
      body: Padding(
        padding: const EdgeInsets.all(20),
        child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              SizedBox(
                width: 260,
                child: FilledButton.icon(
                  onPressed: () => _openClassicChat(context),
                  icon: const Icon(Icons.chat_bubble_outline),
                  label: const Text('Open Mobile Classic UI'),
                  style: FilledButton.styleFrom(
                    backgroundColor: const Color(0xFF22C55E),
                    foregroundColor: Colors.white,
                    minimumSize: const Size.fromHeight(52),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(12),
                    ),
                  ),
                ),
              ),
              if (_lastConnectedBot != null) ...[
                const SizedBox(height: 10),
                Text(
                  'Last bot: $_lastConnectedBot',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    fontSize: 12,
                    color: Colors.grey.shade700,
                  ),
                ),
              ],
            ],
          ),
        ),
      ),
    );
  }
}

class ClassicChatPage extends StatefulWidget {
  const ClassicChatPage({super.key, this.onBotInfo});

  final void Function(Map<String, dynamic>)? onBotInfo;

  @override
  State<ClassicChatPage> createState() => _ClassicChatPageState();
}

class _ClassicChatPageState extends State<ClassicChatPage> {
  String _title = 'EnX Support';
  late final EnxChatController _controller;

  @override
  void initState() {
    super.initState();
    _controller = EnxChatController(
      config: EnxBotConfig(
        botId: EnxChatExampleApp._botId,
        host: EnxChatExampleApp._host,
      ),
    );
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _handleBotInfo(Map<String, dynamic> info) {
    final botName = info['name'] as String?;
    if (botName != null && botName.trim().isNotEmpty && mounted) {
      setState(() => _title = botName.trim());
      // ScaffoldMessenger.of(context).showSnackBar(
      //   SnackBar(content: Text('Connected to $botName')),
      // );
    }
    widget.onBotInfo?.call(info);
  }

  Future<void> _resetChat() async {
    final shouldReset = await showDialog<bool>(
      context: context,
      builder: (context) => AlertDialog(
        title: const Text('Reset chat?'),
        content: const Text('This will clear current conversation and start new.'),
        actions: [
          TextButton(
            onPressed: () => Navigator.of(context).pop(false),
            child: const Text('Cancel'),
          ),
          FilledButton(
            onPressed: () => Navigator.of(context).pop(true),
            child: const Text('Reset'),
          ),
        ],
      ),
    );

    if (shouldReset != true) return;

    try {
      await _controller.resetConversation();
      if (!mounted) return;
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('Chat reset successful')),
      );
    } catch (_) {
      if (!mounted) return;
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('Unable to reset chat')),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(_title),
        backgroundColor: Colors.white,
        foregroundColor: Colors.black87,
        elevation: 0.5,
        actions: [
          IconButton(
            tooltip: 'Reset chat',
            onPressed: _resetChat,
            icon: const Icon(Icons.refresh),
          ),
        ],
      ),
      body: EnxChatWidget.withController(
        controller: _controller,
        theme: EnxChatTheme.mobileClassic,
        showCallingOptions: false,
        onBotInfo: _handleBotInfo,
      ),
    );
  }
}