userjot_flutter

A Flutter package that ports the Swift UserJot SDK functionality for both Android and iOS. UserJot allows you to easily integrate feedback, roadmap, and changelog features into your Flutter applications.

Features

  • ✅ Feedback Collection - Show feedback modals with optional board support
  • ✅ Roadmap Display - Display your product roadmap
  • ✅ Changelog - Show product updates and changelog
  • ✅ User Identification - Identify users with optional metadata
  • ✅ Authentication - Secure token-based authentication
  • ✅ Custom URLs - Get URLs for custom WebView implementations
  • ✅ Presentation Styles - Support for sheet and mediumSheet presentation styles
  • ✅ Cross-platform - Works on both iOS and Android

Installation

Add userjot_flutter to your pubspec.yaml:

dependencies:
  userjot_flutter: ^0.0.1

Then run:

flutter pub get

Setup

iOS

Add the following to your ios/Podfile:

platform :ios, '12.0'

Android

Ensure your android/app/build.gradle has:

minSdkVersion 21

Usage

1. Initialize UserJot

First, setup UserJot with your project ID:

import 'package:userjot_flutter/userjot_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // Initialize UserJot with your project ID
  await UserJot.setup('your-project-id');
  
  runApp(MyApp());
}

2. Identify Users (Optional)

Identify users to personalize their experience:

UserJot.identify(
  userId: 'user123',
  email: 'user@example.com',
  firstName: 'John',
  lastName: 'Doe',
  avatar: 'https://example.com/avatar.jpg',
  signature: 'hmac-signature-from-server', // Optional, for secure authentication
);

3. Show Modals

Show Feedback

// Show default feedback board
UserJot.showFeedback(context);

// Show specific board
UserJot.showFeedback(
  context,
  board: 'feature-requests',
  presentationStyle: PresentationStyle.sheet,
);

Show Roadmap

UserJot.showRoadmap(
  context,
  presentationStyle: PresentationStyle.mediumSheet,
);

Show Changelog

UserJot.showChangelog(context);

4. Get URLs for Custom Implementation

If you want to use your own WebView implementation:

// Get feedback URL
final feedbackUrl = UserJot.feedbackURL(board: 'feature-requests');

// Get roadmap URL
final roadmapUrl = UserJot.roadmapURL();

// Get changelog URL
final changelogUrl = UserJot.changelogURL();

5. Logout

Clear the current user identification:

UserJot.logout();

Presentation Styles

The package supports two presentation styles:

  • PresentationStyle.sheet - Standard full-height sheet (default)
  • PresentationStyle.mediumSheet - Medium height sheet (60% of screen height)

Complete Example

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

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await UserJot.setup('your-project-id');
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('UserJot Example')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () {
                // Identify user
                UserJot.identify(
                  userId: 'user123',
                  email: 'user@example.com',
                );
              },
              child: Text('Identify User'),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                UserJot.showFeedback(context);
              },
              child: Text('Show Feedback'),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                UserJot.showRoadmap(context);
              },
              child: Text('Show Roadmap'),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                UserJot.showChangelog(context);
              },
              child: Text('Show Changelog'),
            ),
          ],
        ),
      ),
    );
  }
}

API Reference

UserJot Class

Static Methods

  • setup(String projectId) - Initialize UserJot with project ID
  • identify({required String userId, String? email, String? firstName, String? lastName, String? avatar, String? signature}) - Identify current user
  • logout() - Clear current user identification
  • showFeedback(BuildContext context, {String? board, PresentationStyle presentationStyle}) - Show feedback modal
  • showRoadmap(BuildContext context, {PresentationStyle presentationStyle}) - Show roadmap modal
  • showChangelog(BuildContext context, {PresentationStyle presentationStyle}) - Show changelog modal
  • feedbackURL({String? board}) - Get feedback URL
  • roadmapURL() - Get roadmap URL
  • changelogURL() - Get changelog URL

Models

User

class User {
  final String id;
  final String? email;
  final String? firstName;
  final String? lastName;
  final String? avatar;
  final String? signature;
}

PresentationStyle

enum PresentationStyle {
  sheet,        // Standard sheet
  mediumSheet,  // Medium height sheet
}

Requirements

  • Flutter SDK: >=3.2.0
  • Dart SDK: >=3.2.0 <4.0.0
  • iOS: 12.0+
  • Android: API 21+

Dependencies

  • webview_flutter - For WebView functionality
  • http - For API calls

Error Handling

The package handles errors gracefully:

  • If setup() hasn't been called, methods will show error dialogs
  • If metadata is still loading, appropriate messages are displayed
  • Network errors are caught and logged

License

See LICENSE file for details.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Support

For issues and feature requests, please use the GitHub issue tracker.

Note

For automatic sign-in to work, you need to have a paid plan of UserJot.

Libraries

userjot_flutter