import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:product_selector/screens/handsets/compare/model/handsets_model.dart';
import 'package:product_selector/utilities/colors.dart';

class TableBody extends StatefulWidget {
  const TableBody(
      {this.firstHandsets, this.secondHandsets, this.thirdHandsets, Key? key})
      : super(key: key);

  final SpecificationsGroup? firstHandsets;
  final SpecificationsGroup? secondHandsets;
  final SpecificationsGroup? thirdHandsets;

  @override
  State<TableBody> createState() => _TableBodyState();
}

class _TableBodyState extends State<TableBody> {
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
        physics: const NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: widget.firstHandsets?.specifications?.length ?? 0,
        itemBuilder: (context, index) {
          return Table(
            border: TableBorder.symmetric(
              inside: BorderSide(
                  color: UIColors.aluminium,
                  style: BorderStyle.solid,
                  width: 2.w),
            ),
            children: [tableRow(index)],
          );
        });
  }

  TableRow tableRow(index) {
    double topBorder = index != 0 ? 1.w : 3.w;
    double bottomBorder =
        index != widget.firstHandsets!.specifications!.length - 1 ? 1.w : 4.w;
    return TableRow(
      decoration: BoxDecoration(
          border: Border(
        top: BorderSide(
            color: UIColors.aluminium,
            style: BorderStyle.solid,
            width: topBorder),
        bottom: BorderSide(
            color: UIColors.aluminium,
            style: BorderStyle.solid,
            width: bottomBorder),
        right: BorderSide(
            color: UIColors.aluminium, style: BorderStyle.solid, width: 3.w),
        left: BorderSide(
            color: UIColors.aluminium, style: BorderStyle.solid, width: 3.w),
      )),
      children: [
        Padding(
          padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 2.h),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SizedBox(
                height: 5.h,
              ),
              if (index == 0)
                sectionTitle('${widget.firstHandsets?.group?.label}'),
              SizedBox(
                height: 7.h,
              ),
              specificationsType(
                  '${widget.firstHandsets?.specifications?[index].specification?.label}')
            ],
          ),
        ),
        specificationsDetails(index,
            '${widget.firstHandsets?.specifications?[index].description}'),
        specificationsDetails(index,
            '${widget.secondHandsets?.specifications?[index].description}'),
        specificationsDetails(index,
            '${widget.thirdHandsets?.specifications?[index].description}'),
      ],
    );
  }

  Widget sectionTitle(String title) {
    return Text(title,
        style: TextStyle(
            fontSize: 20.sp,
            color: UIColors.darkGrey,
            fontWeight: FontWeight.w400));
  }

  Widget specificationsType(String title) {
    return Text(title,
        style: TextStyle(
            fontSize: 24.sp,
            color: UIColors.darkGrey,
            fontWeight: FontWeight.w700));
  }

  Widget specificationsDetails(index, String title) {
    double height = index == 0 ? 37.h : 16.h;
    return Padding(
      padding: EdgeInsetsDirectional.only(
          top: height, start: 11.w, end: 11.w, bottom: 10.h),
      child: Text(title != 'null' ? title : '',
          style: TextStyle(
              fontWeight: FontWeight.w400,
              fontSize: 24.sp,
              color: UIColors.darkGrey)),
    );
  }
}
i want to add row above the row for the price