stream_chess.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
import 'package:stream_chat_localizations/stream_chat_localizations.dart';
import 'package:flutter_chess_board/flutter_chess_board.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  /// Create a new instance of [StreamChatClient] passing the apikey obtained
  /// from your project dashboard.
  final client = StreamChatClient(
    's2dxdhpxd94g',
    logLevel: Level.INFO,
  );

  /// Set the current user and connect the websocket. In a production
  /// scenario, this should be done using a backend to generate a user token
  /// using our server SDK.
  ///
  /// Please see the following for more information:
  /// https://getstream.io/chat/docs/ios_user_setup_and_tokens/
  await client.connectUser(
    User(id: 'super-band-9'),
    '''eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoic3VwZXItYmFuZC05In0.0L6lGoeLwkz0aZRUcpZKsvaXtNEDHBcezVTZ0oPq40A''',
  );

  final channel = client.channel('messaging', id: 'godevs');

  await channel.watch();

  runApp(
    MyApp(
      client: client,
      channel: channel,
    ),
  );
}

/// Example application using Stream Chat Flutter widgets.
///
/// Stream Chat Flutter is a set of Flutter widgets which provide full chat
/// functionalities for building Flutter applications using Stream. If you'd
/// prefer using minimal wrapper widgets for your app, please see our other
/// package, `stream_chat_flutter_core`.
class MyApp extends StatelessWidget {
  /// Example using Stream's Flutter package.
  ///
  /// If you'd prefer using minimal wrapper widgets for your app, please see
  /// our other package, `stream_chat_flutter_core`.
  const MyApp({
    Key? key,
    required this.client,
    required this.channel,
  }) : super(key: key);

  /// Instance of Stream Client.
  ///
  /// Stream's [StreamChatClient] can be used to connect to our servers and
  /// set the default user for the application. Performing these actions
  /// trigger a websocket connection allowing for real-time updates.
  final StreamChatClient client;

  /// Instance of the Channel
  final Channel channel;

  @override
  Widget build(BuildContext context) => MaterialApp(
        theme: ThemeData.light(),
        darkTheme: ThemeData.dark(),
        supportedLocales: const [
          Locale('en'),
          Locale('hi'),
          Locale('fr'),
          Locale('it'),
          Locale('es'),
        ],
        localizationsDelegates: GlobalStreamChatLocalizations.delegates,
        builder: (context, widget) => StreamChat(
          client: client,
          child: widget,
        ),
        home: StreamChannel(
          channel: channel,
          child: const ChannelPage(),
        ),
      );
}

/// A list of messages sent in the current channel.
///
/// This is implemented using [MessageListView], a widget that provides query
/// functionalities fetching the messages from the api and showing them in a
/// listView.
class ChannelPage extends StatefulWidget {
  /// Creates the page that shows the list of messages
  const ChannelPage({
    Key? key,
  }) : super(key: key);

  @override
  State<ChannelPage> createState() => _ChannelPageState();
}

class _ChannelPageState extends State<ChannelPage> {
  GlobalKey<MessageInputState> _messageInputKey = GlobalKey();

  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: const ChannelHeader(),
        body: Column(
          children: <Widget>[
            Expanded(
              child: MessageListView(
                messageBuilder: (context, details, list, def) {
                  return def.copyWith(
                    customAttachmentBuilders: {
                      'chess': (ctx2, message, list) {
                        var chessBoardController = ChessBoardController.fromFEN(
                            (message.attachments[0].extraData['game']
                                as String));
                        chessBoardController
                          ..addListener(() {
                            StreamChannel.of(context)
                                .channel
                                .updateMessage(message.copyWith(
                                  attachments: [
                                    message.attachments[0].copyWith(
                                        uploadState: UploadState.success())
                                      ..extraData['game'] =
                                          chessBoardController.getFen()
                                  ],
                                ));
                          });
                        return ChessBoard(
                          controller: chessBoardController,
                          boardOrientation:
                              StreamChat.of(context).currentUser!.id ==
                                      (message.attachments[0]
                                          .extraData['whitePlayer'] as String)
                                  ? PlayerColor.white
                                  : PlayerColor.black,
                        );
                      },
                    },
                  );
                },
              ),
            ),
            MessageInput(
              key: _messageInputKey,
              attachmentLimit: 3,
              actions: [
                IconButton(
                  onPressed: () {
                    _messageInputKey.currentState?.addAttachment(
                      Attachment(
                        type: 'chess',
                        uploadState: UploadState.success(),
                        extraData: {
                          'game':
                              'rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1',
                          'whitePlayer': StreamChat.of(context).currentUser!.id,
                        },
                      ),
                    );
                  },
                  icon: Icon(Icons.add),
                ),
              ],
              attachmentThumbnailBuilders: {
                'chess': (context, attachment) {
                  return ChessBoard(
                    controller: ChessBoardController.fromFEN(
                        attachment.extraData['game'] as String),
                    boardOrientation: StreamChat.of(context).currentUser!.id ==
                            (attachment.extraData['whitePlayer'] as String)
                        ? PlayerColor.white
                        : PlayerColor.black,
                  );
                },
              },
            ),
          ],
        ),
      );
}