import 'package:didvan/config/design_config.dart';
import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/models/mention/mention.dart';
import 'package:didvan/models/view/action_sheet_data.dart';
import 'package:didvan/providers/user.dart';
import 'package:didvan/utils/action_sheet.dart';
import 'package:didvan/utils/date_time.dart';
import 'package:didvan/views/mentions/mentions_state.dart';
import 'package:didvan/views/widgets/menu_item.dart';
import 'package:didvan/views/widgets/didvan/icon_button.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:didvan/views/widgets/skeleton_image.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class Mention extends StatefulWidget {
  final FocusNode focusNode;
  final MentionData comment;

  const Mention({
    Key? key,
    required this.focusNode,
    required this.comment,
  }) : super(key: key);

  @override
  State<Mention> createState() => MentionState();
}

class MentionState extends State<Mention> {
  late final MentionsState state;

  MentionData get _comment => widget.comment;

  @override
  void initState() {
    state = context.read<MentionsState>();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [_commentBuilder(comment: _comment)],
    );
  }

  Widget _commentBuilder({required comment, bool isReply = false}) => Container(
        decoration: BoxDecoration(
          border: Border(
            right: isReply
                ? BorderSide(color: Theme.of(context).colorScheme.caption)
                : BorderSide.none,
          ),
        ),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            if (isReply) const SizedBox(width: 12),
            if (comment.user.photo == null)
              const Icon(DidvanIcons.avatar_light),
            if (comment.user.photo != null)
              SkeletonImage(
                imageUrl: comment.user.photo,
                height: 24,
                width: 24,
                borderRadius: DesignConfig.highBorderRadius,
              ),
            const SizedBox(width: 12),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    children: [
                      DidvanText(
                        comment.user.fullName,
                        style: Theme.of(context).textTheme.bodyLarge,
                      ),
                      const Spacer(),
                      DidvanText(
                        DateTimeUtils.momentGenerator(comment.createdAt),
                        style: Theme.of(context).textTheme.bodySmall,
                        color: Theme.of(context).colorScheme.caption,
                      ),
                      const SizedBox(width: 4),
                      if (comment.user.id ==
                          context.read<UserProvider>().user.id)
                        DidvanIconButton(
                          size: 18,
                          gestureSize: 24,
                          icon: DidvanIcons.menu_light,
                          onPressed: () => _showCommentActions(comment),
                        ),
                    ],
                  ),
                  DidvanText(
                    "اشاره به ${comment.mentions.join("، ").toString()}",
                    color: Theme.of(context).colorScheme.primary,
                    style: Theme.of(context).textTheme.titleSmall,
                  ),
                  DidvanText(comment.text),
                ],
              ),
            ),
          ],
        ),
      );

  Future<void> _showCommentActions(comment) async {
    ActionSheetUtils.showBottomSheet(
      data: ActionSheetData(
        title: 'گزینه‌های نظر',
        content: Column(
          children: [
            if (comment.user.id == context.read<UserProvider>().user.id)
              MenuOption(
                title: 'حذف فراخوانی',
                color: Theme.of(context).colorScheme.secondary,
                onTap: () {
                  state.deleteMention(comment.id);
                  ActionSheetUtils.pop();
                },
                icon: DidvanIcons.trash_solid,
              ),
          ],
        ),
        hasConfirmButton: false,
        hasDismissButton: false,
      ),
    );
  }
}