import 'package:flutter/material.dart';
import 'package:rasadyar_core/core.dart';

abstract class Breadcrumb extends StatelessWidget {
  const Breadcrumb({super.key, this.routes, this.rxRoutes});

  final List<String>? routes;
  final RxList<String>? rxRoutes;
}

class TextBreadcrumb extends Breadcrumb {
  const TextBreadcrumb({super.key, super.routes, super.rxRoutes});

  @override
  Widget build(BuildContext context) {
    if (routes?.isEmpty ?? true) {
      return SizedBox.shrink();
    }
    return Padding(
      padding: const EdgeInsets.fromLTRB(0, 4, 7, 4),
      child: Text(routes!.join(" > "), style: AppFonts.yekan14.copyWith(color: AppColor.bgDark)),
    );
  }
}

class ContainerBreadcrumb extends Breadcrumb {
  const ContainerBreadcrumb({super.key, super.routes, super.rxRoutes})
    : assert(
        (routes != null && rxRoutes == null) || (routes == null && rxRoutes != null),
        'Only one of routes or rxRoutes should be provided',
      );

  @override
  Widget build(BuildContext context) {
    if ((routes?.isEmpty ?? true) && (rxRoutes?.isEmpty ?? true)) {
      return SizedBox.shrink();
    }
    if (rxRoutes != null) {
      return buildRXContainerPageRoute(rxRoutes!);
    } else {
      return buildContainerPageRoute(routes!);
    }
  }

  Widget buildContainerPageRoute(List<String> route) {
    return Row(
      children: [
        Container(
          height: 24.h,
          margin: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
          decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(2.r)),
          padding: EdgeInsets.symmetric(horizontal: 6.w),
          child: ListView.separated(
            scrollDirection: Axis.horizontal,
            physics: NeverScrollableScrollPhysics(),
            shrinkWrap: true,
            itemBuilder: (context, index) => Center(
              child: Text(
                route[index],
                style: AppFonts.yekan14.copyWith(color: AppColor.labelTextColor),
              ),
            ),
            separatorBuilder: (context, index) => Assets.vec.arrowLeftSvg.svg(
              height: 24.h,
              fit: BoxFit.fitHeight,
              colorFilter: ColorFilter.mode(Color(0xFFD6DEEE), BlendMode.srcIn),
            ),
            itemCount: route.length,
          ),
        ),
      ],
    );
  }

  Widget buildRXContainerPageRoute(RxList<String> routes) {
    return Row(
      children: [
        Container(
          height: 24.h,
          margin: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
          decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(2.r)),
          padding: EdgeInsets.symmetric(horizontal: 6.w),
          child: ObxValue((data) {
            return ListView.separated(
              scrollDirection: Axis.horizontal,
              physics: NeverScrollableScrollPhysics(),
              shrinkWrap: true,
              itemBuilder: (context, index) {
                var tmp = data[index];
                return Center(
                  child: Text(
                    tmp,
                    style: AppFonts.yekan14.copyWith(color: AppColor.labelTextColor),
                  ),
                );
              },
              separatorBuilder: (context, index) => Assets.vec.arrowLeftSvg.svg(
                height: 24.h,
                fit: BoxFit.fitHeight,
                colorFilter: ColorFilter.mode(Color(0xFFD6DEEE), BlendMode.srcIn),
              ),
              itemCount: data.length,
            );
          }, routes),
        ),
      ],
    );
  }
}

/*
class _TriangleClipper extends CustomClipper<Path> {
  final bool isFirst;
  final bool isLast;

  _TriangleClipper({required this.isFirst, required this.isLast});

  @override
  Path getClip(Size size) {
    final Path path = Path();

    if (isFirst) {
      path.moveTo(20, 0);
      path.lineTo(size.width, 0);
      path.lineTo(size.width, size.height);
      path.lineTo(20, size.height);
    } else {
      path.moveTo(20, 0);
      path.lineTo(size.width, 0);
      path.lineTo(size.width - 20, size.height / 2);
      path.lineTo(size.width, size.height);
      path.lineTo(20, size.height);
    }

    if (isLast) {
      path.moveTo(0, 0);
      path.lineTo(0, size.height);
    } else {
      path.moveTo(20, 0);
      path.lineTo(0, size.height / 2);
      path.lineTo(20, size.height);
    }
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return true;
  }
}*/
