syncrow-web/lib/pages/access_management/booking_system/view/booking_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:intl/intl.dart';
import 'package:calendar_view/calendar_view.dart';
import 'package:syncrow_web/pages/access_management/booking_system/bloc/date_selection/date_selection_bloc.dart';
import 'package:syncrow_web/pages/access_management/booking_system/bloc/date_selection/date_selection_event.dart';
import 'package:syncrow_web/pages/access_management/booking_system/bloc/date_selection/date_selection_state.dart';
import 'package:syncrow_web/pages/access_management/booking_system/bloc/selected_bookable_space_bloc/selected_bookable_space_bloc.dart';
import 'package:syncrow_web/pages/access_management/booking_system/view/widgets/booking_sidebar.dart';
import 'package:syncrow_web/pages/access_management/booking_system/view/widgets/custom_calendar_page.dart';
import 'package:syncrow_web/pages/access_management/booking_system/view/widgets/icon_text_button.dart';
import 'package:syncrow_web/pages/access_management/booking_system/view/widgets/weekly_calendar_page.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';

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

  @override
  State<BookingPage> createState() => _BookingPageState();
}

class _BookingPageState extends State<BookingPage> {
  late final EventController _eventController;

  @override
  void initState() {
    super.initState();
    _eventController = EventController();
  }

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

  List<CalendarEventData> _generateDummyEventsForWeek(DateTime weekStart) {
    final List<CalendarEventData> events = [];
    for (int i = 0; i < 7; i++) {
      final date = weekStart.add(Duration(days: i));
      events.add(CalendarEventData(
        date: date,
        startTime: date.copyWith(hour: 9, minute: 0),
        endTime: date.copyWith(hour: 10, minute: 30),
        title: 'Team Meeting',
        description: 'Daily standup',
        color: Colors.blue,
      ));
      events.add(CalendarEventData(
        date: date,
        startTime: date.copyWith(hour: 14, minute: 0),
        endTime: date.copyWith(hour: 15, minute: 0),
        title: 'Client Call',
        description: 'Project discussion',
        color: Colors.green,
      ));
    }
    return events;
  }

  void _loadEventsForWeek(DateTime weekStart) {
    _eventController.removeWhere((_) => true);
    _eventController.addAll(_generateDummyEventsForWeek(weekStart));
  }

  @override
  Widget build(BuildContext context) {
    return MultiBlocProvider(
      providers: [
        BlocProvider(create: (_) => SelectedBookableSpaceBloc()),
        BlocProvider(create: (_) => DateSelectionBloc()),
      ],
      child: BlocListener<DateSelectionBloc, DateSelectionState>(
        listenWhen: (previous, current) =>
            previous.weekStart != current.weekStart,
        listener: (context, state) {
          _loadEventsForWeek(state.weekStart);
        },
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
              child: Column(
                children: [
                  Expanded(
                    flex: 2,
                    child: BlocBuilder<SelectedBookableSpaceBloc,
                        SelectedBookableSpaceState>(
                      builder: (context, state) {
                        return BookingSidebar(
                          onRoomSelected: (id) {
                            context
                                .read<SelectedBookableSpaceBloc>()
                                .add(SelectBookableSpace(id));
                          },
                        );
                      },
                    ),
                  ),
                  Expanded(
                    child: BlocBuilder<DateSelectionBloc, DateSelectionState>(
                      builder: (context, dateState) {
                        return Container(
                          color: Colors.grey[300],
                          child: CustomCalendarPage(
                            selectedDate: dateState.selectedDate,
                            onDateChanged: (day, month, year) {
                              final newDate = DateTime(year, month, day);
                              context
                                  .read<DateSelectionBloc>()
                                  .add(SelectDate(newDate));
                            },
                          ),
                        );
                      },
                    ),
                  ),
                ],
              ),
            ),
            Expanded(
              flex: 4,
              child: Padding(
                padding: const EdgeInsets.all(20.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Row(
                          children: [
                            SvgTextButton(
                              svgAsset: Assets.homeIcon,
                              label: 'Manage Bookable Spaces',
                              onPressed: () {},
                            ),
                            const SizedBox(width: 20),
                            SvgTextButton(
                              svgAsset: Assets.groupIcon,
                              label: 'Manage Users',
                              onPressed: () {},
                            ),
                          ],
                        ),
                        BlocBuilder<DateSelectionBloc, DateSelectionState>(
                          builder: (context, state) {
                            final weekStart = state.weekStart;
                            final weekEnd =
                                weekStart.add(const Duration(days: 6));
                            return Container(
                              padding: const EdgeInsets.symmetric(
                                  horizontal: 10, vertical: 5),
                              decoration: BoxDecoration(
                                color: ColorsManager.circleRolesBackground,
                                borderRadius: BorderRadius.circular(10),
                                boxShadow: const [
                                  BoxShadow(
                                    color: ColorsManager.textGray,
                                    blurRadius: 12,
                                    offset: Offset(0, 4),
                                  ),
                                ],
                              ),
                              child: Row(
                                children: [
                                  IconButton(
                                    icon: const Icon(Icons.arrow_back_ios,
                                        color: Colors.black),
                                    onPressed: () {
                                      context
                                          .read<DateSelectionBloc>()
                                          .add(PreviousWeek());
                                    },
                                  ),
                                  Text(
                                    _getMonthYearText(weekStart, weekEnd),
                                    style: const TextStyle(
                                      color: Colors.black,
                                      fontSize: 16,
                                      fontWeight: FontWeight.w500,
                                    ),
                                  ),
                                  IconButton(
                                    icon: const Icon(Icons.arrow_forward_ios,
                                        color: Colors.black),
                                    onPressed: () {
                                      context
                                          .read<DateSelectionBloc>()
                                          .add(NextWeek());
                                    },
                                  ),
                                ],
                              ),
                            );
                          },
                        ),
                      ],
                    ),
                    Expanded(
                      child: BlocBuilder<DateSelectionBloc, DateSelectionState>(
                        builder: (context, dateState) {
                          return WeeklyCalendarPage(
                            weekStart: dateState.weekStart,
                            selectedDate: dateState.selectedDate,
                            eventController: _eventController,
                          );
                        },
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  String _getMonthYearText(DateTime start, DateTime end) {
    final startMonth = DateFormat('MMM').format(start);
    final endMonth = DateFormat('MMM').format(end);
    final year = start.year == end.year
        ? start.year.toString()
        : '${start.year}-${end.year}';

    if (start.month == end.month) {
      return '$startMonth $year';
    } else {
      return '$startMonth - $endMonth $year';
    }
  }
}