akedly 0.0.3

A simple Flutter package for Akedly OTP verification. Provides a clean interface for sending and verifying OTP codes through Akedly's Orchestrating API algorithm for all available channels (WhatsApp, [...]

example/main.dart

import 'package:flutter/material.dart';
import 'package:akedly/akedly.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Akedly OTP Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const OTPVerificationScreen(),
    );
  }
}

class OTPVerificationScreen extends StatefulWidget {
  const OTPVerificationScreen({super.key});

  @override
  State<OTPVerificationScreen> createState() => _OTPVerificationScreenState();
}

class _OTPVerificationScreenState extends State<OTPVerificationScreen> {
  final _phoneController = TextEditingController();
  final _otpController = TextEditingController();
  final _emailController = TextEditingController();
  final _akedlyClient = AkedlyClient(
    apiKey: 'your_api_key_here', // Replace with your actual API key
    pipelineId: 'your_pipeline_id_here', // Replace with your actual pipeline ID
  );
  
  String? _verificationId;
  bool _isLoading = false;
  String? _message;
  bool _isSuccess = false;

  @override
  void dispose() {
    _phoneController.dispose();
    _otpController.dispose();
    _akedlyClient.dispose();
    super.dispose();
  }

  Future<void> _sendOTP() async {
    if (_phoneController.text.isEmpty) {
      _showMessage('Please enter a phone number', false);
      return;
    }

    setState(() {
      _isLoading = true;
      _message = null;
    });

    try {
      final verificationId = await _akedlyClient.sendOTP(_phoneController.text, _emailController.text);
      setState(() {
        _verificationId = verificationId;
        _isLoading = false;
        _message = 'OTP sent successfully! Check your WhatsApp.';
        _isSuccess = true;
      });
    } on AkedlyException catch (e) {
      setState(() {
        _isLoading = false;
        _message = 'Failed to send OTP: ${e.message}';
        _isSuccess = false;
      });
    } catch (e) {
      setState(() {
        _isLoading = false;
        _message = 'An unexpected error occurred: $e';
        _isSuccess = false;
      });
    }
  }

  Future<void> _verifyOTP() async {
    if (_verificationId == null) {
      _showMessage('Please send OTP first', false);
      return;
    }

    if (_otpController.text.isEmpty) {
      _showMessage('Please enter the OTP code', false);
      return;
    }

    setState(() {
      _isLoading = true;
      _message = null;
    });

    try {
      final isValid = await _akedlyClient.verifyOTP(_verificationId!, _otpController.text);
      setState(() {
        _isLoading = false;
        if (isValid) {
          _message = 'OTP verified successfully! 🎉';
          _isSuccess = true;
        } else {
          _message = 'Invalid OTP code. Please try again.';
          _isSuccess = false;
        }
      });
    } on AkedlyException catch (e) {
      setState(() {
        _isLoading = false;
        _message = 'Failed to verify OTP: ${e.message}';
        _isSuccess = false;
      });
    } catch (e) {
      setState(() {
        _isLoading = false;
        _message = 'An unexpected error occurred: $e';
        _isSuccess = false;
      });
    }
  }

  void _showMessage(String message, bool isSuccess) {
    setState(() {
      _message = message;
      _isSuccess = isSuccess;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Akedly OTP Verification'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            const Text(
              'WhatsApp OTP Verification',
              style: TextStyle(
                fontSize: 24,
                fontWeight: FontWeight.bold,
              ),
              textAlign: TextAlign.center,
            ),
            const SizedBox(height: 32),
            
            // Phone Number Input
            TextField(
              controller: _phoneController,
              decoration: const InputDecoration(
                labelText: 'Phone Number',
                hintText: '[phone]',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.phone),
              ),
              keyboardType: TextInputType.phone,
            ),
            const SizedBox(height: 16),
            
            // Send OTP Button
            ElevatedButton.icon(
              onPressed: _isLoading ? null : _sendOTP,
              icon: const Icon(Icons.send),
              label: const Text('Send OTP'),
              style: ElevatedButton.styleFrom(
                padding: const EdgeInsets.symmetric(vertical: 16),
              ),
            ),
            const SizedBox(height: 32),
            
            // OTP Input
            TextField(
              controller: _otpController,
              decoration: const InputDecoration(
                labelText: 'OTP Code',
                hintText: '123456',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.lock),
              ),
              keyboardType: TextInputType.number,
              enabled: _verificationId != null,
            ),
            const SizedBox(height: 16),
            
            // Verify OTP Button
            ElevatedButton.icon(
              onPressed: (_isLoading || _verificationId == null) ? null : _verifyOTP,
              icon: const Icon(Icons.verified),
              label: const Text('Verify OTP'),
              style: ElevatedButton.styleFrom(
                padding: const EdgeInsets.symmetric(vertical: 16),
              ),
            ),
            const SizedBox(height: 32),
            
            // Loading Indicator
            if (_isLoading)
              const Center(
                child: CircularProgressIndicator(),
              ),
            
            // Message Display
            if (_message != null)
              Container(
                padding: const EdgeInsets.all(16),
                decoration: BoxDecoration(
                  color: _isSuccess ? Colors.green.shade50 : Colors.red.shade50,
                  border: Border.all(
                    color: _isSuccess ? Colors.green : Colors.red,
                  ),
                  borderRadius: BorderRadius.circular(8),
                ),
                child: Text(
                  _message!,
                  style: TextStyle(
                    color: _isSuccess ? Colors.green.shade800 : Colors.red.shade800,
                    fontWeight: FontWeight.w500,
                  ),
                  textAlign: TextAlign.center,
                ),
              ),
            
            const Spacer(),
            
            // Instructions
            Container(
              padding: const EdgeInsets.all(16),
              decoration: BoxDecoration(
                color: Colors.blue.shade50,
                borderRadius: BorderRadius.circular(8),
              ),
              child: const Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    'Instructions:',
                    style: TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 16,
                    ),
                  ),
                  SizedBox(height: 8),
                  Text('1. Enter your phone number with country code'),
                  Text('2. Tap "Send OTP" to receive a WhatsApp message'),
                  Text('3. Enter the 6-digit OTP code from WhatsApp'),
                  Text('4. Tap "Verify OTP" to complete verification'),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}