ispect 1.0.2 copy "ispect: ^1.0.2" to clipboard
ispect: ^1.0.2 copied to clipboard

Wrapper around Inspector, Talker and etc.

Wrapper around Inspector, Talker and etc 🚀

This package was not created as something unique, it is a set of good tools from the expanse of pub.dev and my kind of implementation of all this for future projects, I decided to share it, maybe it will be useful to someone. I will improve, add along with the growth of the main packages used, and maybe add new functions. 😊
Show some ❤️ and star the repo to support the project!

Pub License: MIT Repository views Pub

Pub likes Pub popularity Pub points


📌 Features #

  • ✅ Draggable button for route to ISpect page
  • ✅ Localizations: ru, en. (I will add more translations in the future.)
  • ✅ Talker logger implementation
  • ✅ Feedback
  • ✅ Inspector
  • ✅ Debug tools
  • ✅ Cache manager
  • ✅ Device and app info

📌 Getting Started #

Follow these steps to use this package

Add dependency #

dependencies:
  ispect: ^1.0.2

Add import package #

import 'package:ispect/ispect.dart';
import 'package:talker_flutter/talker_flutter.dart';

Easy to use #

Simple example of use ISpect
Put this code in your project at an screen and learn how it works 😊

ISpect's example

Code: #

Note: For handle Dio: see
The simplest realization:

import 'package:flutter/material.dart';
import 'package:ispect/ispect.dart';
import 'package:ispect_example/src/core/localization/generated/l10n.dart';
import 'package:talker_flutter/talker_flutter.dart';

GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

void main() {
  final talker = TalkerFlutter.init();
  talker.debug('Hello World!');
  talkerWrapper.initHandling(talker: talker);
  runApp(App(talker: talker));
}

class App extends StatefulWidget {
  final Talker talker;
  const App({super.key, required this.talker});

  @override
  State<App> createState() => _AppState();
}

class _AppState extends State<App> {
  final ISpectController controller = ISpectController();

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

  @override
  Widget build(BuildContext context) {
    final ISpectOptions options = ISpectOptions(
      talker: widget.talker,
      themeMode: ThemeMode.dark,
      lightTheme: ThemeData.light(),
      darkTheme: ThemeData.from(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.blue,
          brightness: Brightness.dark,
        ),
      ),
      locale: const Locale('en'),
      controller: controller,
    );

    return MaterialApp(
      navigatorKey: navigatorKey,
      navigatorObservers: [
        TalkerRouteObserver(widget.talker),
      ],
      localizationsDelegates: ISpectLocalizations.localizationDelegates([AppGeneratedLocalization.delegate]),
      theme: ThemeData.light(),
      darkTheme: options.darkTheme,
      themeMode: ThemeMode.dark,
      builder: (context, child) {
        child = ISpectWrapper(
          navigatorKey: navigatorKey,
          options: options,
          isPanelVisible: true,
          child: child,
        );

        return child;
      },
      home: const _Home(),
    );
  }
}

class _Home extends StatelessWidget {
  const _Home();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(AppGeneratedLocalization.of(context).app_title),
      ),
    );
  }
}

For handle routing (GoRouter) #

You can use NavigatorObserver, but in practice it does not always work correctly.
Alternatively, you can use a listener:

    _router.routerDelegate.addListener(() {
      final String location =
          _router.routerDelegate.currentConfiguration.last.matchedLocation;
      talkerWrapper.route(location);
    });

For handle providers (Riverpod) #

You can use ProviderObserver:

class ProviderLoggerObserver extends ProviderObserver {
  @override
  void didAddProvider(
    ProviderBase<Object?> provider,
    Object? value,
    ProviderContainer container,
  ) {
    talkerWrapper.provider(
      message: 'Provider ${provider.name} was initialized with $value',
    );
  }

  @override
  void didDisposeProvider(
    ProviderBase<Object?> provider,
    ProviderContainer container,
  ) {
    talkerWrapper.provider(
      message: 'Provider ${provider.name} was disposed',
    );
  }

  @override
  void didUpdateProvider(
    ProviderBase<Object?> provider,
    Object? previousValue,
    Object? newValue,
    ProviderContainer container,
  ) {
    talkerWrapper.provider(
      message:
          'Provider ${provider.name} was updated from $previousValue to $newValue',
    );
  }

  @override
  void providerDidFail(
    ProviderBase<Object?> provider,
    Object error,
    StackTrace stackTrace,
    ProviderContainer container,
  ) {
    talkerWrapper.handle(
      exception: error,
      stackTrace: stackTrace,
      message: 'Provider ${provider.name} failed with error $error',
    );
  }
}

Thanks to all contributors of this package