whelp_flutter_sdk 0.3.1

Whelp Live Chat SDK for Flutter targeting Android and iOS platforms

example/lib/main.dart

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:whelp_flutter_sdk/whelp_flutter_sdk.dart';

const whelpColor = Color(0xff194856);

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorSchemeSeed: whelpColor,
        useMaterial3: true,
      ),
      home: const HomePage(),
    );
  }
}

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  late final TextEditingController _appIdController;
  late final TextEditingController _apiKeyController;
  late final TextEditingController _deviceIdController;
  late final TextEditingController _fullNameController;
  late final TextEditingController _phoneNumberController;
  late final TextEditingController _languageController;
  late final TextEditingController _emailController;
  IdentityIdentifier? _identifier;
  bool disableEmojiPicker = true;

  @override
  void initState() {
    super.initState();

    _appIdController = TextEditingController(
      // abb
      // text: '828317669d8ffba03df286a51f7866ee',
      // bob
      text: kDebugMode ? '5f2a63eb8f0eed4ff6c62751df5a4e91' : null,
    );
    _apiKeyController = TextEditingController(
      // abb
      // text: '347675776479e65f2db4c',
      // bob
      text: kDebugMode ? '202507009962bc2f997b39d' : null,
    );
    _deviceIdController = TextEditingController(
      text: '1234567890',
    );
    _fullNameController = TextEditingController(
      text: 'John Doe',
    );
    _phoneNumberController = TextEditingController(
      text: '[phone]',
    );
    _languageController = TextEditingController(
      text: 'EN',
    );
    _emailController = TextEditingController(
      text: '[e-mail]',
    );
    _identifier = IdentityIdentifier.email;
  }

  @override
  void dispose() {
    _appIdController.dispose();
    _apiKeyController.dispose();
    _deviceIdController.dispose();
    _fullNameController.dispose();
    _phoneNumberController.dispose();
    _languageController.dispose();
    _emailController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: whelpColor,
      appBar: AppBar(
        backgroundColor: whelpColor,
        centerTitle: true,
        title: Image.network(
          'https://whelp.co/blog/content/images/2023/01/Untitled-design-2-.png',
          height: 24.0,
        ),
      ),
      body: Container(
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(24.0),
            topRight: Radius.circular(24.0),
          ),
        ),
        child: SingleChildScrollView(
          padding: const EdgeInsets.symmetric(
            vertical: 24.0,
            horizontal: 16.0,
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _TextField(
                controller: _appIdController,
                labelText: 'App ID',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _apiKeyController,
                labelText: 'API Key',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _deviceIdController,
                labelText: 'Device ID',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _fullNameController,
                labelText: 'Full Name',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _languageController,
                labelText: 'Language',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _phoneNumberController,
                labelText: 'Phone Number',
              ),
              const SizedBox(height: 16.0),
              _TextField(
                controller: _emailController,
                labelText: 'Email',
              ),
              const SizedBox(height: 32.0),
              const Text('Identify with:'),
              RadioListTile(
                dense: true,
                contentPadding: EdgeInsets.zero,
                title: const Text(
                  'Email',
                  style: TextStyle(fontSize: 16.0),
                ),
                value: IdentityIdentifier.email,
                groupValue: _identifier,
                onChanged: (value) {
                  setState(() {
                    _identifier = value!;
                  });
                },
              ),
              RadioListTile(
                dense: true,
                contentPadding: EdgeInsets.zero,
                title: const Text(
                  'Phone',
                  style: TextStyle(fontSize: 16.0),
                ),
                value: IdentityIdentifier.phoneNumber,
                groupValue: _identifier,
                onChanged: (value) {
                  setState(() {
                    _identifier = value!;
                  });
                },
              ),
              const SizedBox(height: 16.0),
              SwitchListTile(
                dense: true,
                contentPadding: EdgeInsets.zero,
                title: const Text(
                  'Disable Emoji Picker',
                  style: TextStyle(fontSize: 16.0),
                ),
                value: disableEmojiPicker,
                onChanged: (value) {
                  setState(() {
                    disableEmojiPicker = value;
                  });
                },
              ),
              const SizedBox(height: 32.0),
              Center(
                child: FloatingActionButton.extended(
                  onPressed: () {
                    final config = WhelpConfig(
                      appId: _appIdController.text,
                      apiKey: _apiKeyController.text,
                      deviceId: _deviceIdController.text,
                      disableEmojiPicker: disableEmojiPicker,
                    );
                    final user = WhelpUser(
                      fullName: _fullNameController.text,
                      phoneNumber: _phoneNumberController.text,
                      language: _languageController.text,
                      email: _emailController.text,
                      identifier: _identifier!,
                    );

                    Navigator.of(context).push(
                      MaterialPageRoute(
                        builder: (_) {
                          return WhelpPage(
                            config: config,
                            user: user,
                          );
                        },
                      ),
                    );
                  },
                  label: const Text('Open Whelp'),
                  icon: const Icon(Icons.open_in_new),
                ),
              ),
              const SizedBox(height: 32.0),
            ],
          ),
        ),
      ),
    );
  }
}

class _TextField extends StatelessWidget {
  const _TextField({
    required this.controller,
    required this.labelText,
  });

  final TextEditingController controller;
  final String labelText;

  @override
  Widget build(BuildContext context) {
    return TextField(
      controller: controller,
      decoration: InputDecoration(
        filled: true,
        labelText: labelText,
        border: const UnderlineInputBorder(),
        floatingLabelBehavior: FloatingLabelBehavior.auto,
      ),
    );
  }
}

class WhelpPage extends StatelessWidget {
  const WhelpPage({
    super.key,
    required this.config,
    required this.user,
  });

  final WhelpConfig config;
  final WhelpUser user;

  @override
  Widget build(BuildContext context) {
    return WhelpScaffold(
      appBar: AppBar(
        centerTitle: false,
        title: const Text('Bizə yazın'),
      ),
      config: config,
      user: user,
    );
  }
}