add: choose 3 topics

lib/features/battle_league/first_part/presentation/controller/battle_league_controller.dart

@@ -29,6 +29,7 @@ class BattleLeagueController extends GetxController
   /// ----- Variables -----
   final BattleLeagueParams battleLeagueParams = BattleLeagueParams();
   final RxList<TopicsEntity> topicList = RxList.empty();
+  final RxList<TopicsEntity> chooseTopicList = RxList.empty();
 
   /// ------ Controllers ------
   final TextEditingController textEditingController = TextEditingController();
@@ -52,6 +53,22 @@ class BattleLeagueController extends GetxController
     Get.toNamed(Routes.battleLeagueFoundedPage);
   }
 
+  void chooseTopic(TopicsEntity topic) {
+    if (chooseTopicList.contains(topic)) {
+      chooseTopicList.remove(topic);
+    } else {
+      if (chooseTopicList.length < 3) {
+        chooseTopicList.add(topic);
+      }
+    }
+  }
+
+  void choosRandomTopic() {
+    final List<TopicsEntity> newTopicList = List.from(topicList);
+    newTopicList.shuffle();
+    chooseTopicList.value = newTopicList.take(3).toList();
+  }
+
   /// ------ Api Calls ------
   Future<void> getTopics() async {
     getTopicsStatus.value = const BaseLoading();

lib/features/battle_league/first_part/presentation/ui/battle_league_topic_page.dart

@@ -97,9 +97,12 @@ class BattleLeagueTopicPage extends GetView<BattleLeagueController> {
           alignment: WrapAlignment.center,
           children: List.generate(
             controller.topicList.length,
-            (index) => TopicWidget(
-              topic: controller.topicList[index],
-              onTap: () {},
+            (index) => Obx(
+              () => TopicWidget(
+                onPressed: controller.chooseTopic,
+                topic: controller.topicList[index],
+                selected: controller.chooseTopicList.contains(controller.topicList[index]),
+              ),
             ),
           ),
         ),
@@ -113,7 +116,7 @@ class BattleLeagueTopicPage extends GetView<BattleLeagueController> {
       child: BattleGreyButton(
         label: context.translate.random,
         image: MyAssets.iconRandom,
-        onTap: () {},
+        onTap: controller.choosRandomTopic,
       ),
     );
   }

lib/features/battle_league/first_part/presentation/ui/widgets/topic_page/topic_widget.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:shia_game_flutter/common_ui/resources/my_colors.dart';
 import 'package:shia_game_flutter/common_ui/resources/my_text_style.dart';
 import 'package:shia_game_flutter/core/utils/screen_size.dart';
 import 'package:shia_game_flutter/core/widgets/container/my_container.dart';
@@ -8,21 +9,25 @@ import 'package:shia_game_flutter/features/battle_league/first_part/domain/entit
 class TopicWidget extends StatelessWidget {
   const TopicWidget({
     super.key,
-    this.onTap,
     required this.topic,
+    this.onPressed,
+    this.selected = false,
   });
 
-  final VoidCallback? onTap;
+  final void Function(TopicsEntity topic)? onPressed;
   final TopicsEntity topic;
+  final bool selected;
 
   @override
   Widget build(BuildContext context) {
     return MyContainer(
-      onTap: onTap,
+      onTap: () {
+        onPressed?.call(topic);
+      },
       height: 48.h,
       width: 148.w,
       borderRadius: const BorderRadius.all(Radius.circular(12)),
-      borderGradient: LinearGradient(
+      borderGradient: !selected ? null : LinearGradient(
         begin: AlignmentDirectional.centerStart,
         end: AlignmentDirectional.centerEnd,
         colors: [
@@ -30,7 +35,7 @@ class TopicWidget extends StatelessWidget {
           const Color(0XFFAA76FF).withValues(alpha: 0),
         ],
       ),
-      gradient: const RadialGradient(
+      gradient: !selected ? null : const RadialGradient(
         center: Alignment.center,
         radius: 3,
         colors: [
@@ -38,6 +43,7 @@ class TopicWidget extends StatelessWidget {
           Color(0XFF792BF3),
         ],
       ),
+      color: selected ? null : MyColors.black.withValues(alpha: 0.2),
       boxShadow: [
         BoxShadow(
           offset: const Offset(0, 3.53),