cloudsolutions-atoms/lib/views/pages/user/requests/comments_bottom_sheet.dart

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/comments_provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/controllers/validator/validator.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/string_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/comment.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/new_views/common_widgets/app_text_form_field.dart';
import 'package:test_sa/views/widgets/loaders/lazy_loading.dart';
import 'package:test_sa/views/widgets/loaders/no_item_found.dart';

import '../../../../new_views/app_style/app_color.dart';
import '../../../widgets/loaders/loading_manager.dart';

class CommentsBottomSheet extends StatefulWidget {
  final String requestId;

  const CommentsBottomSheet({Key? key, required this.requestId}) : super(key: key);

  @override
  State<CommentsBottomSheet> createState() => _CommentsBottomSheetState();
}

class _CommentsBottomSheetState extends State<CommentsBottomSheet> {
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  String? text;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final commentsProvider = Provider.of<CommentsProvider>(context);
    final userProvider = Provider.of<UserProvider>(context, listen: false);
    return SingleChildScrollView(
      child: Wrap(
        children: [
          Container(
            clipBehavior: Clip.antiAlias,
            margin: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom),
            decoration: BoxDecoration(
              color: Theme.of(context).scaffoldBackgroundColor,
              borderRadius: const BorderRadius.only(topRight: Radius.circular(20), topLeft: Radius.circular(20)),
            ),
            padding: EdgeInsets.symmetric(horizontal: 16.toScreenWidth, vertical: 8.toScreenHeight),
            child: Form(
              key: _formKey,
              child: Column(
                children: [
                  LoadingManager(
                    isLoading: commentsProvider.isLoading,
                    isFailedLoading: commentsProvider.comments == null,
                    stateCode: commentsProvider.stateCode,
                    onRefresh: () async {
                      commentsProvider.reset();
                      await commentsProvider.getComments(callId: widget.requestId);
                    },
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Container(
                          width: 40.toScreenWidth,
                          height: 5.toScreenHeight,
                          decoration: BoxDecoration(color: AppColor.neutral40, borderRadius: BorderRadius.circular(30)),
                        ),
                        16.height,
                        Align(
                          alignment: AlignmentDirectional.centerStart,
                          child: context.translation.comments.heading3(context).custom(fontWeight: FontWeight.w600),
                        ),
                        commentsProvider.comments.isEmpty
                            ? SizedBox(
                                height: MediaQuery.of(context).size.height * 0.25,
                                child: NoItemFound(message: context.translation.noDataFound),
                              )
                            : LazyLoading(
                                nextPage: commentsProvider.nextPage,
                                onLazyLoad: () async => await commentsProvider.getComments(callId: widget.requestId),
                                child: ListView.separated(
                                  itemCount: commentsProvider.comments.length,
                                  padding: const EdgeInsets.only(top: 16, bottom: 8),
                                  shrinkWrap: true,
                                  physics: const NeverScrollableScrollPhysics(),
                                  separatorBuilder: (cxt, index) => 8.height,
                                  itemBuilder: (context, itemIndex) {
                                    final model = commentsProvider.comments[itemIndex];
                                    return Column(
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      children: [
                                        (model.createdBy?.userName ?? "Nurse").heading6(context),
                                        8.height,
                                        (model.comment ?? "").bodyText(context),
                                        8.height,
                                        Align(
                                          alignment: AlignmentDirectional.bottomEnd,
                                          child: Text(DateTime.tryParse(model.createdOn!)!.toIso8601String().toServiceRequestDetailsFormat,
                                              style: AppTextStyles.tinyFont.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral50)),
                                        ),
                                      ],
                                    ).toShadowContainer(context);
                                  },
                                ),
                              ),
                      ],
                    ),
                  ),
                  if (userProvider.user!.type == UsersTypes.normal_user) 8.height,
                  if (userProvider.user!.type == UsersTypes.normal_user)
                    AppTextFormField(
                      labelText: "Type any comment",
                      backgroundColor: AppColor.neutral30,
                      alignLabelWithHint: true,
                      showShadow: false,
                      validator: (value) => Validator.hasValue(value) ? null : context.translation.requiredField,
                      textInputType: TextInputType.multiline,
                      suffixIcon: "comment_send".toSvgAsset().paddingOnly(end: 16).onPress(() {
                        if (_formKey.currentState!.validate()) {
                          _formKey.currentState!.save();
                          final comment = Comment(id: 0, callRequestId: num.tryParse(widget.requestId ?? ""), comment: text);
                          commentsProvider.addComment(context, comment: comment);
                        }
                      }),
                      onSaved: (value) {
                        text = value;
                      },
                    ),
                  16.height,
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}