import 'package:cpt_community/components/comments_dialog.dart';
import 'package:cpt_community/modules/my_following/my_follow/my_follow_vm.dart';
import 'package:cpt_community/modules/my_following/my_follower/my_follower_vm.dart';
import 'package:cs_resources/generated/l10n.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_view.dart';

import 'item_following_vm.dart';


class MyFollowingListItem extends StatelessWidget {
  final String itemType;
  bool? hasBottomDriver = true;
  Map<String, dynamic> itemObj;
  void Function(dynamic)? onClickAction;
  MyFollowingListItem({
    super.key,
    required this.itemObj,
    itemType,
    this.hasBottomDriver=true,
    this.onClickAction
  }): itemType = itemType ?? MyFollowingType['isFollowType'];

  @override
  Widget build(BuildContext context) {
    String avator = itemObj?['avatar']??'';
    String name = itemObj?['name']??'';
    return Column(
      children: [
        Container(
          margin: const EdgeInsets.only(left: 15,right: 15,top: 15,bottom: 15),
          child: Row(
            mainAxisSize: MainAxisSize.max,
            children: [
              Expanded(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    MyLoadImage(
                      avator,
                      width: 65,
                      height: 65,
                      isCircle: true,
                    ),
                    MyTextView(
                      name,
                      fontSize: 17,
                      isFontMedium: true,
                      marginLeft: 17,
                    )
                  ],
                ).onTap((){
                  // onClickAction?.call(itemObj);
                }),
              ),
              // _buildIsFollowButton(context),
              itemType == MyFollowingType['isFollowType'] ? HookConsumer(
                key: ValueKey(itemObj['id']), // 唯一标识每个 item
                builder: (context, ref, child) {
                  final isFollow = useState<bool>(true);
                  return  MyButton(
                    text: isFollow.value? S.current.followed : S.current.to_follow,
                    onPressed: () async{
                      final vm = ref.read(itemFollowingVmProvider.notifier);
                      // todo 调用接口 然后更新状态
                      int to_user_id = itemObj['id'];
                      vm.handlerFollow(context, to_user_id, isFollow.value, itemType!, (asyncResult){
                        if(asyncResult){
                          isFollow.value = !isFollow.value;
                        }
                      });

                    },
                    textColor: isFollow.value? context.appColors.textDarkGray : context.appColors.textWhite,
                    side: isFollow.value?  BorderSide(color: context.appColors.textDarkGray,width: 0.5) : BorderSide.none,
                    backgroundColor: isFollow.value? Colors.transparent :context.appColors.textPrimary,
                    fontSize: 14,
                    fontWeight: FontWeight.w400,
                    minWidth: 67.5,
                    minHeight: 30.5,
                  );
                },
              ): const SizedBox.shrink()
            ],
          ),
        ),
        if(hasBottomDriver!)
          Container(
            height: 1,
            color: context.appColors.dividerDefault,
          )
      ],
    );
  }
}
