import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:unicons/unicons.dart';

import 'package:random/config/theme.dart';
import 'package:random/cubit/data_cubit.dart';
import 'package:random/cubit/settings_cubit.dart';
import 'package:random/ui/widgets/header_app.dart';
import 'package:random/ui/widgets/styles_widget.dart';

class DemoPage extends StatelessWidget {
  const DemoPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Theme.of(context).colorScheme.surface,
      child: ListView(
        padding: const EdgeInsets.symmetric(horizontal: 4),
        physics: const BouncingScrollPhysics(),
        children: <Widget>[
          const SizedBox(height: 8),
          const AppHeader(text: 'TOP'),
          const SizedBox(height: 20),
          StyledWidget(
            child: persistedCounterBlock(BlocProvider.of<DataCubit>(context)),
          ),
          const SizedBox(height: 8),
          StyledWidget(
            borderRadius: 0,
            borderWidth: 12,
            // depth: 8,
            lowerColor: Colors.red,
            upperColor: Colors.yellow,
            child: testBlocConsumer(),
          ),
          const SizedBox(height: 8),
          StyledWidget(
            borderRadius: 10,
            borderWidth: 30,
            depth: 20,
            lowerColor: Colors.blueGrey,
            upperColor: Colors.blue,
            child: testBlocBuilder(),
          ),
          const SizedBox(height: 8),
          fakeApiCall(),
          const SizedBox(height: 8),
          const AppHeader(text: 'BOTTOM'),
          const SizedBox(height: 8),
        ],
      ),
    );
  }

  Widget persistedCounterBlock(DataCubit dataCubit) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        IconButton(
          icon: const Icon(UniconsSolid.arrow_circle_down),
          color: appTheme.primaryColor,
          onPressed: () => dataCubit.updateCounter(-1),
        ),
        testBlocConsumer(),
        IconButton(
          icon: const Icon(UniconsSolid.arrow_circle_up),
          color: appTheme.primaryColor,
          onPressed: () => dataCubit.updateCounter(1),
        ),
      ],
    );
  }

  Widget fakeApiCall() {
    return BlocBuilder<SettingsCubit, SettingsState>(
      builder: (context, settingsSate) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text('apiUrl: ${settingsSate.apiUrl}'),
            Text('securityToken: ${settingsSate.securityToken}'),
            Text('interfaceType: ${settingsSate.interfaceType}'),
          ],
        );
      },
    );
  }

  Widget testBlocConsumer() {
    return BlocConsumer<DataCubit, DataState>(
      listener: (context, dataState) {
        // do stuff here based on state
      },
      builder: (context, dataState) {
        // return widget here based on state
        return Text('BlocConsumer / $dataState');
      },
    );
  }

  Widget testBlocListener() {
    return BlocListener<DataCubit, DataState>(
      listener: (context, dataState) {
        // do stuff here based on state
      },
    );
  }

  Widget testBlocBuilder() {
    return BlocBuilder<DataCubit, DataState>(
      builder: (context, dataState) {
        // return widget here based on state
        return Text('BlocBuilder / $dataState');
      },
    );
  }
}