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

class AppBreakpoints {
  AppBreakpoints._();

  static const double mobile = 0;
  static const double tablet = 600;
  static const double desktop = 1024;
  static const double wide = 1440;
}

extension ResponsiveContext on BuildContext {
  bool get isMobile => ResponsiveBreakpoints.of(this).isMobile;
  bool get isTablet => ResponsiveBreakpoints.of(this).isTablet;
  bool get isDesktop => ResponsiveBreakpoints.of(this).largerThan(TABLET);
  bool get isWide => ResponsiveBreakpoints.of(this).largerThan(DESKTOP);

  double get contentMaxWidth {
    if (isWide) return 1400;
    if (isDesktop) return 1200;
    return double.infinity;
  }

  /// Form grid columns: 4 on medium+, 2 on small screens.
  int get formGridColumns {
    final width = MediaQuery.sizeOf(this).width;
    return formGridColumnsForWidth(width);
  }
}

/// Responsive form field columns based on viewport width.
int formGridColumnsForWidth(
  double width, {
  int smallColumns = 2,
  int mediumColumns = 4,
  int largeColumns = 4,
  double mediumBreakpoint = AppBreakpoints.tablet,
  double largeBreakpoint = AppBreakpoints.desktop,
}) {
  if (width >= largeBreakpoint) return largeColumns;
  if (width >= mediumBreakpoint) return mediumColumns;
  return smallColumns;
}