Progress 1

2025-03-07 05:02:10 +07:00 · 2025-03-07 05:02:10 +07:00 · 7092f1c308
parent 35fbf04385
commit 7092f1c308
12 changed files with 399 additions and 82 deletions
--- a/.idea/other.xml
+++ b/.idea/other.xml
@ -14,6 +14,17 @@
          <option name="screenX" value="720" />
          <option name="screenY" value="1280" />
        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="34" />
+          <option name="brand" value="OnePlus" />
+          <option name="codename" value="OP5552L1" />
+          <option name="id" value="OP5552L1" />
+          <option name="manufacturer" value="OnePlus" />
+          <option name="name" value="CPH2415" />
+          <option name="screenDensity" value="480" />
+          <option name="screenX" value="1080" />
+          <option name="screenY" value="2412" />
+        </PersistentDeviceSelectionData>
        <PersistentDeviceSelectionData>
          <option name="api" value="34" />
          <option name="brand" value="OPPO" />
@ -102,6 +113,17 @@
          <option name="screenX" value="1080" />
          <option name="screenY" value="1272" />
        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="33" />
+          <option name="brand" value="motorola" />
+          <option name="codename" value="austin" />
+          <option name="id" value="austin" />
+          <option name="manufacturer" value="Motorola" />
+          <option name="name" value="moto g 5G (2022)" />
+          <option name="screenDensity" value="280" />
+          <option name="screenX" value="720" />
+          <option name="screenY" value="1600" />
+        </PersistentDeviceSelectionData>
        <PersistentDeviceSelectionData>
          <option name="api" value="33" />
          <option name="brand" value="samsung" />
@ -267,6 +289,17 @@
          <option name="screenX" value="1080" />
          <option name="screenY" value="2340" />
        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="34" />
+          <option name="brand" value="samsung" />
+          <option name="codename" value="gts7xllite" />
+          <option name="id" value="gts7xllite" />
+          <option name="manufacturer" value="Samsung" />
+          <option name="name" value="SM-T738U" />
+          <option name="screenDensity" value="340" />
+          <option name="screenX" value="1600" />
+          <option name="screenY" value="2560" />
+        </PersistentDeviceSelectionData>
        <PersistentDeviceSelectionData>
          <option name="api" value="33" />
          <option name="brand" value="samsung" />
@ -278,6 +311,28 @@
          <option name="screenX" value="1848" />
          <option name="screenY" value="2960" />
        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="34" />
+          <option name="brand" value="samsung" />
+          <option name="codename" value="gts8wifi" />
+          <option name="id" value="gts8wifi" />
+          <option name="manufacturer" value="Samsung" />
+          <option name="name" value="Galaxy Tab S8" />
+          <option name="screenDensity" value="274" />
+          <option name="screenX" value="1600" />
+          <option name="screenY" value="2560" />
+        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="34" />
+          <option name="brand" value="samsung" />
+          <option name="codename" value="gts9fe" />
+          <option name="id" value="gts9fe" />
+          <option name="manufacturer" value="Samsung" />
+          <option name="name" value="Galaxy Tab S9 FE 5G" />
+          <option name="screenDensity" value="280" />
+          <option name="screenX" value="1440" />
+          <option name="screenY" value="2304" />
+        </PersistentDeviceSelectionData>
        <PersistentDeviceSelectionData>
          <option name="api" value="34" />
          <option name="brand" value="google" />
@ -333,6 +388,17 @@
          <option name="screenX" value="720" />
          <option name="screenY" value="1600" />
        </PersistentDeviceSelectionData>
+        <PersistentDeviceSelectionData>
+          <option name="api" value="34" />
+          <option name="brand" value="samsung" />
+          <option name="codename" value="o1q" />
+          <option name="id" value="o1q" />
+          <option name="manufacturer" value="Samsung" />
+          <option name="name" value="Galaxy S21" />
+          <option name="screenDensity" value="421" />
+          <option name="screenX" value="1080" />
+          <option name="screenY" value="2400" />
+        </PersistentDeviceSelectionData>
        <PersistentDeviceSelectionData>
          <option name="api" value="31" />
          <option name="brand" value="google" />
