Change TPIn #3

lib/features/profile/tpin/change_tpin_otp_screen.dart

@@ -1,10 +1,20 @@
-
+ import 'dart:async';
+ import 'dart:convert';
  import 'package:flutter/material.dart';
- import 'package:kmobile/widgets/pin_input_field.dart'; // Use the new widget
+ import 'package:kmobile/di/injection.dart';
+ import 'package:kmobile/features/dashboard/screens/dashboard_screen.dart';
+ import 'package:kmobile/widgets/pin_input_field.dart';
+ import '../../../api/services/change_password_service.dart';
 
  class ChangeTpinOtpScreen extends StatefulWidget {
    final String newTpin;
-   const ChangeTpinOtpScreen({super.key, required this.newTpin});
+   final String mobileNumber; // Receive mobile number
+
+   const ChangeTpinOtpScreen({
+     super.key,
+     required this.newTpin,
+     required this.mobileNumber,
+   });
 
    @override
    State<ChangeTpinOtpScreen> createState() => _ChangeTpinOtpScreenState();
@@ -12,11 +22,62 @@
 
  class _ChangeTpinOtpScreenState extends State<ChangeTpinOtpScreen> {
    final _otpController = TextEditingController();
+   final ChangePasswordService _changePasswordService = getIt<ChangePasswordService>();
+   bool _isLoading = false;
 
-   void _handleVerifyOtp() {
-     // TODO: Add API call to verify OTP and change TPIN
-     print('Verifying OTP: ${_otpController.text} for new TPIN: ${widget.newTpin}');
-     Navigator.of(context).popUntil((route) => route.isFirst);
+   void _handleVerifyOtp() async {
+     if (_otpController.text.length != 6) {
+       ScaffoldMessenger.of(context).showSnackBar(
+         const SnackBar(content: Text('Please enter a valid 6-digit OTP')),
+       );
+       return;
+     }
+
+     setState(() {
+       _isLoading = true;
+     });
+
+     String message = 'An unknown error occurred.';
+     bool success = false;
+
+     try {
+       // 1. Validate the OTP
+       final responseString = await _changePasswordService.validateOtp(
+         otp: _otpController.text,
+         mobileNumber: widget.mobileNumber,
+       );
+       final response = jsonDecode(responseString);
+
+       // 2. Check status and set message
+       if (response['statusCode'] == 200 || response['statusCode'] == 2000) {
+         message = 'TPIN changed successfully!';
+         success = true;
+       } else {
+         message = response['message'] ?? 'Invalid OTP. Please try again.';
+       }
+     } catch (e) {
+       message = 'Failed to verify OTP: $e';
+     } finally {
+       // 3. Show feedback
+       if (mounted) {
+         ScaffoldMessenger.of(context).showSnackBar(
+           SnackBar(
+             content: Text(message),
+             backgroundColor: success ? Colors.green : Colors.red,
+           ),
+         );
+
+         // 4. Navigate to dashboard after 5 seconds
+         Timer(const Duration(seconds: 5), () {
+           if (mounted) {
+             Navigator.of(context).pushAndRemoveUntil(
+               MaterialPageRoute(builder: (context) => const DashboardScreen()),
+               (Route<dynamic> route) => false,
+             );
+           }
+         });
+       }
+     }
    }
 
    @override
@@ -41,9 +102,21 @@
                controller: _otpController,
              ),
              const SizedBox(height: 32),
-             ElevatedButton(
-               onPressed: _handleVerifyOtp,
-               child: const Text('Verify & Change TPIN'),
+             SizedBox(
+               width: double.infinity,
+               child: ElevatedButton(
+                 onPressed: _isLoading ? null : _handleVerifyOtp,
+                 child: _isLoading
+                     ? const SizedBox(
+                         height: 24,
+                         width: 24,
+                         child: CircularProgressIndicator(
+                           color: Colors.white,
+                           strokeWidth: 2.5,
+                         ),
+                       )
+                     : const Text('Verify & Change TPIN'),
+               ),
              ),
            ],
          ),