import 'package:flutter/material.dart';
import 'package:inventory_monitor_app/providers/device_provider.dart';
import 'package:inventory_monitor_app/screens/dashboard_screen.dart';
import 'package:inventory_monitor_app/screens/device_detail_screen.dart';
import 'package:inventory_monitor_app/screens/device_list_screen.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_) => DeviceProvider()),
      ],
      child: MaterialApp(
        title: 'Inventory Monitor',
        theme: ThemeData(
          colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
          useMaterial3: true,
          cardTheme: CardTheme(
            elevation: 2,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(12),
            ),
          ),
        ),
        initialRoute: '/',
        routes: {
          '/': (context) => const MainLayout(),
          '/device': (context) {
            final deviceId = ModalRoute.of(context)!.settings.arguments as int;
            return DeviceDetailScreen(deviceId: deviceId);
          },
        },
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Inventory Dashboard & Devices'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: const Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(flex: 2, child: DashboardScreen()),
          VerticalDivider(width: 1),
          Expanded(flex: 3, child: DeviceListScreen()),
        ],
      ),
    );
  }
}