call_invitation.dart

      uiConfig: ZegoCallInvitationUIConfig(
        inviter: ZegoCallInvitationInviterUIConfig(
          pageBuilder: (context, data) {
            final inviteeId = data.invitees.first.id.split('_').last;
            return CallingScreen(
              type: data.callType == ZegoCallInvitationType.videoCall
                  ? CallInvitationType.video
                  : CallInvitationType.audio,
              userRole: CallInvitationUser.inviter,
              userId: inviteeId,
              fallbackName: data.invitees.first.name,
              onCallCancel: () {
                ZegoUIKitPrebuiltCallInvitationService().cancel(
                  callees: data.invitees
                      .map((e) => ZegoCallUser.fromUIKit(e))
                      .toList(),
                );
              },
            );
          },
        ),
        invitee: ZegoCallInvitationInviteeUIConfig(
          pageBuilder: (context, data) {
            final inviterId = data.inviter.id.split('_').last;
            return CallingScreen(
              type: data.callType == ZegoCallInvitationType.videoCall
                  ? CallInvitationType.video
                  : CallInvitationType.audio,
              userRole: CallInvitationUser.invitee,
              userId: inviterId,
              fallbackName: data.inviter.name,
              onCallAccept: () {
                ZegoUIKitPrebuiltCallInvitationService().accept();
              },
              onCallReject: () {
                ZegoUIKitPrebuiltCallInvitationService().reject();
              },
            );
          },
        ),
      ),

call_screen.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:unikon/features/profile/presentation/screens/other_user_profile_v2/widgets/widget.dart';
import 'package:unikon/features/profile/presentation/state/bloc/profile_bloc.dart';
import 'package:unikon/features/profile/presentation/state/events_and_states.dart';
import 'package:unikon/utils/dependency/dependency_injection.dart';
import 'package:unikon/utils/dimensions/gaps.dart';
import 'package:unikon/utils/images/constants.dart';
import 'package:unikon/utils/user/user_details.dart';
import 'package:unikon/widget_library/avatars/profile_avatar.dart';
import 'package:unikon/widget_library/images/base_image.dart';

enum CallInvitationType {
  audio,
  video,
}

enum CallInvitationUser {
  inviter,
  invitee,
}

class CallingScreen extends StatelessWidget {
  const CallingScreen({
    super.key,
    required this.type,
    required this.userRole,
    required this.userId,
    required this.fallbackName,
    this.onCallReject,
    this.onCallAccept,
    this.onCallCancel,
  }) : assert(userRole == CallInvitationUser.inviter
            ? onCallCancel != null
            : (onCallAccept != null && onCallReject != null));

  final CallInvitationType type;
  final CallInvitationUser userRole;
  final String userId;
  final String fallbackName;
  final VoidCallback? onCallReject;
  final VoidCallback? onCallAccept;
  final VoidCallback? onCallCancel;

  @override
  Widget build(BuildContext context) {
    return BlocProvider<ProfileBloc>(
      create: (context) =>
          getIt.get<ProfileBloc>()..add(GetOtherUserProfileEvent(userId)),
      child: BlocBuilder<ProfileBloc, ProfileState>(
        builder: (context, state) {
          final user =
              state is OtherUserProfileLoadedState ? state.response.data : null;
          return TranslucentScaffold(
            body: Padding(
              padding: g16HPadding,
              child: Center(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    g40Box,
                    SizedBox(
                      height: 24.sp,
                      width: 124.sp,
                      child: const BaseImageWidget(
                        imageUri: ImageConstants.unikonCallLogo,
                      ),
                    ),
                    g12Box,
                    Text(
                      callingText,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 14.sp,
                        fontFamily: 'Poppins',
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                    g50Box,
                    ProfileAvatarWidget(
                      radius: 80.sp,
                      firstName: user?.firstName ?? fallbackName,
                      lastName: user?.lastName ?? '',
                      url: user?.profilePicture,
                      introVideo: user?.introVideo,
                      showInitialsIfEmpty: true,
                    ),
                    g50Box,
                    Text(
                      user != null
                          ? '${user.firstName} ${user.lastName}'
                          : fallbackName,
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 28.sp,
                        fontFamily: 'Poppins',
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                    if (user?.currentDesignation != null) ...[
                      g4Box,
                      Text(
                        user?.currentDesignation ?? '',
                        style: TextStyle(
                          color: const Color(0xFFCCCCCC),
                          fontSize: 16.sp,
                          fontFamily: 'Poppins',
                          fontWeight: FontWeight.w400,
                        ),
                        textAlign: TextAlign.center,
                      ),
                    ],
                    if (UserDetails.buildUserLocation(
                            user?.city?.name, user?.country?.name) !=
                        null) ...[
                      g12Box,
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          SizedBox(
                            height: 12.sp,
                            width: 12.sp,
                            child: const BaseImageWidget(
                              imageUri: ImageConstants.callLocationIcon,
                            ),
                          ),
                          g4Box,
                          Text(
                            UserDetails.buildUserLocation(
                                user?.city?.name, user?.country?.name)!,
                            style: TextStyle(
                              color: const Color(0xFFCCCCCC),
                              fontSize: 12.sp,
                              fontFamily: 'Poppins',
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                        ],
                      ),
                    ],
                    const Spacer(),
                    buildCallFunctions(),
                    g80Box,
                  ],
                ),
              ),
            ),
          );
        },
      ),
    );
  }

  Widget buildCallFunctions() {
    if (userRole == CallInvitationUser.invitee) {
      return Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          const Spacer(),
          GestureDetector(
            onTap: () {
              onCallReject?.call();
            },
            child: SizedBox(
              width: 60.sp,
              height: 60.sp,
              child: const CircleAvatar(
                backgroundColor: Color(0xffFC015B),
                child: BaseImageWidget(
                  imageUri: ImageConstants.hangupCallIcon,
                  size: Size.square(40),
                ),
              ),
            ),
          ),
          g100Box,
          GestureDetector(
            onTap: onCallAccept,
            child: SizedBox(
              width: 60.sp,
              height: 60.sp,
              child: CircleAvatar(
                backgroundColor: const Color(0xff19AB65),
                child: BaseImageWidget(
                  imageUri: type == CallInvitationType.video
                      ? ImageConstants.acceptVideoCallIcon
                      : ImageConstants.acceptAudioCallIcon,
                  size: const Size.square(24),
                ),
              ),
            ),
          ),
          const Spacer(),
        ],
      );
    } else {
      return GestureDetector(
        onTap: onCallCancel,
        child: SizedBox(
          width: 60.sp,
          height: 60.sp,
          child: const CircleAvatar(
            backgroundColor: Color(0xffFC015B),
            child: BaseImageWidget(
              imageUri: ImageConstants.hangupCallIcon,
              size: Size.square(40),
            ),
          ),
        ),
      );
    }
  }

  String get callingText {
    String text = '';
    if (userRole == CallInvitationUser.invitee) {
      text += 'Incoming ';
    } else {
      return 'Calling...';
    }
    if (type == CallInvitationType.video) {
      text += 'Video Call';
    } else {
      text += 'Audio Call';
    }
    return text;
  }
}