--- a/.idea/vcs.xml
+++ b/.idea/vcs.xml
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
--- a/app/src/main/java/com/example/caloryapp/MainActivity.kt
+++ b/app/src/main/java/com/example/caloryapp/MainActivity.kt
@ -4,8 +4,15 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
-import com.example.caloryapp.pages.NavBarScreen
+import androidx.navigation.compose.rememberNavController
+import com.example.caloryapp.navigation.Navigation
+import com.example.caloryapp.pages.account.ProfileScreen
+import com.example.caloryapp.pages.dashboard.HomeScreen
+//import com.example.caloryapp.pages.NavBarScreen
+import com.example.caloryapp.pages.onboard.LoginScreen
+import com.example.caloryapp.pages.onboard.OnBoardingScreen
 import com.example.caloryapp.ui.theme.CaloryAppTheme
+import com.example.caloryapp.widget.MainScreen

 class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
@ -13,31 +20,10 @@ class MainActivity : ComponentActivity() {
        enableEdgeToEdge()
        setContent {
            CaloryAppTheme {
-                NavBarScreen()
-//                ChangePasswordScreen(navController = rememberNavController())
-//                Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
-//                    Greeting(
-//                        name = "Android",
-//                        modifier = Modifier.padding(innerPadding)
-//                    )
-//                }
+//                Navigation()
+//                ProfileScreen(navController = rememberNavController())
+                MainScreen()
            }
        }
    }
 }
-
-//@Composable
-//fun Greeting(name: String, modifier: Modifier = Modifier) {
-//    Text(
-//        text = "Hello $name!",
-//        modifier = modifier
-//    )
-//}
-//
-//@Preview(showBackground = true)
-//@Composable
-//fun GreetingPreview() {
-//    CaloryAppTheme {
-//        Greeting("Android")
-//    }
-//}
--- a/app/src/main/java/com/example/caloryapp/assets/model_food_plate_densenet.h5
+++ b/app/src/main/java/com/example/caloryapp/assets/model_food_plate_densenet.h5
--- a/app/src/main/java/com/example/caloryapp/assets/model_food_plate_densenet.tflite
+++ b/app/src/main/java/com/example/caloryapp/assets/model_food_plate_densenet.tflite
--- a/app/src/main/java/com/example/caloryapp/navigation/Navigation.kt
+++ b/app/src/main/java/com/example/caloryapp/navigation/Navigation.kt
@ -13,6 +13,7 @@ import com.example.caloryapp.pages.onboard.OTPVerificationScreen
 import com.example.caloryapp.pages.onboard.OnBoardingScreen
 import com.example.caloryapp.pages.onboard.SuccessChangePassword
 import com.example.caloryapp.pages.onboard.SuccessRegister
+import com.example.caloryapp.widget.MainScreen

@Composable
 fun Navigation(modifier: Modifier = Modifier) {
@ -31,6 +32,9 @@ fun Navigation(modifier: Modifier = Modifier) {
        composable(NavigationScreen.NavBarScreen.name) {
            NavBarScreen()
        }
+        composable(NavigationScreen.MainScreen.name) {
+            MainScreen()
+        }
        composable(NavigationScreen.ForgotPasswordScreen.name) {
            ForgotPasswordScreen(navController = navController)
        }
--- a/app/src/main/java/com/example/caloryapp/navigation/NavigationScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/navigation/NavigationScreen.kt
@ -5,6 +5,7 @@ enum class NavigationScreen {
    LoginScreen,
    NavBarScreen,
    HomeScreen,
+    MainScreen,
    ForgotPasswordScreen,
    ChangePasswordScreen,
    OTPVerificationScreen,
@ -17,6 +18,7 @@ enum class NavigationScreen {
            OnBoardingScreen.name -> OnBoardingScreen
            LoginScreen.name -> LoginScreen
            NavBarScreen.name -> NavBarScreen
+            MainScreen.name -> MainScreen
            HomeScreen.name -> HomeScreen
            ProfileScreen.name -> ProfileScreen
            ForgotPasswordScreen.name -> ForgotPasswordScreen
--- a/app/src/main/java/com/example/caloryapp/pages/NavBarScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/pages/NavBarScreen.kt
@ -64,15 +64,9 @@ fun NavBarScreen(modifier: Modifier = Modifier) {
                navController = navController,
                startDestination = BottomNavigationScreen.HomeScreen.title
            ) {
-                composable(BottomNavigationScreen.HomeScreen.title) {
-                    HomeScreen(navController = navController)
-                }
-                composable(BottomNavigationScreen.ProfileScreen.title) {
-                    ProfileScreen(navController = navController)
-                }
            }
        }
-    )
+                                                                                                                                                             )
 }

