Untitled

import 'package:druto_shopping/apps/drawerScreen/screens/drawer_screen.dart';
import 'package:druto_shopping/apps/homepage/models/models.dart';
import 'package:druto_shopping/apps/widgets/custom_text_widget.dart';
import 'package:druto_shopping/general/constants/constants.dart';
import 'package:druto_shopping/general/utils/colors.dart';
import 'package:druto_shopping/general/utils/config.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../../../general/constants/urls.dart';
import '../../homepage/repository/homepage_provider.dart';

class CategoriesDetailsPage extends ConsumerWidget {
  CategoriesDetailsPage({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final category1 = ref.watch(categoryItems);
    Config().init(context);

    return Scaffold(
      backgroundColor: Theme.of(context).colorScheme.outline,
      drawer: DrawerScreen(),
      body: SafeArea(
        child: SingleChildScrollView(
          child: Column(
            children: [
              Row(
                children: [
                  const SizedBox(width: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.pop(context);
                    },
                    child: CircleAvatar(
                      backgroundColor: ColorResources.COLOR_BLACK,
                      radius: Config.screenWidth! * 0.03,
                      child: Icon(
                        Icons.arrow_back,
                        size: Config.screenWidth! * 0.05,
                        color: ColorResources.COLOR_WHITE,
                      ),
                    ),
                  ),
                  spaceHorizontal(percentange: 0.15),
                  CustomTextWidgets(
                      title: 'Categories',
                      fontsize: Config.screenWidth! * 0.06,
                      fontweight: FontWeight.w700)
                ],
              ),
              spaceVertical(percentange: 0.05),
              SizedBox(
                height: Config.screenHeight,
                width: Config.screenWidth,
                child: category1.when(
                    data: ((category1) => GridView.builder(
                          padding: EdgeInsets.all(Config.screenWidth! * 0.03),
                          shrinkWrap: true,
                          itemCount: category1.length,
                          gridDelegate:
                              const SliverGridDelegateWithFixedCrossAxisCount(
                                  crossAxisCount: 3),
                          itemBuilder: (context, index) => Column(
                            children: [
                              Container(
                                padding:
                                    EdgeInsets.all(Config.screenWidth! * 0.03),
                                decoration: BoxDecoration(
                                    color: ColorResources.COLOR_WHITE,
                                    border: Border.all(
                                        color: ColorResources.DIVIDER,
                                        width: 2),
                                    borderRadius: BorderRadius.circular(10)),
                                height: Config.screenHeight! * .10,
                                width: Config.screenWidth! * .27,
                                child: Image.network(
                                  Urls.baseUrlForImage +
                                      category1[index]['photo'],
                                ),
                              ),
                              CustomTextWidgets(
                                  title: category1[index]['title'],
                                  fontsize: Config.screenWidth! * 0.02,
                                  fontweight: FontWeight.bold)
                            ],
                          ),
                        )),
                    error: ((error, stackTrace) => Center(
                          child: Text('an error occured'),
                        )),
                    loading: () => Center(
                          child: Text('an error occured'),
                        )),
              )
            ],
          ),
        ),
      ),
    );
  }
}