tatlock-ui/lib/features/security/groups/groups_list_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:tatlock_ui/core/api/api_client.dart';
import 'package:tatlock_ui/shared/components/data_grid/adapters/core_api_source.dart';
import 'package:tatlock_ui/shared/components/data_grid/data_grid_exports.dart';

/// Simple group data class for display.
class GroupData {
  GroupData({
    required this.id,
    required this.name,
    required this.isSuperuser,
    required this.memberCount,
    this.parentName,
  });

  factory GroupData.fromJson(Map<String, dynamic> json) => GroupData(
        id: json['id'] as String,
        name: json['name'] as String,
        isSuperuser: json['is_superuser'] as bool? ?? false,
        memberCount: json['member_count'] as int? ?? 0,
        parentName: json['parent_name'] as String?,
      );

  final String id;
  final String name;
  final bool isSuperuser;
  final int memberCount;
  final String? parentName;
}

/// Groups list page using the shared DataGrid component.
class GroupsListPage extends ConsumerStatefulWidget {
  const GroupsListPage({super.key});

  @override
  ConsumerState<GroupsListPage> createState() => _GroupsListPageState();
}

class _GroupsListPageState extends ConsumerState<GroupsListPage> {
  late final StateNotifierProvider<DataGridController<GroupData>,
      DataGridState<GroupData>> _gridProvider;

  @override
  void initState() {
    super.initState();
    // Create provider in initState to ensure stable reference
    final dio = ref.read(coreApiClientProvider);
    final source = CoreApiDataSource<GroupData>(
      dio: dio,
      endpoint: '/auth/groups',
      fromJson: GroupData.fromJson,
    );

    _gridProvider = dataGridProvider<GroupData>(
      source: source,
      config: _buildConfig(),
      idSelector: (g) => g.id,
    );
  }

  DataGridConfig<GroupData> _buildConfig() {
    return DataGridConfig<GroupData>(
      columns: [
        DataGridColumn<GroupData>(
          header: 'Name',
          valueBuilder: (g) => g.name,
          sortable: true,
          searchable: true,
          width: const DataGridColumnWidth.flex(2),
        ),
        DataGridColumn<GroupData>(
          header: 'Members',
          valueBuilder: (g) => g.memberCount.toString(),
          width: const DataGridColumnWidth.fixed(100),
          alignment: DataGridColumnAlignment.end,
        ),
        DataGridColumn<GroupData>(
          header: 'Type',
          valueBuilder: (g) => g.isSuperuser ? 'Superuser' : 'Standard',
          cellBuilder: (context, g) => _GroupTypeBadge(isSuperuser: g.isSuperuser),
          width: const DataGridColumnWidth.fixed(120),
        ),
        DataGridColumn<GroupData>(
          header: 'Parent',
          valueBuilder: (g) => g.parentName ?? '-',
          width: const DataGridColumnWidth.flex(1),
        ),
      ],
      enableSearch: true,
      searchHint: 'Search groups...',
      showHeader: true,
      showFooter: true,
    );
  }

  @override
  Widget build(BuildContext context) {
    return DataGrid<GroupData>(
      provider: _gridProvider,
      config: _buildConfig(),
      idSelector: (g) => g.id,
      toolbarActions: [
        IconButton(
          icon: const Icon(Icons.refresh),
          tooltip: 'Refresh',
          onPressed: () => ref.read(_gridProvider.notifier).refresh(),
        ),
      ],
    );
  }
}

class _GroupTypeBadge extends StatelessWidget {
  const _GroupTypeBadge({required this.isSuperuser});

  final bool isSuperuser;

  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;

    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
      decoration: BoxDecoration(
        color: isSuperuser
            ? colorScheme.primaryContainer
            : colorScheme.surfaceContainerHighest,
        borderRadius: BorderRadius.circular(4),
      ),
      child: Text(
        isSuperuser ? 'Superuser' : 'Standard',
        style: TextStyle(
          fontSize: 12,
          fontWeight: FontWeight.w500,
          color: isSuperuser
              ? colorScheme.onPrimaryContainer
              : colorScheme.onSurfaceVariant,
        ),
      ),
    );
  }
}