import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/all_requests_provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/models/user.dart';
import 'package:test_sa/new_views/pages/new_gas_refill_request_page.dart';
import 'package:test_sa/views/pages/device_transfer/create__asset_transfer_request.dart';
import 'package:test_sa/views/pages/user/requests/create_service_request_page.dart';

import '../app_style/app_color.dart';

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

  @override
  State<AppFloatingActionButton> createState() => _AppFloatingActionButtonState();
}

class _AppFloatingActionButtonState extends State<AppFloatingActionButton> {
  double turns = 0.0;

  void _rotate() {
    setState(() {
      if (turns == 0) {
        turns += 1.0 / 8.0;
      } else {
        turns = 0;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    User user = Provider.of<UserProvider>(context, listen: false).user!;
    final elements = [
      if (user.type == UsersTypes.normal_user) fabItem(context.translation.gasRefillRequest, "gas_refill_request", NewGasRefillRequestPage.routeName),
      if (user.type == UsersTypes.normal_user) const Divider().defaultStyle(context).paddingOnly(top: 16, bottom: 16),
      if (user.type == UsersTypes.normal_user) fabItem(context.translation.transferRequest, "transfer_request", CreateAssetTransferRequest.id),
      if (user.type == UsersTypes.normal_user) const Divider().defaultStyle(context).paddingOnly(top: 16, bottom: 16),
      if (user.type == UsersTypes.normal_user) fabItem(context.translation.serviceRequest, "service_request", CreateServiceRequestPage.id),
    ];
    const duration = Duration(milliseconds: 250);
    return elements.isEmpty
        ? const SizedBox.shrink()
        : Column(
            mainAxisAlignment: MainAxisAlignment.end,
            crossAxisAlignment: CrossAxisAlignment.end,
            mainAxisSize: MainAxisSize.min,
            children: [
              Visibility(
                visible: turns != 0,
                maintainAnimation: true,
                maintainState: true,
                child: AnimatedOpacity(
                  opacity: turns != 0 ? 1 : 0,
                  duration: duration,
                  child: Container(
                    width: MediaQuery.of(context).size.width * .66,
                    padding: const EdgeInsets.all(16),
                    decoration: ShapeDecoration(
                      color: AppColor.background(context),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(10),
                      ),
                      shadows: [BoxShadow(color: Colors.black.withOpacity(0.05), blurRadius: 14, offset: const Offset(0, 0), spreadRadius: 0)],
                      // shadows: const [BoxShadow(color: Color(0x0C000000), blurRadius: 10, offset: Offset(0, 0), spreadRadius: 0)],
                    ),
                    child: Column(mainAxisSize: MainAxisSize.min, children: elements),
                  ),
                ),
              ),
              16.height,
              FloatingActionButton(
                child: AnimatedRotation(
                  turns: turns,
                  duration: duration,
                  child: const Icon(Icons.add),
                ),
                onPressed: () {
                  _rotate();
                },
              ),
            ],
          );
  }

  Widget fabItem(String label, String iconName, routeName) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Expanded(
          flex: 4,
          child: label.heading5(context),
        ),
        // 4.width,
        Expanded(
          flex: 1,
          child: iconName.toSvgAsset(width: 24, height: 24, color: AppColor.blueStatus(context)),
        )
      ],
    ).onPress(() async {
      _rotate();
      await Navigator.of(context).pushNamed(routeName);
      Provider.of<AllRequestsProvider>(context, listen: false).getRequests();
    });
  }
}