import 'package:birzha/core/adaptix/adaptix.dart';
import 'package:birzha/components/baseWidget.dart';
import 'package:birzha/components/categoryBuilder.dart';
import 'package:birzha/components/fakeSearchBar.dart';
import 'package:birzha/components/indicator.dart';
import 'package:birzha/components/refreshButton.dart';
import 'package:birzha/constants.dart';
import 'package:birzha/models/categories/products/pure.dart';
import 'package:birzha/models/categories/products/remote.dart';
import 'package:birzha/new/themes/colors.dart';
import 'package:flutter/material.dart';
import 'package:birzha/core/lazyload/lazyload.dart';

class MasterCategoryScreen extends StatefulWidget {
  const MasterCategoryScreen({Key? key}) : super(key: key);

  @override
  _MasterCategoryScreenState createState() => _MasterCategoryScreenState();
}

class _MasterCategoryScreenState extends State<MasterCategoryScreen> with AutomaticKeepAliveClientMixin {
  final category = MasterProductsRemoteCategory();

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return BaseWidget(
        appBar: BaseAppBar(
          color: ThemeColor.white,
          goBack: () {},
          customChild: FakeSearchBar(
            route: 'category',
          ),
        ),
        color: Theme.of(context).backgroundColor,
        body: LazyLoadView<ProductsPureCategory>(
            data: (page, context) => category.getSubCategories(context, page: page),
            loaderWidget: SliverFillRemaining(
              child: Center(child: Indicator(size: 0.7.adaptedPx())),
            ),
            loadMoreWidget: SliverToBoxAdapter(
              child: Container(
                margin: EdgeInsets.symmetric(vertical: 10.adaptedPx()),
                alignment: Alignment.center,
                child: Row(
                  children: [
                    Expanded(
                      child: Center(child: Indicator(size: 0.6.adaptedPx())),
                    )
                  ],
                ),
              ),
            ),
            contentPadding: EdgeInsets.symmetric(horizontal: AppConstants.horizontalPadding(context) / 1.2, vertical: 15.adaptedPx()),
            errorWidget: (refresh, error) {
              return SliverFillRemaining(
                child: Center(
                  child: RefreshButton(
                    onTap: refresh,
                    size: 38.adaptedPx(),
                  ),
                ),
              );
            },
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: AppConstants.categoryAxisCount(context),
                childAspectRatio: 1,
                mainAxisSpacing: AppConstants.horizontalPadding(context) / 1.2,
                crossAxisSpacing: AppConstants.horizontalPadding(context) / 1.2),
            errorOnLoadMoreWidget: (refresh, error) {
              return Container(
                margin: EdgeInsets.symmetric(vertical: 10.adaptedPx()),
                child: RefreshButton(
                  onTap: refresh,
                  size: 25.adaptedPx(),
                ),
              );
            },
            needPagination: false,
            itemBuilder: (context, model, index) => CategoryBuilder(category: model)));
  }

  @override
  bool get wantKeepAlive => true;
}