import 'package:flutter/material.dart';
import 'package:grpc/grpc_web.dart';
import 'package:softplayer_web/api/grpc/creds.dart';
import 'package:softplayer_web/api/grpc/environments.dart';
import 'package:softplayer_web/components/environment_card.dart';

class EnvirnomentList extends StatefulWidget {
  const EnvirnomentList({
    super.key,
    required this.channel,
  });
  final GrpcWebClientChannel channel;
  @override
  State<StatefulWidget> createState() => _EnvirnomentListState();
}

class _EnvirnomentListState extends State<EnvirnomentList> {
  late EnvironmentsGrpc envGrpc;
  List<String> envs = [];
  @override
  void initState() {
    super.initState();
    envGrpc = EnvironmentsGrpc(widget.channel);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Container(
            width: double.infinity,
            height: double.infinity,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: AssetImage("assets/login_background.jpg"),
                fit: BoxFit.cover,
              ),
            ),
            child: StreamBuilder(
                stream:
                    envGrpc.list(SoftplayerCredsHelpers().fromLocalStorage()),
                builder: (context, snapshot) {
                  if (snapshot.connectionState == ConnectionState.waiting) {
                    return const CircularProgressIndicator();
                  } else if (snapshot.connectionState == ConnectionState.done) {
                    if (snapshot.hasError) {
                      return const Text('Error!');
                    } else {
                      if (snapshot.hasData) {
                        var data = snapshot.requireData;
                        if (data.isNotEmpty) {
                          return GridView.count(
                            crossAxisCount: 4,
                            children: snapshot.data!
                                .map((e) => EnvirnomentCard(
                                      env: e,
                                    ))
                                .toList(),
                          );
                        } else {
                          print("npo data");
                          return Center(
                              child: Container(
                            height: 300,
                            child: Text(
                                "To get strated, use the button in the corner"),
                            decoration: BoxDecoration(
                              border: Border.all(),
                              shape: BoxShape.rectangle,
                              borderRadius:
                                  BorderRadius.all(Radius.circular(10)),
                              color: Color.fromRGBO(100, 150, 80, 20),
                            ),
                          ));
                        }
                      }
                    }
                  }
                  return const Text("err");
                })));
  }
}