import 'package:flutter/material.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/models/enums/translation_keys.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';

import 'dashboard_page_indicator.dart';

class DashboardPage extends StatefulWidget {
  const DashboardPage({Key key}) : super(key: key);

  @override
  State<DashboardPage> createState() => _DashboardPageState();
}

class _DashboardPageState extends State<DashboardPage> {
  PageController _controller;
  int _currentPage = 1;

  @override
  void initState() {
    super.initState();
    _controller = PageController()
      ..addListener(() {
        _currentPage = _controller.page.toInt() + 1;
        setState(() {});
      });
  }

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

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          context.translation.welcome,
          style: Theme.of(context).textTheme.bodyMedium?.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20),
        ),
        Text(
          "Eng Mahmoud",
          style: Theme.of(context).textTheme.titleLarge?.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50, fontWeight: FontWeight.w600),
        ),
        24.height,
        Row(
          children: [
            DashboardPageIndicator(index: 0, currentPage: _currentPage, controller: _controller),
            3.width,
            DashboardPageIndicator(index: 1, currentPage: _currentPage, controller: _controller),
            3.width,
            DashboardPageIndicator(index: 2, currentPage: _currentPage, controller: _controller),
            10.width,
            Text(
              "0$_currentPage/03",
              style: Theme.of(context).textTheme.labelMedium?.copyWith(fontWeight: FontWeight.w500),
            ),
          ],
        ),
        8.height,
        Expanded(
          child: PageView(
            controller: _controller,
            children: const [
              Center(
                child: Text('First Page'),
              ),
              Center(
                child: Text('Second Page'),
              ),
              Center(
                child: Text('Third Page'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}