@Composable
--- a/app/src/main/java/com/example/caloryapp/pages/account/ProfileScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/pages/account/ProfileScreen.kt
@ -14,12 +14,15 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.material.Text
+import androidx.compose.material.Divider
+import androidx.compose.material3.DrawerState
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
@ -27,63 +30,98 @@ import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import androidx.core.os.unregisterForAllProfilingResults
 import androidx.navigation.NavController
 import com.example.caloryapp.R
 import com.example.caloryapp.ui.theme.background
 import com.example.caloryapp.ui.theme.bold
+import com.example.caloryapp.ui.theme.medium
+import com.example.caloryapp.ui.theme.primary
 import com.example.caloryapp.ui.theme.primaryblack
 import com.example.caloryapp.ui.theme.primarygrey
 import com.example.caloryapp.ui.theme.primaryred
+import com.example.caloryapp.ui.theme.regular
 import com.example.caloryapp.widget.SimpleAlertDialog
+import kotlinx.coroutines.launch
+import java.text.SimpleDateFormat
+import java.util.Calendar
+import java.util.Locale

@Composable
-fun ProfileScreen(modifier: Modifier = Modifier, navController: NavController) {
+fun ProfileScreen(
+    modifier: Modifier = Modifier,
+    navController: NavController,
+    drawerState: DrawerState,
+    scope: kotlinx.coroutines.CoroutineScope
+) {
    val openAlertDialog = remember { mutableStateOf(false) }
+    val currentDate = Calendar.getInstance().time
+    val dateFormat = SimpleDateFormat("EEEE, dd MMMM yyyy", Locale("id", "ID"))
+    val formattedDate = dateFormat.format(currentDate)

    Box(
        modifier
            .fillMaxSize()
            .background(background)
    ) {
-        Column(modifier.padding(horizontal = 25.dp, vertical = 40.dp)) {
+        Column(modifier.padding(horizontal = 25.dp, vertical = 45.dp)) {
            Spacer(modifier.height(50.dp))
-            androidx.compose.material.Text(
-                text = stringResource(R.string.akun),
-                style = TextStyle(
-                    fontSize = 35.sp,
-                    color = primaryblack,
-                    fontFamily = bold
-                )
-            )
-            Spacer(modifier.height(50.dp))
-            Row(Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
+            Row(Modifier.fillMaxWidth(), Arrangement.SpaceBetween,
+                verticalAlignment = Alignment.CenterVertically
+            ) {
                Image(
-                    painter = painterResource(id = R.drawable.ic_profile_men),
-                    contentDescription = null,
-                    modifier = Modifier.size(80.dp)
+                    modifier = Modifier.clickable { scope.launch { drawerState.open() } },
+                    painter = painterResource(id = R.drawable.ic_home_acc),
+                    contentDescription = null
                )
-                Spacer(modifier.width(20.dp))
-                Column {
-                    androidx.compose.material.Text(
-                        text = "Naufal Kadhafi",
-                        style = TextStyle(
-                            fontSize = 23.sp,
-                            color = primaryblack,
-                            fontFamily = bold
+                Row(verticalAlignment = Alignment.CenterVertically) {
+                    Column(horizontalAlignment = Alignment.End) {
+                        Text(
+                            text = "Naufal Kadhafi",
+                            style = TextStyle(
+                                fontSize = 20.sp,
+                                color = Color.Black,
+                                fontFamily = bold
+                            )
                        )
-                    )
-                    Spacer(modifier = Modifier.height(5.dp))
-                    androidx.compose.material.Text(
-                        text = "kadhafinaufal2@gmail.com",
-                        style = TextStyle(
-                            fontSize = 15.sp,
-                            color = primarygrey,
-                            fontFamily = bold
+                        Text(
+                            text = "@kadhafiinl",
+                            style = TextStyle(
+                                fontSize = 14.sp,
+                                color = Color.Black,
+                                fontFamily = bold
+                            )
                        )
+                    }
+                    Spacer(modifier = Modifier.width(14.dp))
+                    Image(
+                        painter = painterResource(id = R.drawable.ic_profile_women),
+                        contentDescription = null,
+                        Modifier.size(45.dp)
                    )
                }
            }
-            Spacer(modifier.height(60.dp))
+
+            Spacer(modifier.height(40.dp))
+            Text(
+                text = "Hari Ini,",
+                style = TextStyle(
+                    fontSize = 38.sp,
+                    color = Color.Black,
+                    fontFamily = bold
+                )
+            )
+            Text(
+                text = formattedDate,
+                style = TextStyle(
+                    fontSize = 24.sp,
+                    color = Color.Black,
+                    fontFamily = medium
+                )
+            )
+            Spacer(modifier.height(10.dp))
+            Divider(color = primary.copy(alpha = 0.2f), thickness = 3.dp)
+            Spacer(modifier.height(20.dp))
            Row(Modifier.fillMaxWidth(), Arrangement.SpaceBetween) {
                Row {
                    Image(
--- a/app/src/main/java/com/example/caloryapp/pages/dashboard/HomeScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/pages/dashboard/HomeScreen.kt
@ -2,6 +2,7 @@ package com.example.caloryapp.pages.dashboard

 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@ -13,7 +14,7 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.material.Divider
+import androidx.compose.material3.DrawerState
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@ -22,6 +23,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
@ -35,57 +37,90 @@ import com.example.caloryapp.ui.theme.primary
 import com.example.caloryapp.ui.theme.primaryblack
 import com.example.caloryapp.ui.theme.primarygrey
 import com.example.caloryapp.widget.FilterBar
+import kotlinx.coroutines.launch

@Composable
-fun HomeScreen(modifier: Modifier = Modifier, navController: NavController) {
+fun HomeScreen(
+    navController: NavController,
+    drawerState: DrawerState,
+    scope: kotlinx.coroutines.CoroutineScope
+) {
    var selectedFilter by remember { mutableStateOf("Semua") }

    Box(
-        modifier
+        modifier = Modifier
            .fillMaxSize()
-            .background(background)) {
-        Column(modifier.padding(horizontal = 25.dp, vertical = 45.dp)) {
+            .background(background)
+    ) {
+        Column(modifier = Modifier.padding(horizontal = 25.dp, vertical = 45.dp)) {
            Spacer(modifier = Modifier.height(50.dp))
-            Row(Modifier.fillMaxWidth(), Arrangement.SpaceBetween,verticalAlignment = Alignment.CenterVertically) {
-                Image(painter = painterResource(id = R.drawable.ic_home_acc), contentDescription = null)
+
+            Row(
+                Modifier.fillMaxWidth(),
+                Arrangement.SpaceBetween,
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                Image(
+                    modifier = Modifier.clickable { scope.launch { drawerState.open() } },
+                    painter = painterResource(id = R.drawable.ic_home_acc),
+                    contentDescription = null
+                )
+
                Row(verticalAlignment = Alignment.CenterVertically) {
                    Column(horizontalAlignment = Alignment.End) {
-                        androidx.compose.material.Text(
+                        Text(
                            text = "Naufal Kadhafi",
                            style = TextStyle(
                                fontSize = 20.sp,
-                                color = primaryblack,
+                                color = Color.Black,
                                fontFamily = bold
                            )
                        )
-                        androidx.compose.material.Text(
+                        Text(
                            text = "@kadhafiinl",
                            style = TextStyle(
                                fontSize = 14.sp,
-                                color = primaryblack,
+                                color = Color.Black,
                                fontFamily = bold
                            )
                        )
                    }
                    Spacer(modifier = Modifier.width(14.dp))
-                    Image(painter = painterResource(id = R.drawable.ic_profile_women), contentDescription = null, Modifier.size(45.dp))
+                    Image(
+                        painter = painterResource(id = R.drawable.ic_profile_women),
+                        contentDescription = null,
+                        Modifier.size(45.dp)
+                    )
                }
            }
+
            Spacer(modifier = Modifier.height(35.dp))
+
+            // Teks sapaan
            Row(Modifier.width(215.dp)) {
                Text(
                    text = "Hai Naufal, Bagaimana kabar kamu hari ini?",
                    style = TextStyle(
                        fontSize = 22.sp,
-                        color = primaryblack,
+                        color = Color.Black,
                        fontFamily = bold
                    )
                )
            }
+
+//            Spacer(modifier = Modifier.height(15.dp))
+
+            // Tombol untuk membuka Navigation Drawer
+//            Button(onClick = {  }) {
+//                Text(text = "Buka Menu")
+//            }
+
            Spacer(modifier = Modifier.height(15.dp))
-            Divider(color = primary.copy(alpha = 0.2f), thickness = 3.dp)
+            androidx.compose.material3.Divider(color = primary.copy(alpha = 0.2f), thickness = 3.dp)
            Spacer(modifier = Modifier.height(15.dp))
-            FilterBar(selectedFilter = selectedFilter, onFilterSelected = { selectedFilter = it})
+
+            // Filter Bar
+            FilterBar(selectedFilter = selectedFilter, onFilterSelected = { selectedFilter = it })
        }
    }
 }
--- a/app/src/main/java/com/example/caloryapp/pages/onboard/LoginScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/pages/onboard/LoginScreen.kt
@ -118,7 +118,7 @@ fun LoginScreen(modifier: Modifier = Modifier, navController: NavController) {
            }
            Spacer(modifier.height(35.dp))
            Button(
-                onClick = { navController.navigate(NavigationScreen.NavBarScreen.name) },
+                onClick = { navController.navigate(NavigationScreen.MainScreen.name) },
                modifier
                    .width(360.dp)
                    .height(50.dp),
--- a/app/src/main/java/com/example/caloryapp/widget/MainScreen.kt
+++ b/app/src/main/java/com/example/caloryapp/widget/MainScreen.kt
@ -0,0 +1,186 @@
+package com.example.caloryapp.widget
+
+import android.annotation.SuppressLint
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.material3.Divider
+import androidx.compose.material3.DrawerState
+import androidx.compose.material3.DrawerValue
+import androidx.compose.material3.Icon
+import androidx.compose.material3.ModalDrawerSheet
+import androidx.compose.material3.ModalNavigationDrawer
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextButton
+import androidx.compose.material3.rememberDrawerState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.vectorResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.navigation.NavController
+import androidx.navigation.NavHostController
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import androidx.navigation.compose.rememberNavController
+import com.example.caloryapp.R
+import com.example.caloryapp.pages.account.ProfileScreen
+import com.example.caloryapp.pages.dashboard.HomeScreen
+import com.example.caloryapp.ui.theme.background
+import com.example.caloryapp.ui.theme.bold
+import com.example.caloryapp.ui.theme.medium
+import com.example.caloryapp.ui.theme.primary
+import com.example.caloryapp.ui.theme.semibold
+import kotlinx.coroutines.launch
+
+sealed class DrawerScreen(val title: String) {
+    data object HomeScreen : DrawerScreen("Home")
+    data object ProfileScreen : DrawerScreen("Akun")
+}
+
+@SuppressLint("UnusedMaterialScaffoldPaddingParameter", "UnusedMaterial3ScaffoldPaddingParameter")
+@Composable
+fun MainScreen() {
+    val navController = rememberNavController()
+    val drawerState = rememberDrawerState(DrawerValue.Closed)
+    val scope = rememberCoroutineScope()
+
+    ModalNavigationDrawer(
+        drawerState = drawerState,
+        drawerContent = {
+            DrawerContent(navController, drawerState, scope)
+        }
+    ) {
+        NavHost(navController = navController, startDestination = DrawerScreen.HomeScreen.title) {
+            composable(DrawerScreen.HomeScreen.title) {
+                HomeScreen(navController = navController, drawerState = drawerState, scope = scope)
+            }
+            composable(DrawerScreen.ProfileScreen.title) {
+                ProfileScreen(navController = navController, drawerState = drawerState, scope = scope)
+            }
+        }
+    }
+}
+
+@Composable
+fun DrawerContent(
+    navController: NavHostController,
+    drawerState: DrawerState,
+    scope: kotlinx.coroutines.CoroutineScope
+) {
+    ModalDrawerSheet(modifier = Modifier.background(primary)) {
+        Spacer(modifier = Modifier.height(30.dp))
+        Row(
+            modifier = Modifier.padding(horizontal = 15.dp),
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+            Row(verticalAlignment = Alignment.CenterVertically) {
+                Image(
+                    painter = painterResource(id = R.drawable.ic_profile_women),
+                    contentDescription = null,
+                    Modifier.size(70.dp)
+                )
+                Spacer(modifier = Modifier.width(12.dp))
+                Column(horizontalAlignment = Alignment.Start) {
+                    Text(
+                        text = "Naufal Kadhafi",
+                        style = TextStyle(
+                            fontSize = 20.sp,
+                            color = Color.Black,
+                            fontFamily = semibold
+                        )
+                    )
+                    Text(
+                        text = "@kadhafiinl",
+                        style = TextStyle(
+                            fontSize = 14.sp,
+                            color = Color.Black,
+                            fontFamily = medium
+                        )
+                    )
+                }
+
+            }
+        }
+        Spacer(modifier = Modifier.height(20.dp))
+        Divider(
+            modifier = Modifier.padding(horizontal = 12.dp),
+            color = primary.copy(alpha = 0.1f),
+            thickness = 3.dp
+        )
+        Spacer(modifier = Modifier.height(10.dp))
+        DrawerItem(
+            "Home",
+            R.drawable.ic_home_filled,
+            navController,
+            DrawerScreen.HomeScreen.title,
+            drawerState,
+            scope
+        )
+        DrawerItem(
+            "Akun",
+            R.drawable.ic_profile_filled,
+            navController,
+            DrawerScreen.ProfileScreen.title,
+            drawerState,
+            scope
+        )
+    }
+}
+
+@Composable
+fun DrawerItem(
+    title: String,
+    icon: Int,
+    navController: NavHostController,
+    route: String,
+    drawerState: DrawerState,
+    scope: kotlinx.coroutines.CoroutineScope
+) {
+    TextButton(onClick = {
+        if (navController.currentDestination?.route != route) {
+            navController.navigate(route) {
+                popUpTo(navController.graph.startDestinationId) { inclusive = false }
+            }
+        }
+        scope.launch { drawerState.close() }
+    }) {
+        Icon(
+            imageVector = ImageVector.vectorResource(id = icon),
+            contentDescription = null,
+            modifier = Modifier.size(30.dp),
+            tint = primary,
+        )
+        Text(
+            title,
+            modifier = Modifier.padding(16.dp),
+            color = primary,
+            fontSize = 18.sp,
+            fontFamily = bold,
+            letterSpacing = 0.5.sp
+        )
+    }
+}