feat: update socket and bloc

lib/features/app/bloc/bloc.dart

@@ -4,6 +4,7 @@ import 'package:waterbus/core/injection/injection_container.dart';
 import 'package:waterbus/features/auth/presentation/bloc/auth_bloc.dart';
 import 'package:waterbus/features/home/bloc/home/home_bloc.dart';
 import 'package:waterbus/features/meeting/presentation/bloc/beauty_filters/beauty_filters_bloc.dart';
+import 'package:waterbus/features/meeting/presentation/bloc/drawing/drawing_bloc.dart';
 import 'package:waterbus/features/meeting/presentation/bloc/meeting/meeting_bloc.dart';
 import 'package:waterbus/features/meeting/presentation/bloc/recent_joined/recent_joined_bloc.dart';
 import 'package:waterbus/features/profile/presentation/bloc/user_bloc.dart';
@@ -17,6 +18,7 @@ class AppBloc {
   static final RecentJoinedBloc recentJoinedBloc = getIt<RecentJoinedBloc>();
   static final BeautyFiltersBloc beautyFiltersBloc = getIt<BeautyFiltersBloc>();
   static final ThemesBloc themesBloc = getIt<ThemesBloc>();
+  static final DrawingBloc drawingBloc = getIt<DrawingBloc>();
 
   static final List<BlocProvider> providers = [
     BlocProvider<AuthBloc>(
@@ -40,6 +42,9 @@ class AppBloc {
     BlocProvider<ThemesBloc>(
       create: (context) => themesBloc,
     ),
+    BlocProvider<DrawingBloc>(
+      create: (context) => drawingBloc,
+    ),
   ];
 
   Future<void> bootstrap() async {

lib/features/meeting/presentation/bloc/drawing/drawing_bloc.dart

@@ -0,0 +1,31 @@
+import 'dart:ui';
+
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:injectable/injectable.dart';
+import 'package:waterbus/features/meeting/presentation/socket/drawing/socket_draw_event.dart';
+import 'package:waterbus/features/meeting/presentation/socket/drawing/socket_draw_handle.dart';
+
+part 'drawing_event.dart';
+part 'drawing_state.dart';
+
+@injectable
+class DrawingBloc extends Bloc<DrawingEvent, DrawingState> {
+  final SocketDrawHandle _socketDrawHandle;
+
+  DrawingBloc(this._socketDrawHandle) : super(DrawingInitialState()) {
+    on<DrawingEvent>((event, emit) {
+      if (event is OnDrawingChangedEvent) {
+        _hanldeChangeDraw();
+
+        emit(DrawingChangedState(points: event.points));
+      }
+
+      if (event is OnDrawingDeletedEvent) {
+        emit(DrawingChangedState(points: []));
+      }
+    });
+  }
+  void _hanldeChangeDraw() {
+    _socketDrawHandle.onSendSocket(SocketDrawEvent.updateBoard);
+  }
+}

lib/features/meeting/presentation/bloc/drawing/drawing_event.dart

@@ -0,0 +1,10 @@
+part of 'drawing_bloc.dart';
+
+class DrawingEvent {}
+
+class OnDrawingChangedEvent extends DrawingEvent {
+  final List<Offset?> points;
+  OnDrawingChangedEvent({required this.points});
+}
+
+class OnDrawingDeletedEvent extends DrawingEvent {}

lib/features/meeting/presentation/bloc/drawing/drawing_state.dart

@@ -0,0 +1,16 @@
+part of 'drawing_bloc.dart';
+
+abstract class DrawingState {
+  List get props => [];
+}
+
+final class DrawingInitialState extends DrawingState {}
+
+final class DrawingChangedState extends DrawingState {
+  final List<Offset?> points;
+
+  DrawingChangedState({required this.points});
+
+  @override
+  List get props => [points];
+}

lib/features/meeting/socket/socket_draw_event.dart → lib/features/meeting/presentation/socket/drawing/socket_draw_event.dart

@@ -1,4 +1,4 @@
 class SocketDrawEvent {
-  static String drawingBoard = 'DRAWING_BOARD';
+  static String updateBoard = 'DRAWING_BOARD';
   static String deleteBoard = 'DELETE_BOARD';
 }

lib/features/meeting/presentation/socket/drawing/socket_draw_handle.dart

@@ -0,0 +1,34 @@
+import 'package:injectable/injectable.dart';
+import 'package:socket_io_client/socket_io_client.dart';
+import 'package:waterbus/features/app/bloc/bloc.dart';
+import 'package:waterbus/features/meeting/presentation/bloc/drawing/drawing_bloc.dart';
+import 'package:waterbus/features/meeting/presentation/socket/drawing/socket_draw_event.dart';
+import 'package:waterbus_sdk/core/websocket/interfaces/socket_handler_interface.dart';
+
+@injectable
+class SocketDrawHandle {
+  final SocketHandler _webSocket;
+  SocketDrawHandle(this._webSocket);
+  void onListenSocket() {
+    final Socket? socket = _webSocket.socket;
+
+    if (socket == null || !socket.active) return;
+
+    socket.onConnect((_) async {
+      socket.on(SocketDrawEvent.updateBoard, (data) {
+        if (data == null) return;
+
+        AppBloc.drawingBloc.add(OnDrawingChangedEvent(points: []));
+        print(data);
+      });
+    });
+  }
+
+  void onSendSocket(String event) {
+    final Socket? socket = _webSocket.socket;
+    if (socket == null || !socket.active) return;
+    socket.onConnect((_) async {
+      socket.emit(event);
+    });
+  }
+}

lib/features/meeting/presentation/widgets/custom_paint.dart

@@ -1,6 +1,11 @@
 import 'dart:ui';
 
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:waterbus/features/app/bloc/bloc.dart';
+import 'package:waterbus/features/meeting/presentation/bloc/drawing/drawing_bloc.dart';
+import 'package:waterbus/features/meeting/presentation/socket/drawing/socket_draw_event.dart';
+import 'package:waterbus/features/meeting/presentation/socket/drawing/socket_draw_handle.dart';
 
 class DrawingScreen extends StatefulWidget {
   const DrawingScreen({super.key});
@@ -13,31 +18,40 @@ class DrawingScreenState extends State<DrawingScreen> {
   List<Offset?> points = [];
   bool drawingBlocked = false;
 
+  void onHanldeCancelDraw() {
+    AppBloc.drawingBloc.add(OnDrawingChangedEvent(points: points));
+  }
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      body: SafeArea(
-        child: InteractiveViewer(
-          child: AbsorbPointer(
-            absorbing: drawingBlocked,
-            child: Listener(
-              onPointerMove: (details) {
-                setState(() {
-                  points = List.of(points)..add(details.localPosition);
-                });
-              },
-              onPointerDown: (details) {
-                setState(() {
-                  points.add(null);
-                });
-              },
-              child: CustomPaint(
-                painter: DrawingPainter(points),
-                size: Size.infinite,
+      body: BlocBuilder<DrawingBloc, DrawingState>(
+        builder: (context, drawing) {
+          final otherPainters = drawing.props as List<Offset?>;
+          points.addAll(otherPainters);
+          return InteractiveViewer(
+            child: AbsorbPointer(
+              absorbing: drawingBlocked,
+              child: Listener(
+                onPointerMove: (details) {
+                  setState(() {
+                    points = List.of(points)..add(details.localPosition);
+                  });
+                },
+                onPointerCancel: (event) => onHanldeCancelDraw,
+                onPointerDown: (details) {
+                  setState(() {
+                    points.add(null);
+                  });
+                },
+                child: CustomPaint(
+                  painter: DrawingPainter(points),
+                  size: Size.infinite,
+                ),
               ),
             ),
-          ),
-        ),
+          );
+        },
       ),
       floatingActionButton: FloatingActionButton(
         onPressed: () {