Added new lesson

app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/LESSON_23.kt

@@ -16,45 +16,56 @@ import com.example.jetpack_compose_all_in_one.ui.theme.dp_15
 import com.example.jetpack_compose_all_in_one.utils.LogicPager
 import com.example.jetpack_compose_all_in_one.utils.PagedLessonHeader
 
+/**
+ * Composable function for Lesson 23.
+ * It displays the content of Lesson 23.
+ */
 @Composable
 @Preview(showBackground = true)
 fun Lesson_23() {
-    LessonContent()
+    LessonContent() // Calls the LessonContent composable function to display Lesson 23 content.
 }
 
+/**
+ * Composable function for the content of Lesson 23.
+ */
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 private fun LessonContent() {
+    // Remember the current page using mutable state
     val currentPage = rememberSaveable { mutableIntStateOf(0) }
 
+    // LogicPager composable for handling paging
     LogicPager(
         pageCount = 2,
         currentPage = currentPage
     ) {
         Column(
             Modifier
                 .fillMaxSize()
-                .padding(it)
+                .padding(it) // Apply padding to the column based on the pager state
         ) {
+            // Display the header for the paged lesson
             PagedLessonHeader(
                 modifier = Modifier
                     .fillMaxWidth()
-                    .padding(dp_15),
+                    .padding(dp_15), // Apply padding to the header
                 currentPage = currentPage.intValue,
-                headers = stringArrayResource(R.array.lesson_23_header_text).toList(),
+                headers = stringArrayResource(R.array.lesson_23_header_text).toList(), // Get headers from string resource
                 infoContent = listOf(
                     "1",
                     "2",
                     "3",
                     "4",
                     "https://www.google.com"
-                )
+                ) // Information content for the header
             )
 
+            // Based on the current page, display different tab screens
             when (currentPage.intValue) {
-                0 -> TabScreen()
-                1 -> TabScreen()
+                0 -> TabScreen() // Display TabScreen for page 0
+                1 -> TabScreen() // Display TabScreen for page 1
             }
         }
     }
-}
+}

app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/TabScreen.kt

@@ -25,68 +25,83 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 
+/**
+ * Composable function representing a screen with tabs.
+ */
 @ExperimentalMaterial3Api
 @Composable
 fun TabScreen() {
+    // State to track the index of the selected tab
     var selectedTabIndex by remember { mutableStateOf(0) }
 
+    // Scaffold composable for layout structure
     Scaffold(
         topBar = {
             TopAppBar(
-                title = { Text("Tab Demo") }
+                title = { Text("Tab Demo") } // Title for the top app bar
             )
         },
         content = { padding ->
             Column(
                 modifier = Modifier
                     .fillMaxSize()
-                    .padding(padding),
+                    .padding(padding), // Apply padding to the column content
                 horizontalAlignment = Alignment.CenterHorizontally,
                 verticalArrangement = Arrangement.Center
             ) {
+                // Display tabs with titles
                 Tabs(
-                    titles = listOf("Tab 1", "Tab 2", "Tab 3"),
-                    selectedTabIndex = selectedTabIndex,
+                    titles = listOf("Tab 1", "Tab 2", "Tab 3"), // Titles for the tabs
+                    selectedTabIndex = selectedTabIndex, // Currently selected tab index
                     onTabSelected = { index ->
-                        selectedTabIndex = index
+                        selectedTabIndex = index // Update the selected tab index
                     }
                 )
-                Spacer(modifier = Modifier.height(16.dp))
-                Text(text = "Content for Tab ${selectedTabIndex + 1}")
+                Spacer(modifier = Modifier.height(16.dp)) // Spacer for content separation
+                Text(text = "Content for Tab ${selectedTabIndex + 1}") // Content based on the selected tab
             }
         }
     )
 }
 
+/**
+ * Composable function for rendering tabs.
+ */
 @Composable
 fun Tabs(
-    titles: List<String>,
-    selectedTabIndex: Int,
-    onTabSelected: (Int) -> Unit
+    titles: List<String>, // List of titles for the tabs
+    selectedTabIndex: Int, // Index of the currently selected tab
+    onTabSelected: (Int) -> Unit // Callback for tab selection
 ) {
     TabRow(
-        selectedTabIndex = selectedTabIndex,
+        selectedTabIndex = selectedTabIndex, // Index of the currently selected tab
         indicator = { tabPositions ->
+            // Customizing tab indicator position
             TabRowDefaults.Indicator(
-                modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTabIndex]),
-                color = Color.Black
+                modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTabIndex]), // Offset based on selected tab position
+                color = Color.Black // Color of the indicator
             )
         }
     ) {
+        // Iterate over titles to create individual tabs
         titles.forEachIndexed { index, title ->
             Tab(
-                text = { Text(title) },
-                selected = selectedTabIndex == index,
-                onClick = { onTabSelected(index) }
+                text = { Text(title) }, // Text for the tab
+                selected = selectedTabIndex == index, // Check if the tab is currently selected
+                onClick = { onTabSelected(index) } // Callback when the tab is clicked
             )
         }
     }
 }
 
+/**
+ * Preview function for TabScreen composable.
+ */
 @Preview(showBackground = true)
 @Composable
 @ExperimentalMaterial3Api
 fun DefaultPreview() {
-    TabScreen()
+    TabScreen() // Displaying a preview of the TabScreen composable
 }
 
+

app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavConstants.kt

@@ -152,8 +152,8 @@ object NavConstants {
     const val LESSON_22 = "LESSON_22"
     const val LESSON_22_ABOUT = "Lesson 22: Media3 ExoPlayer"
 
-    const val LESSON_23 = "LESSON_22"
-    const val LESSON_23_ABOUT = "Lesson 22: Media3 ExoPlayer"
+    const val LESSON_23 = "LESSON_23"
+    const val LESSON_23_ABOUT = "Lesson 23: Tabs"
 
     const val QUOTE_2 = "quote2"
     const val QUOTE_2_ABOUT = "Swipe Quotes"

app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavDes.kt

@@ -542,7 +542,8 @@ sealed class NavDes(val data: INavigationDrawerItem, val customAppBarStringId: I
                 Lesson19,
                 Lesson20,
                 Lesson21,
-                Lesson22
+                Lesson22,
+                Lesson23
             ), LESSONS
         )
     )