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/network_image_widget.dart';
import 'package:tone_snap/generated/assets.dart';

import 'playlists_controller.dart';

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

  @override
  Widget build(BuildContext context) {
    Get.find<PlaylistsController>();

    return Column(
      children: [
        _buildAddPlaylists(),
        _buildListView(),
      ],
    );
  }

  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: () {},
              child: Padding(
                padding: const EdgeInsets.all(10).w,
                child: Image.asset(
                  Assets.sideBPlaylistsAdd,
                  width: 20.w,
                  height: 20.w,
                ),
              ),
            ),
          ),
        ),
        SizedBox(width: 6.w),
      ],
    );
  }

  Widget _buildListView() {
    return Expanded(
      child: BaseScrollbar(
        scrollController: controller.scrollController,
        child: ListView.builder(
          controller: controller.scrollController,
          itemCount: 10,
          itemBuilder: (context, index) {
            return _buildItem();
          },
        ),
      ),
    );
  }

  Widget _buildItem() {
    return InkWell(
      onTap: (){},
      child: Padding(
        padding: EdgeInsets.symmetric(vertical: 12.h, horizontal: 16.w),
        child: Row(
          children: [
            NetworkImageWidget(
              url: '',
              width: 60.w,
              height: 60.w,
              radius: 8.r,
            ),
            SizedBox(width: 14.w),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    'There For You',
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 16.sp,
                    ),
                  ),
                  SizedBox(height: 4.h),
                  Text(
                    '234 songs',
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      color: const Color(0xFF999999),
                      fontSize: 12.sp,
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
