import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:virtual_keyboard_multi_language/virtual_keyboard_multi_language.dart';

import '../settings/custom_layout.dart';

class TextInputDialog extends ConsumerWidget {
  const TextInputDialog({
    required this.controller,
    this.title = 'Text Input',
    this.onReturnPress,
    this.hintText,
    super.key,
  });

  final TextEditingController controller;
  final String title;
  final Function? onReturnPress;
  final String? hintText;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return TextField(
      controller: controller,
      decoration: InputDecoration(hintText: hintText),
      onTap: () {
        // always move the cursor to the end position by default
        controller.value = TextEditingValue(
          text: controller.text,
          selection: TextSelection.collapsed(
            offset: controller.text.length,
          ),
        );
        showDialog(
          context: context,
          builder: (context) => Dialog.fullscreen(
            // backgroundColor: Colors.transparent,
            child: ClipRect(
              // TODO: Blur background causes lag on the raspberry pi
              // BackdropFilter() with:
              // filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
              child: Scaffold(
                backgroundColor:
                    Theme.of(context).colorScheme.background.withOpacity(0.5),
                appBar: AppBar(
                  // backgroundColor: Colors.transparent,
                  title: Text(title),
                  centerTitle: false,
                  leading: IconButton(
                    onPressed: () {
                      FocusScope.of(context).unfocus();
                      context.pop();
                    },
                    icon: const Icon(Icons.close),
                  ),
                ),
                body: Stack(
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Align(
                        alignment: Alignment.topCenter,
                        child: Container(
                          constraints: const BoxConstraints(maxWidth: 400),
                          child: TextField(
                            controller: controller,
                            autofocus: true,
                          ),
                        ),
                      ),
                    ),
                    Align(
                      alignment: Alignment.bottomCenter,
                      child: TextFieldTapRegion(
                        child: VirtualKeyboard(
                          textController: controller,
                          textColor:
                              Theme.of(context).textTheme.headlineLarge!.color!,
                          type: VirtualKeyboardType.Alphanumeric,
                          // onKeyPress: (key) => onKeyPress(key, context),
                          customLayoutKeys: CustomLayoutKeys(),
                          onReturnKey: onReturnPress,
                          unfocus: true,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        );
      },
    );
  }
}