Snippet created via Next.js API

main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'EdTech App',
      theme: ThemeData(
        primaryColor: const Color(0xFF7FD4D2),
        scaffoldBackgroundColor: Colors.white,
      ),
      home: const MyHomePage(),
    );
  }
}

class Subject {
  final String name;
  final String videoCount;
  final String imageUrl;

  Subject({
    required this.name,
    required this.videoCount, 
    required this.imageUrl,
  });
}

class Question {
  final String question;
  final List<String> options;
  final int correctAnswer;

  Question({
    required this.question,
    required this.options,
    required this.correctAnswer,
  });
}

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

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final List<Subject> allSubjects = [
    Subject(
      name: 'Rapid Revision',
      videoCount: '0/18 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Medical Surgical Nursing',
      videoCount: '0/0 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Fundamental of Nursing',
      videoCount: '0/32 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Paediatric Nursing',
      videoCount: '0/0 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Obstetrics and Midwifery Nursing',
      videoCount: '0/12 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Mental Health Nursing',
      videoCount: '0/0 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
    Subject(
      name: 'Pharmacology',
      videoCount: '0/0 Videos',
      imageUrl: 'https://placehold.co/100x100.png',
    ),
  ];

  List<Subject> subjects = [];
  bool isSearching = false;
  String searchQuery = '';
  bool showQuestion = false;
  Question? currentQuestion;

  @override
  void initState() {
    super.initState();
    subjects = allSubjects;
    currentQuestion = Question(
      question: "What is the primary function of the respiratory system?",
      options: [
        "Gas exchange",
        "Digestion",
        "Blood circulation",
        "Hormone production"
      ],
      correctAnswer: 0,
    );
  }

  void filterSubjects(String query) {
    setState(() {
      searchQuery = query;
      if (query.isEmpty) {
        subjects = allSubjects;
      } else {
        subjects = allSubjects
            .where((subject) =>
                subject.name.toLowerCase().contains(query.toLowerCase()))
            .toList();
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: showQuestion ? buildQuestionScreen() : buildSubjectScreen(),
      ),
    );
  }

  Widget buildSubjectScreen() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          padding: const EdgeInsets.all(20),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              if (!isSearching)
                const Text(
                  'Video',
                  style: TextStyle(
                    fontSize: 24,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              if (isSearching)
                Expanded(
                  child: TextField(
                    autofocus: true,
                    decoration: const InputDecoration(
                      hintText: 'Search subjects...',
                      border: InputBorder.none,
                    ),
                    onChanged: filterSubjects,
                  ),
                ),
              IconButton(
                icon: Icon(isSearching ? Icons.close : Icons.search),
                onPressed: () {
                  setState(() {
                    if (isSearching) {
                      isSearching = false;
                      searchQuery = '';
                      subjects = allSubjects;
                    } else {
                      isSearching = true;
                    }
                  });
                },
              ),
            ],
          ),
        ),
        if (!isSearching) ...[
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 16.0),
            child: Row(
              children: [
                Expanded(
                  child: Card(
                    child: Padding(
                      padding: const EdgeInsets.all(16.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          const Icon(Icons.video_library),
                          const SizedBox(height: 8),
                          const Text('Saved'),
                          Text('0/10 Videos',
                              style: TextStyle(color: Colors.grey[600])),
                        ],
                      ),
                    ),
                  ),
                ),
                const SizedBox(width: 16),
                Expanded(
                  child: Card(
                    child: Padding(
                      padding: const EdgeInsets.all(16.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          const Icon(Icons.play_circle_outline),
                          const SizedBox(height: 8),
                          const Text('Sample Videos'),
                          Text('Explore',
                              style: TextStyle(color: Colors.grey[600])),
                        ],
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          const Padding(
            padding: EdgeInsets.all(16.0),
            child: Text(
              'SUBJECTS',
              style: TextStyle(
                fontSize: 16,
                fontWeight: FontWeight.bold,
                color: Colors.grey,
              ),
            ),
          ),
        ],
        Expanded(
          child: ListView.builder(
            padding: const EdgeInsets.symmetric(horizontal: 16.0),
            itemCount: subjects.length,
            itemBuilder: (context, index) {
              return Card(
                margin: const EdgeInsets.only(bottom: 8.0),
                child: ListTile(
                  leading: CircleAvatar(
                    backgroundImage: NetworkImage(subjects[index].imageUrl),
                  ),
                  title: Text(subjects[index].name),
                  subtitle: Text(subjects[index].videoCount),
                  trailing: const Icon(Icons.chevron_right),
                  onTap: () {
                    setState(() {
                      showQuestion = true;
                    });
                  },
                ),
              );
            },
          ),
        ),
      ],
    );
  }

  Widget buildQuestionScreen() {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              IconButton(
                icon: const Icon(Icons.arrow_back),
                onPressed: () {
                  setState(() {
                    showQuestion = false;
                  });
                },
              ),
              const Text(
                'Test Question',
                style: TextStyle(
                  fontSize: 24,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ],
          ),
          const SizedBox(height: 24),
          Text(
            currentQuestion?.question ?? '',
            style: const TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.w500,
            ),
          ),
          const SizedBox(height: 24),
          ...List.generate(
            currentQuestion?.options.length ?? 0,
            (index) => Padding(
              padding: const EdgeInsets.only(bottom: 16.0),
              child: ElevatedButton(
                style: ElevatedButton.styleFrom(
                  primary: Colors.white,
                  onPrimary: Colors.black,
                  padding: const EdgeInsets.all(16),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8),
                    side: BorderSide(color: Colors.grey[300]!),
                  ),
                ),
                onPressed: () {
                  // Handle answer selection
                },
                child: Align(
                  alignment: Alignment.centerLeft,
                  child: Text(currentQuestion?.options[index] ?? ''),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}