import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:initial_folder/size_config.dart';
import 'package:initial_folder/theme.dart';

class Instruktur extends StatefulWidget {
  const Instruktur({
    Key? key,
    required this.id,
    this.instructor,
    this.bio,
    this.rating,
    this.review,
    this.totalStudent,
    this.totalLesson,
    this.video = false,
    this.fotoProfile,
    this.headline,
  }) : super(key: key);
  final String id;
  final String? instructor;
  final String? bio;
  final String? rating;
  final String? review;
  final String? fotoProfile;
  final String? totalLesson;
  final String? totalStudent;
  final String? headline;
  final bool video;

  @override
  State<Instruktur> createState() => _InstrukturState();
}

class _InstrukturState extends State<Instruktur> {
  bool isExpanded = false;

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Instruktur Kursus',
            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
          ),
          const SizedBox(height: 10),
          Container(
            decoration: BoxDecoration(
              color: const Color(0xFF212121),
              borderRadius: BorderRadius.circular(8),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const SizedBox(height: 16),
                    Container(
                      margin: EdgeInsets.only(left: 10),
                      child: CircleAvatar(
                        radius: 40,
                        backgroundColor: Colors.amber,
                        backgroundImage: widget.fotoProfile == null
                            ? AssetImage("assets/images/Profile Image.png")
                            : NetworkImage(widget.fotoProfile!)
                                as ImageProvider,
                      ),
                    ),
                    const SizedBox(height: 8),
                    Container(
                      margin: EdgeInsets.only(left: 10),
                      child: Text(
                        widget.instructor ?? '',
                        style: TextStyle(fontSize: 15),
                      ),
                    ),
                    SizedBox(height: 2),
                    widget.headline != null
                        ? Container(
                            margin: EdgeInsets.only(left: 10),
                            child: Text(
                              widget.headline!,
                              style: TextStyle(fontSize: 13),
                            ),
                          )
                        : const SizedBox(),
                    SizedBox(height: 10),
                    Container(
                      margin: EdgeInsets.only(left: 10),
                      child: Row(
                        children: [
                          RatingBarIndicator(
                            itemSize: 11,
                            rating: double.parse(widget.rating ?? '0'),
                            direction: Axis.horizontal,
                            itemCount: 5,
                            itemBuilder: (context, _) => const FaIcon(
                              FontAwesomeIcons.solidStar,
                              color: Colors.amber,
                            ),
                          ),
                          SizedBox(width: 4),
                          Text(
                            double.parse(widget.rating ?? '0').toString(),
                            style: TextStyle(fontSize: 10),
                          ),
                          SizedBox(width: 4),
                          Text(
                            '(${widget.review ?? '0'})',
                            style: TextStyle(fontSize: 10),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      height: 40,
                      margin: EdgeInsets.only(left: 10, top: 1),
                      child: Row(
                        children: [
                          Text(
                            '${widget.totalStudent ?? '0'} Murid',
                            style: primaryTextStyle.copyWith(
                                color: secondaryColor,
                                fontSize: getProportionateScreenWidth(10),
                                letterSpacing: 0.5),
                          ),
                          SizedBox(width: 10),
                          Text(
                            '${widget.totalLesson ?? ''} Pelajaran',
                            style: primaryTextStyle.copyWith(
                                color: secondaryColor,
                                fontSize: getProportionateScreenWidth(10),
                                letterSpacing: 0.5),
                          )
                        ],
                      ),
                    ),
                    if (widget.bio == null || widget.bio!.isEmpty)
                      Padding(
                        padding: EdgeInsets.only(
                            left: getProportionateScreenHeight(10),
                            right: getProportionateScreenHeight(10),
                            bottom: getProportionateScreenHeight(10)),
                        child: Text(
                          '*Instruktur belum mencantumkan profil*',
                          style: TextStyle(
                            fontSize: getProportionateScreenWidth(10),
                            fontWeight: reguler,
                            fontFamily: 'Noto Sans',
                            color: secondaryColor,
                          ),
                        ),
                      )
                    else
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Padding(
                            padding: EdgeInsets.only(
                                left: getProportionateScreenHeight(5),
                                right: getProportionateScreenHeight(10)),
                            child: isExpanded
                                ? Html(
                                    data: widget.bio,
                                    style: {
                                      "body": Style(
                                          fontSize: FontSize(12),
                                          fontWeight: reguler,
                                          fontFamily: 'Noto Sans',
                                          color: secondaryColor),
                                    },
                                  )
                                : Html(
                                    data: widget.bio != null &&
                                            widget.bio!.length > 200
                                        ? widget.bio!.substring(0, 200)
                                        : widget.bio!,
                                    style: {
                                      "body": Style(
                                          fontSize: FontSize(12),
                                          fontWeight: reguler,
                                          fontFamily: 'Noto Sans',
                                          color: secondaryColor),
                                    },
                                  ),
                          ),
                          if (widget.bio!.isNotEmpty &&
                              (widget.bio!.length > 70 ||
                                  widget.bio!.length > 200))
                            Padding(
                              padding: EdgeInsets.only(
                                  left: getProportionateScreenHeight(7)),
                              child: TextButton(
                                onPressed: () {
                                  setState(() {
                                    isExpanded = !isExpanded;
                                  });
                                },
                                child: Text(
                                  isExpanded
                                      ? 'Tampilkan Lebih Sedikit'
                                      : 'Tampilkan Lebih Banyak',
                                  style: primaryTextStyle.copyWith(
                                    fontWeight: semiBold,
                                    color: primaryColor,
                                    fontSize: getProportionateScreenWidth(12),
                                  ),
                                ),
                              ),
                            ),
                        ],
                      ),
                  ],
                )
              ],
            ),
          ),
          const SizedBox(height: 30)
        ],
      ),
    );
  }
}