add friend page and copy clipboard id ✨

Sources/justMUSIC/lib/components/music_list_component.dart

@@ -9,7 +9,7 @@ class MusicListComponent extends StatelessWidget {
   final bool playing;
   final int index;
   final Function(int) callback;
-  MusicListComponent({
+  const MusicListComponent({
     Key? key,
     required this.music,
     required this.playing,
@@ -23,8 +23,7 @@ class MusicListComponent extends StatelessWidget {
       padding: const EdgeInsets.only(bottom: 14),
       child: Row(
         children: [
-          LayoutBuilder(
+          LayoutBuilder(builder: (BuildContext context, BoxConstraints constraints) {
-              builder: (BuildContext context, BoxConstraints constraints) {
             if (music.cover != null) {
               return ClipRRect(
                 borderRadius: BorderRadius.all(Radius.circular(5)),
@@ -63,14 +62,11 @@ class MusicListComponent extends StatelessWidget {
                     Flexible(
                         flex: 8,
                         child: ScrollConfiguration(
-                          behavior:
+                          behavior: ScrollBehavior().copyWith(scrollbars: false),
-                              ScrollBehavior().copyWith(scrollbars: false),
                           child: TextScroll(
                             music.title ?? "Unknown",
                             style: GoogleFonts.plusJakartaSans(
-                                fontSize: 16,
+                                fontSize: 16, color: Colors.white, fontWeight: FontWeight.w700),
-                                color: Colors.white,
-                                fontWeight: FontWeight.w700),
                             mode: TextScrollMode.endless,
                             pauseBetween: Duration(milliseconds: 2500),
                             velocity: Velocity(pixelsPerSecond: Offset(30, 0)),
@@ -91,8 +87,7 @@ class MusicListComponent extends StatelessWidget {
                     child: Text(
                       music.artists.first.name ?? "Unknown",
                       overflow: TextOverflow.ellipsis,
-                      style: GoogleFonts.plusJakartaSans(
+                      style: GoogleFonts.plusJakartaSans(color: Colors.grey, fontWeight: FontWeight.w400),
-                          color: Colors.grey, fontWeight: FontWeight.w400),
                     ))
               ],
             ),

Sources/justMUSIC/lib/components/profile_component.dart

@@ -1,6 +1,7 @@
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:justmusic/components/statistics_component.dart';
@@ -28,14 +29,16 @@ class ProfileComponent extends StatelessWidget {
         SizedBox(
           height: 10,
         ),
-        AutoSizeText(
+        GestureDetector(
-          "@${user.pseudo}",
+          onLongPress: () async {
-          style: GoogleFonts.plusJakartaSans(
+            await Clipboard.setData(ClipboardData(text: user.pseudo));
-              fontSize: 15.sp,
+          },
-              color: Colors.white,
+          child: AutoSizeText(
-              fontWeight: FontWeight.w400),
+            "${user.pseudo}",
+            style: GoogleFonts.plusJakartaSans(fontSize: 15.sp, color: Colors.white, fontWeight: FontWeight.w400),
             maxFontSize: 30,
           ),
+        ),
         SizedBox(
           height: 20,
         ),

Sources/justMUSIC/lib/components/profile_list_component.dart

@@ -0,0 +1,102 @@
+import 'package:flutter/Material.dart';
+import 'package:google_fonts/google_fonts.dart';
+import '../model/User.dart';
+import '../values/constants.dart';
+
+class ProfileListComponent extends StatefulWidget {
+  final User user;
+  const ProfileListComponent({super.key, required this.user});
+
+  @override
+  State<ProfileListComponent> createState() => _ProfileListComponentState();
+}
+
+class _ProfileListComponentState extends State<ProfileListComponent> {
+  bool clicked = false;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: const EdgeInsets.only(bottom: 5),
+      child: Row(
+        children: [
+          ClipOval(
+              child: FadeInImage.assetNetwork(
+                  height: 50,
+                  width: 50,
+                  fit: BoxFit.cover,
+                  placeholder: "assets/images/loadingPlaceholder.gif",
+                  image: widget.user.pp)),
+          const SizedBox(
+            width: 10,
+          ),
+          Expanded(
+            flex: 10,
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                ScrollConfiguration(
+                  behavior: ScrollBehavior().copyWith(scrollbars: false),
+                  child: Text(
+                    widget.user.pseudo,
+                    style: GoogleFonts.plusJakartaSans(fontSize: 16, color: Colors.white, fontWeight: FontWeight.w700),
+                    overflow: TextOverflow.ellipsis,
+                    maxLines: 1,
+                  ),
+                ),
+                ScrollConfiguration(
+                    behavior: ScrollBehavior().copyWith(scrollbars: false),
+                    child: Text(
+                      widget.user.id,
+                      overflow: TextOverflow.ellipsis,
+                      style: GoogleFonts.plusJakartaSans(color: Colors.grey, fontWeight: FontWeight.w400),
+                    ))
+              ],
+            ),
+          ),
+          Spacer(),
+          clicked
+              ? Material(
+                  borderRadius: BorderRadius.all(Radius.circular(5)),
+                  color: selectedButton,
+                  child: InkWell(
+                      splashColor: Colors.white.withOpacity(0.3),
+                      onTap: () {
+                        setState(() {
+                          clicked = !clicked;
+                        });
+                      },
+                      child: Container(
+                        padding: EdgeInsets.fromLTRB(28, 7, 28, 7),
+                        decoration: BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(7))),
+                        child: Center(
+                          child: Text("Ajouté",
+                              style: GoogleFonts.plusJakartaSans(
+                                  color: Colors.white, fontWeight: FontWeight.w600, fontSize: 13)),
+                        ),
+                      )))
+              : Material(
+                  borderRadius: BorderRadius.all(Radius.circular(5)),
+                  color: primaryColor,
+                  child: InkWell(
+                      splashColor: Colors.white.withOpacity(0.3),
+                      onTap: () {
+                        setState(() {
+                          clicked = !clicked;
+                        });
+                      },
+                      child: Container(
+                        padding: EdgeInsets.fromLTRB(25, 7, 25, 7),
+                        decoration: BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(7))),
+                        child: Center(
+                          child: Text("Ajouter",
+                              style: GoogleFonts.plusJakartaSans(
+                                  color: Colors.white, fontWeight: FontWeight.w600, fontSize: 13)),
+                        ),
+                      ))),
+        ],
+      ),
+    );
+  }
+}

Sources/justMUSIC/lib/components/top_nav_bar_component.dart

@@ -11,15 +11,13 @@ import '../values/constants.dart';
 
 class TopNavBarComponent extends StatefulWidget {
   final Function(bool) callback;
-  const TopNavBarComponent({Key? key, required this.callback})
+  const TopNavBarComponent({Key? key, required this.callback}) : super(key: key);
-      : super(key: key);
 
   @override
   State<TopNavBarComponent> createState() => _TopNavBarComponentState();
 }
 
-class _TopNavBarComponentState extends State<TopNavBarComponent>
+class _TopNavBarComponentState extends State<TopNavBarComponent> with TickerProviderStateMixin {
-    with TickerProviderStateMixin {
   bool choice = true;
   late AnimationController _controller;
 
@@ -87,7 +85,7 @@ class _TopNavBarComponentState extends State<TopNavBarComponent>
               flex: 1,
               child: GestureDetector(
                 onTap: () {
-                  showCapsuleDot();
+                  Navigator.of(context).push(routeAddFriend());
                 },
                 child: const Icon(
                   Icons.person_add_alt_1_rounded,
@@ -105,6 +103,7 @@ class _TopNavBarComponentState extends State<TopNavBarComponent>
                       enableLongTapRepeatEvent: false,
                       longTapRepeatDuration: const Duration(milliseconds: 100),
                       begin: 1.0,
+                      onTap: showCapsuleDot,
                       end: 0.97,
                       beginDuration: const Duration(milliseconds: 70),
                       endDuration: const Duration(milliseconds: 100),
@@ -128,23 +127,18 @@ class _TopNavBarComponentState extends State<TopNavBarComponent>
                           }
                         },
                         child: LayoutBuilder(
-                          builder: (BuildContext context,
+                          builder: (BuildContext context, BoxConstraints constraints) {
-                              BoxConstraints constraints) {
                             if (choice) {
                               return AutoSizeText(
                                 "Mes amis",
                                 style: GoogleFonts.plusJakartaSans(
-                                    fontWeight: FontWeight.w500,
+                                    fontWeight: FontWeight.w500, fontSize: 16, color: Colors.white),
-                                    fontSize: 16,
-                                    color: Colors.white),
                               );
                             } else {
                               return AutoSizeText(
                                 "Mes amis",
                                 style: GoogleFonts.plusJakartaSans(
-                                    fontWeight: FontWeight.w300,
+                                    fontWeight: FontWeight.w300, fontSize: 16, color: unactiveFeed),
-                                    fontSize: 16,
-                                    color: unactiveFeed),
                               );
                             }
                           },
@@ -160,23 +154,18 @@ class _TopNavBarComponentState extends State<TopNavBarComponent>
                           }
                         },
                         child: LayoutBuilder(
-                          builder: (BuildContext context,
+                          builder: (BuildContext context, BoxConstraints constraints) {
-                              BoxConstraints constraints) {
                             if (choice) {
                               return AutoSizeText(
                                 "Discovery",
                                 style: GoogleFonts.plusJakartaSans(
-                                    fontWeight: FontWeight.w300,
+                                    fontWeight: FontWeight.w300, fontSize: 16, color: unactiveFeed),
-                                    fontSize: 16,
-                                    color: unactiveFeed),
                               );
                             } else {
                               return AutoSizeText(
                                 "Discovery",
                                 style: GoogleFonts.plusJakartaSans(
-                                    fontWeight: FontWeight.w500,
+                                    fontWeight: FontWeight.w500, fontSize: 16, color: Colors.white),
-                                    fontSize: 16,
-                                    color: Colors.white),
                               );
                             }
                           },
@@ -191,7 +180,7 @@ class _TopNavBarComponentState extends State<TopNavBarComponent>
               flex: 1,
               child: GestureDetector(
                 onTap: () {
-                  Navigator.of(context).push(createRoute());
+                  Navigator.of(context).push(routeProfile());
                 },
                 child: ClipOval(
                   child: SizedBox.fromSize(

Sources/justMUSIC/lib/config/routes.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/Material.dart';
+import 'package:justmusic/screens/add_friend_screen.dart';
 import 'package:justmusic/screens/profile_screen.dart';
 
-Route createRoute() {
+Route routeProfile() {
   return PageRouteBuilder(
-    pageBuilder: (context, animation, secondaryAnimation) =>
+    pageBuilder: (context, animation, secondaryAnimation) => const ProfileScreen(),
-        const ProfileScreen(),
     transitionsBuilder: (context, animation, secondaryAnimation, child) {
       const begin = Offset(1.0, 0.0);
       const end = Offset.zero;
@@ -19,3 +19,21 @@ Route createRoute() {
     },
   );
 }
+
+Route routeAddFriend() {
+  return PageRouteBuilder(
+    pageBuilder: (context, animation, secondaryAnimation) => const AddFriendScreen(),
+    transitionsBuilder: (context, animation, secondaryAnimation, child) {
+      const begin = Offset(-1.0, 0.0);
+      const end = Offset.zero;
+      const curve = Curves.ease;
+
+      var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve));
+
+      return SlideTransition(
+        position: animation.drive(tween),
+        child: child,
+      );
+    },
+  );
+}

Sources/justMUSIC/lib/main.dart

@@ -4,6 +4,7 @@ import 'package:firebase_core/firebase_core.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:justmusic/screens/add_friend_screen.dart';
 import 'package:justmusic/screens/explanations_screen.dart';
 import 'package:justmusic/screens/feed_screen.dart';
 import 'package:justmusic/screens/login_screen.dart';
@@ -44,13 +45,14 @@ class MyApp extends StatelessWidget {
       builder: (context, child) {
         return MaterialApp(
             routes: {
-              '/welcome': (context) => WellcomeScreen(),
+              '/welcome': (context) => const WellcomeScreen(),
-              '/feed': (context) => FeedScreen(),
+              '/feed': (context) => const FeedScreen(),
-              '/login': (context) => LoginScreen(),
+              '/login': (context) => const LoginScreen(),
-              '/register': (context) => RegistrationScreen(),
+              '/register': (context) => const RegistrationScreen(),
-              '/post': (context) => PostScreen(),
+              '/post': (context) => const PostScreen(),
-              '/profile': (context) => ProfileScreen(),
+              '/profile': (context) => const ProfileScreen(),
-              '/explanation': (context) => ExplanationsScreen(),
+              '/explanation': (context) => const ExplanationsScreen(),
+              '/addFriend': (context) => const AddFriendScreen(),
             },
             debugShowCheckedModeBanner: false,
             theme: ThemeData(

Sources/justMUSIC/lib/screens/add_friend_screen.dart

@@ -0,0 +1,234 @@
+import 'package:flutter/Material.dart';
+import 'package:flutter/services.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:justmusic/values/constants.dart';
+
+import '../components/profile_list_component.dart';
+import '../model/User.dart';
+
+class AddFriendScreen extends StatefulWidget {
+  const AddFriendScreen({super.key});
+
+  @override
+  State<AddFriendScreen> createState() => _AddFriendScreenState();
+}
+
+class _AddFriendScreenState extends State<AddFriendScreen> {
+  final ScrollController _scrollController = ScrollController();
+  final TextEditingController _textEditingController = TextEditingController();
+
+  List<User> fakeList = [
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2UYSIpWSnX4gJhZJzaN4q.jpg?alt=media&token=39baf86a-4d19-4534-b777-1a4feca67359",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+    User(
+        "&",
+        "_pseudo",
+        "_country",
+        "_mail",
+        "https://firebasestorage.googleapis.com/v0/b/justmusic-435d5.appspot.com/o/RUiGpZ8AzCQPqiVJKwuQeIqiC4B2bafPGRGLh2La72LkmQst.jpg?alt=media&token=ac1916f0-e08d-43bd-977a-2c2d94182609",
+        1,
+        12,
+        23, []),
+  ];
+
+  Future<void> resetFullScreen() async {
+    await SystemChannels.platform.invokeMethod<void>(
+      'SystemChrome.restoreSystemUIOverlays',
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+        appBar: PreferredSize(
+          preferredSize: Size(double.infinity, 58),
+          child: Container(
+            height: double.infinity,
+            color: bgAppBar,
+            child: Padding(
+              padding: const EdgeInsets.symmetric(horizontal: defaultPadding),
+              child: Stack(
+                alignment: Alignment.centerRight,
+                children: [
+                  Align(
+                    child: Text(
+                      "Ajouter des amis",
+                      style:
+                          GoogleFonts.plusJakartaSans(color: Colors.white, fontSize: 14, fontWeight: FontWeight.bold),
+                    ),
+                  ),
+                  GestureDetector(
+                      onTap: () {
+                        Navigator.pop(context);
+                      },
+                      child: Transform(
+                        alignment: Alignment.center,
+                        transform: Matrix4.rotationY(3.14159265),
+                        child: Container(
+                            height: 25,
+                            width: 25,
+                            child: const Icon(Icons.arrow_back_ios, color: Colors.white, size: 15)),
+                      )),
+                ],
+              ),
+            ),
+          ),
+        ),
+        body: Container(
+          color: bgColor,
+          child: Column(
+            children: [
+              Padding(
+                padding: const EdgeInsets.only(bottom: 20, left: 20, right: 20, top: 20),
+                child: SizedBox(
+                  height: 40,
+                  child: TextField(
+                    autofocus: false,
+                    controller: _textEditingController,
+                    keyboardAppearance: Brightness.dark,
+                    onEditingComplete: resetFullScreen,
+                    onSubmitted: (value) async {
+                      if (_textEditingController.text.isEmpty) {
+                        print("search");
+                      }
+                    },
+                    cursorColor: Colors.white,
+                    keyboardType: TextInputType.text,
+                    style: GoogleFonts.plusJakartaSans(color: grayText),
+                    decoration: InputDecoration(
+                        prefixIcon: const Icon(
+                          Icons.search,
+                          color: grayColor,
+                        ),
+                        focusedBorder: const OutlineInputBorder(
+                            borderSide: BorderSide(width: 1, color: grayColor),
+                            borderRadius: BorderRadius.all(Radius.circular(10))),
+                        contentPadding:
+                            const EdgeInsets.only(top: 0, bottom: 0, left: defaultPadding, right: defaultPadding),
+                        fillColor: searchBarColor,
+                        filled: true,
+                        focusColor: grayText,
+                        enabledBorder: const OutlineInputBorder(
+                            borderSide: BorderSide(width: 1, color: grayColor),
+                            borderRadius: BorderRadius.all(Radius.circular(10))),
+                        hintText: 'Chercher un ami',
+                        hintStyle: GoogleFonts.plusJakartaSans(color: grayHint)),
+                  ),
+                ),
+              ),
+              Flexible(
+                  child: ScrollConfiguration(
+                      behavior: const ScrollBehavior().copyWith(scrollbars: true),
+                      child: ListView.builder(
+                        physics: const BouncingScrollPhysics(decelerationRate: ScrollDecelerationRate.fast),
+                        itemCount: fakeList.length,
+                        itemBuilder: (BuildContext context, int index) {
+                          return InkWell(
+                            child: Padding(
+                                padding: EdgeInsets.fromLTRB(20, 0, 20, 20),
+                                child: ProfileListComponent(user: fakeList[index])),
+                          );
+                        },
+                      )))
+            ],
+          ),
+        ));
+  }
+}

Sources/justMUSIC/lib/screens/search_song_screen.dart

@@ -36,25 +36,20 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
   }
 
   Future<void> _scrollListener() async {
-    if (_scrollController.position.pixels ==
+    if (_scrollController.position.pixels == _scrollController.position.maxScrollExtent) {
-        _scrollController.position.maxScrollExtent) {
+      filteredData.addAll(await MyApp.musicViewModel
-      filteredData.addAll(await MyApp.musicViewModel.getMusicsWithName(
+          .getMusicsWithName(_textEditingController.text, limit: 10, offset: filteredData.length));
-          _textEditingController.text,
-          limit: 10,
-          offset: filteredData.length));
       setState(() {
         filteredData = filteredData;
       });
     }
-    if (_scrollController.offset >=
+    if (_scrollController.offset >= _scrollController.position.maxScrollExtent &&
-            _scrollController.position.maxScrollExtent &&
         !_scrollController.position.outOfRange) {
       setState(() {
         //you can do anything here
       });
     }
-    if (_scrollController.offset <=
+    if (_scrollController.offset <= _scrollController.position.minScrollExtent &&
-            _scrollController.position.minScrollExtent &&
         !_scrollController.position.outOfRange) {
       setState(() {
         Timer(Duration(milliseconds: 1), () => _scrollController.jumpTo(0));
@@ -109,15 +104,13 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                       width: 60,
                       height: 5,
                       decoration: BoxDecoration(
-                          color: Color(0xFF3A3A3A).withOpacity(0.6),
+                          color: Color(0xFF3A3A3A).withOpacity(0.6), borderRadius: BorderRadius.circular(20))),
-                          borderRadius: BorderRadius.circular(20))),
                 ),
                 const SizedBox(
                   height: 10,
                 ),
                 Padding(
-                  padding:
+                  padding: const EdgeInsets.only(bottom: 10, left: 20, right: 20),
-                      const EdgeInsets.only(bottom: 10, left: 20, right: 20),
                   child: SizedBox(
                     height: 40,
                     child: TextField(
@@ -130,8 +123,7 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                         } else if (value == " ") {
                           print("popular");
                         } else {
-                          filteredData = await MyApp.musicViewModel
+                          filteredData = await MyApp.musicViewModel.getMusicsWithName(value);
-                              .getMusicsWithName(value);
                           setState(() {
                             filteredData = filteredData;
                           });
@@ -146,26 +138,18 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                             color: grayColor,
                           ),
                           focusedBorder: const OutlineInputBorder(
-                              borderSide:
+                              borderSide: BorderSide(width: 1, color: grayColor),
-                                  BorderSide(width: 1, color: grayColor),
+                              borderRadius: BorderRadius.all(Radius.circular(10))),
-                              borderRadius:
+                          contentPadding:
-                                  BorderRadius.all(Radius.circular(10))),
+                              const EdgeInsets.only(top: 0, bottom: 0, left: defaultPadding, right: defaultPadding),
-                          contentPadding: const EdgeInsets.only(
-                              top: 0,
-                              bottom: 0,
-                              left: defaultPadding,
-                              right: defaultPadding),
                           fillColor: searchBarColor,
                           filled: true,
                           focusColor: grayText,
                           enabledBorder: const OutlineInputBorder(
-                              borderSide:
+                              borderSide: BorderSide(width: 1, color: grayColor),
-                                  BorderSide(width: 1, color: grayColor),
+                              borderRadius: BorderRadius.all(Radius.circular(10))),
-                              borderRadius:
-                                  BorderRadius.all(Radius.circular(10))),
                           hintText: 'Chercher un son',
-                          hintStyle:
+                          hintStyle: GoogleFonts.plusJakartaSans(color: grayHint)),
-                              GoogleFonts.plusJakartaSans(color: grayColor)),
                     ),
                   ),
                 ),
@@ -173,8 +157,7 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                     child: ScrollConfiguration(
                   behavior: ScrollBehavior().copyWith(scrollbars: true),
                   child: ListView.builder(
-                      physics: const BouncingScrollPhysics(
+                      physics: const BouncingScrollPhysics(decelerationRate: ScrollDecelerationRate.fast),
-                          decelerationRate: ScrollDecelerationRate.fast),
                       controller: _scrollController,
                       itemCount: filteredData.length,
                       itemBuilder: (context, index) {
@@ -184,8 +167,7 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                                 widget.callback(filteredData[index]);
                               },
                               child: Padding(
-                                padding:
+                                padding: const EdgeInsets.symmetric(horizontal: 20),
-                                    const EdgeInsets.symmetric(horizontal: 20),
                                 child: MusicListComponent(
                                   music: filteredData[index],
                                   playing: true,
@@ -199,8 +181,7 @@ class _SearchSongScreenState extends State<SearchSongScreen> {
                               widget.callback(filteredData[index]);
                             },
                             child: Padding(
-                              padding:
+                              padding: const EdgeInsets.symmetric(horizontal: 20),
-                                  const EdgeInsets.symmetric(horizontal: 20),
                               child: MusicListComponent(
                                 music: filteredData[index],
                                 playing: false,

Sources/justMUSIC/lib/values/constants.dart

@@ -18,10 +18,12 @@ const textFieldMessage = Color(0xFF232323);
 const bgComment = Color(0xFF222222);
 const bgAppBar = Color(0xFF181818);
 const grayText = Color(0xFF898989);
+const grayHint = Color(0xFF464646);
 const settingColor = Color(0xFF232323);
 const searchBarColor = Color(0xFF161616);
 const postbutton = Color(0xFF1B1B1B);
 const fillButton = Color(0xFF633AF4);
+const selectedButton = Color(0xFF1F1B2E);
 // All constants important too us
 
 const defaultPadding = 30.0;