import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tone_snap/components/base_scrollbar.dart';
import 'package:tone_snap/components/view_state_widget.dart';
import 'package:tone_snap/generated/assets.dart';
import 'package:tone_snap/modules/sideb/widgets/playlist_item.dart';
import 'package:tone_snap/modules/sideb/widgets/remove_padding_music_bar.dart';

import 'playlists_controller.dart';

class PlaylistsView extends GetView<PlaylistsController> {
  const PlaylistsView({super.key});

  @override
  Widget build(BuildContext context) {
    Get.put(PlaylistsController());

    return Column(
      children: [
        _buildAddPlaylists(),
        _buildList(),
        const RemovePaddingMusicBar(),
      ],
    );
  }

  Widget _buildAddPlaylists() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        SizedBox(width: 16.w),
        Expanded(
          child: Text(
            'Playlists',
            style: TextStyle(
              color: const Color(0xFF999999),
              fontSize: 14.sp,
            ),
          ),
        ),
        ClipOval(
          child: Material(
            color: Colors.transparent,
            child: InkWell(
              onTap: controller.createPlayList,
              child: Padding(
                padding: const EdgeInsets.all(6).w,
                child: Image.asset(
                  Assets.sideBPlaylistsAdd,
                  width: 20.w,
                  height: 20.w,
                ),
              ),
            ),
          ),
        ),
        SizedBox(width: 10.w),
      ],
    );
  }

  Widget _buildList() {
    return Expanded(
      child: Obx(() {
        return ViewStateWidget(
          viewState: controller.viewState.value,
          child: BaseScrollbar(
            scrollController: controller.scrollController,
            child: Obx(() {
              return ListView.builder(
                controller: controller.scrollController,
                itemCount: controller.playLists.length,
                itemBuilder: (context, index) {
                  return PlaylistItem(
                    index: 0,
                    playlistModel: controller.playLists[index],
                  );
                },
              );
            }),
          ),
        );
      }),
    );
  }
}
