import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';

class AlertDialogRTLPlayground extends ConsumerStatefulWidget {
  const AlertDialogRTLPlayground({super.key});

  @override
  ConsumerState<AlertDialogRTLPlayground> createState() =>
      _AlertDialogRTLPlaygroundState();
}

class _AlertDialogRTLPlaygroundState
    extends ConsumerState<AlertDialogRTLPlayground> {
  bool _isRTL = false;

  void _showAlertDialog(BuildContext context) {
    showDialog(
      context: context,
      builder:
          (context) => AlertDialog.adaptive(
            title: const Text('Alert Dialog'),
            content: const Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text('This is a test alert dialog'),
                SizedBox(height: 8),
                Text('It should respect RTL direction'),
                SizedBox(height: 8),
                Text('But it doesn\'t properly align in RTL'),
              ],
            ),
            actions: [
              TextButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('Cancel'),
              ),
              TextButton(
                onPressed: () => Navigator.pop(context),
                child: const Text('OK'),
              ),
            ],
          ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      locale: _isRTL ? const Locale('ur') : const Locale('en'),
      localizationsDelegates: [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: const [Locale('en'), Locale('ur')],
      home: Builder(
        builder: (context) {
          return Scaffold(
            appBar: AppBar(
              title: const Text('AlertDialog RTL Test'),
              actions: [
                IconButton(
                  icon: const Icon(Icons.language),
                  onPressed: () {
                    setState(() {
                      _isRTL = !_isRTL;
                    });
                  },
                ),
              ],
            ),
            body: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    'Current Language: ${_isRTL ? 'Urdu (RTL)' : 'English (LTR)'}',
                    style: Theme.of(context).textTheme.titleLarge,
                  ),
                  const SizedBox(height: 20),
                  ElevatedButton(
                    onPressed: () => _showAlertDialog(context),
                    child: const Text('Show Alert Dialog'),
                  ),
                ],
              ),
            ),
          );
        },
      ),
    );
  }
}