Change TPIn #2

lib/features/profile/tpin/change_tpin_otp_screen.dart

@@ -0,0 +1,53 @@
+
+ import 'package:flutter/material.dart';
+ import 'package:kmobile/widgets/pin_input_field.dart'; // Use the new widget
+
+ class ChangeTpinOtpScreen extends StatefulWidget {
+   final String newTpin;
+   const ChangeTpinOtpScreen({super.key, required this.newTpin});
+
+   @override
+   State<ChangeTpinOtpScreen> createState() => _ChangeTpinOtpScreenState();
+ }
+
+ class _ChangeTpinOtpScreenState extends State<ChangeTpinOtpScreen> {
+   final _otpController = TextEditingController();
+
+   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);
+   }
+
+   @override
+   Widget build(BuildContext context) {
+     return Scaffold(
+       appBar: AppBar(
+         title: const Text('Verify OTP'),
+       ),
+       body: SingleChildScrollView(
+         padding: const EdgeInsets.all(16.0),
+         child: Column(
+           crossAxisAlignment: CrossAxisAlignment.center,
+           children: [
+             const SizedBox(height: 24),
+             const Text(
+               'Enter the OTP sent to your registered mobile number.',
+               textAlign: TextAlign.center,
+               style: TextStyle(fontSize: 16),
+             ),
+             const SizedBox(height: 32),
+             PinInputField(
+               controller: _otpController,
+             ),
+             const SizedBox(height: 32),
+             ElevatedButton(
+               onPressed: _handleVerifyOtp,
+               child: const Text('Verify & Change TPIN'),
+             ),
+           ],
+         ),
+       ),
+     );
+   }
+ }

lib/features/profile/tpin/change_tpin_screen.dart

@@ -0,0 +1,101 @@
+ import 'package:flutter/material.dart';
+ import 'package:kmobile/features/profile/tpin/change_tpin_otp_screen.dart';
+ import 'package:kmobile/widgets/pin_input_field.dart'; // Use the new widget
+
+ class ChangeTpinScreen extends StatefulWidget {
+   const ChangeTpinScreen({super.key});
+
+   @override
+   State<ChangeTpinScreen> createState() => _ChangeTpinScreenState();
+ }
+
+ class _ChangeTpinScreenState extends State<ChangeTpinScreen> {
+   final _formKey = GlobalKey<FormState>();
+   final _oldTpinController = TextEditingController();
+   final _newTpinController = TextEditingController();
+   final _confirmTpinController = TextEditingController();
+
+   @override
+   void dispose() {
+     _oldTpinController.dispose();
+     _newTpinController.dispose();
+     _confirmTpinController.dispose();
+     super.dispose();
+   }
+
+   void _handleChangeTpin() {
+     if (_formKey.currentState!.validate()) {
+       // TODO: Add API call to request OTP for TPIN change
+       Navigator.of(context).push(
+         MaterialPageRoute(
+           builder: (context) => ChangeTpinOtpScreen(
+             newTpin: _newTpinController.text,
+           ),
+         ),
+       );
+     }
+   }
+
+   @override
+   Widget build(BuildContext context) {
+     return Scaffold(
+       appBar: AppBar(
+         title: const Text('Change TPIN'),
+       ),
+       body: SingleChildScrollView(
+         padding: const EdgeInsets.all(16.0),
+         child: Form(
+           key: _formKey,
+           child: Column(
+             crossAxisAlignment: CrossAxisAlignment.start,
+             children: [
+               const Text('Current TPIN'),
+               const SizedBox(height: 8),
+               PinInputField(
+                 controller: _oldTpinController,
+                 validator: (value) {
+                   if (value == null || value.length != 6) {
+                     return 'Please enter your 6-digit old TPIN';
+                   }
+                   return null;
+                 },
+               ),
+               const SizedBox(height: 24),
+               const Text('New TPIN'),
+               const SizedBox(height: 8),
+               PinInputField(
+                 controller: _newTpinController,
+                 validator: (value) {
+                   if (value == null || value.length != 6) {
+                     return 'Please enter a 6-digit new TPIN';
+                   }
+                   return null;
+                 },
+               ),
+               const SizedBox(height: 24),
+               const Text('Confirm New TPIN'),
+               const SizedBox(height: 8),
+               PinInputField(
+                 controller: _confirmTpinController,
+                 validator: (value) {
+                   if (value == null || value.length != 6) {
+                     return 'Please confirm your new TPIN';
+                   }
+                   if (value != _newTpinController.text) {
+                     return 'TPINs do not match';
+                   }
+                   return null;
+                 },
+               ),
+               const SizedBox(height: 32),
+               ElevatedButton(
+                 onPressed: _handleChangeTpin,
+                 child: const Text('Proceed'),
+               ),
+             ],
+           ),
+         ),
+       ),
+     );
+   }
+ }