import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Open Events'),
        ),
        body: const OpenEventsList(),
      ),
    );
  }
}

// stores ExpansionPanel state information
class Item {
  Item({
    required this.expandedValue,
    required this.headerValue,
    required this.imgValue,
    this.isExpanded = false,
  });

  String expandedValue;
  String headerValue;
  String imgValue;
  bool isExpanded;
}

List<Item> generateItems(int numberOfItems) {
  return List<Item>.generate(numberOfItems, (int index) {
    return Item(
      headerValue: 'Panel $index',
      expandedValue: 'This is item number $index',
      imgValue: 'https://dev.yugam.in/media/RAM_tShb3p9.jpg',
    );
  });
}

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

  @override
  State<OpenEventsList> createState() => _OpenEventsListState();
}

class _OpenEventsListState extends State<OpenEventsList> {
//   final String jsonString = '''
//   [
//   {
//     "id": 1,
//     "is_open": false,
//     "title": "random event 1",
//     "appDescription": "Random description for event 1",
//     "image": "https://dev.yugam.in/media/RAM_tShb3p9.jpg"
//   },
//   {
//     "id": 2,
//     "is_open": true,
//     "title": "random event 2",
//     "appDescription": "Random description for event 2",
//     "image": "https://dev.yugam.in/media/RAM_tShb3p9.jpg"
//   },
//   {
//     "id": 3,
//     "is_open": false,
//     "title": "random event 3",
//     "appDescription": "Random description for event 3",
//     "image": "https://dev.yugam.in/media/RAM_tShb3p9.jpg"
//   },
//   {
//     "id": 4,
//     "is_open": true,
//     "title": "random event 4",
//     "appDescription": "Random description for event 4",
//     "image": "https://dev.yugam.in/media/RAM_tShb3p9.jpg"
//   },
//   {
//     "id": 5,
//     "is_open": false,
//     "title": "random event 5",
//     "appDescription": "Random description for event 5",
//     "image": "https://dev.yugam.in/media/RAM_tShb3p9.jpg"
//   }
// ]
//   ''';

  List<Item> _data = [];

  @override
  void initState() {
    super.initState();
    fetchData();

    // List<dynamic> list = jsonDecode(jsonString);
    // list = list.where((item) => item['is_open'] == true).toList();
    //
    // _data = list
    //     .map<Item>((json) => Item(
    //           expandedValue: json['appDescription'],
    //           headerValue: json['title'],
    //           imgValue: json['image'],
    //         ))
    //     .toList();

  }

  Future<void> fetchData() async {
    final response = await http.post(Uri.parse('http://10.1.75.71:8000/'));

    if (response.statusCode == 200) {

      List<dynamic> list = jsonDecode(response.body);
      list = list.where((item) => item['is_open'] == true).toList();

      _data = list.map<Item>((json) => Item(
        expandedValue: json['appDescription'],
        headerValue: json['title'],
        imgValue: json['image'],
      )).toList();

    } else {
      throw Exception('Failed to load data');
    }
  }

  @override
  Widget build(BuildContext context) {

    return SingleChildScrollView(
      child: Container(
        child: _buildPanel(),
      ),
    );
  }

  Widget _buildPanel() {
    return ExpansionPanelList(
      expansionCallback: (int index, bool isExpanded) {
        setState(() {
          _data[index].isExpanded = isExpanded;
        });
      },
      children: _data.map<ExpansionPanel>((Item item) {
        return ExpansionPanel(
          headerBuilder: (BuildContext context, bool isExpanded) {
            return Card(
              child: Column(
                children: <Widget>[
                  // Image.network(item.imgValue),
                  Column(
                    children: [
                      Image.network(item.imgValue),
                      Text(item.headerValue),
                    ],
                  ),
                ],
              ),
            );
          },
          body: Text(item.expandedValue),

          isExpanded: item.isExpanded,
        );
      }).toList(),
    );
  }
}

give react native equivalent code