fassad_ui 0.1.1

Flutter widgets and HTTP client for querying dblm fassad templates — render database results as charts and tables.

example/lib/main.dart

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

void main() => runApp(const ExampleApp());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Fassad UI Example',
      theme: ThemeData(colorSchemeSeed: Colors.indigo),
      home: const FassadDemoPage(),
    );
  }
}

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

  @override
  State<FassadDemoPage> createState() => _FassadDemoPageState();
}

class _FassadDemoPageState extends State<FassadDemoPage> {
  final _client = FassadClient(
    baseUrl: 'http://localhost:3000',
    apiKey: 'your-secret-api-key',
  );

  FassadResult? _result;
  bool _loading = false;
  String? _error;
  FassadChartType _chartType = FassadChartType.bar;

  Future<void> _runFassad() async {
    setState(() { _loading = true; _error = null; });
    try {
      final result = await _client.run('user-count');
      setState(() { _result = result; });
    } catch (e) {
      setState(() { _error = e.toString(); });
    } finally {
      setState(() { _loading = false; });
    }
  }

  @override
  void dispose() {
    _client.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Fassad UI Demo')),
      body: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                ElevatedButton(onPressed: _runFassad, child: const Text('Run user-count')),
                const SizedBox(width: 16),
                SegmentedButton<FassadChartType>(
                  segments: const [
                    ButtonSegment(value: FassadChartType.bar, label: Text('Bar')),
                    ButtonSegment(value: FassadChartType.line, label: Text('Line')),
                    ButtonSegment(value: FassadChartType.pie, label: Text('Pie')),
                  ],
                  selected: {_chartType},
                  onSelectionChanged: (s) => setState(() => _chartType = s.first),
                ),
              ],
            ),
            const SizedBox(height: 24),
            if (_loading) const CircularProgressIndicator(),
            if (_error != null) Text(_error!, style: const TextStyle(color: Colors.red)),
            if (_result != null) ...[
              Text('Source: ${_result!.source}', style: Theme.of(context).textTheme.labelSmall),
              const SizedBox(height: 12),
              FassadChart(
                result: _result!,
                xColumn: _result!.columns.first,
                yColumn: _result!.columns.last,
                type: _chartType,
              ),
              const SizedBox(height: 24),
              FassadTable(result: _result!),
            ],
          ],
        ),
      ),
    );
  }
}