diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index ba19ba10127492669fc8817b6fa3d14341c0e90d..594316c9178f220b8fd1e5c9e71e1887c53c7fdc 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -21,6 +21,15 @@
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
         </activity>
+        <activity
+            android:name=".AddTransactionActivity"
+            android:exported="true" >
+            <intent-filter>
+                <action android:name="android.intent.action.VIEW" />
+                <category android:name="android.intent.category.DEFAULT" />
+            </intent-filter>
+        </activity>
+
     </application>
 
 </manifest>
\ No newline at end of file
diff --git a/app/src/main/java/com/example/android_hit/AddTransactionActivity.kt b/app/src/main/java/com/example/android_hit/AddTransactionActivity.kt
index 8ce75feac8fda110480b681d22c58dd2726c5f9a..a3f10574d78ef9194b0083435c7e2e8ccfa70813 100644
--- a/app/src/main/java/com/example/android_hit/AddTransactionActivity.kt
+++ b/app/src/main/java/com/example/android_hit/AddTransactionActivity.kt
@@ -1,47 +1,127 @@
 package com.example.android_hit
 
+import android.app.Activity
+import android.content.Intent
 import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
 import android.widget.Button
 import android.widget.EditText
+import android.widget.RadioButton
 import android.widget.Toast
+import androidx.fragment.app.Fragment
+import com.example.android_hit.adapter.TransactionAdapter
+import com.example.android_hit.databinding.ActivityAddTransactionBinding
 import com.example.android_hit.room.TransactionDB
 import com.example.android_hit.room.TransactionEntity
+import java.text.SimpleDateFormat
+import java.util.Date
+import java.util.Locale
 
 class AddTransactionActivity : AppCompatActivity() {
-    private lateinit var title: EditText
-    private lateinit var amount: EditText
-    private lateinit var category: EditText
-    private lateinit var location: EditText
-    private lateinit var date: EditText
-    private lateinit var btn_save: Button
+    private lateinit var binding: ActivityAddTransactionBinding
     private lateinit var database: TransactionDB
+    private lateinit var category: String
+
+
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        setContentView(R.layout.activity_add_transaction)
-        title = findViewById(R.id.et_title)
-        amount = findViewById(R.id.et_amount)
-        category = findViewById(R.id.et_category)
-        location = findViewById(R.id.et_location)
-        date = findViewById(R.id.et_date)
-        btn_save = findViewById(R.id.btn_save)
+        binding = ActivityAddTransactionBinding.inflate(layoutInflater)
+        setContentView(binding.root)
+
+//        replaceFragment(HeaderDetailTransaction())
 
         database = TransactionDB.getInstance(applicationContext)
-        btn_save.setOnClickListener {
-            if (title.text.isNotEmpty() && amount.text.isNotEmpty() && category.text.isNotEmpty() && location.text.isNotEmpty() && date.text.isNotEmpty()) {
-                database.transactionDao.addTransaction(
-                    TransactionEntity(
-                        null,
-                        title.text.toString(),
-                        amount.text.toString().toInt(),
-                        category.text.toString(),
-                        location.text.toString(),
-                        date.text.toString()
-
-                    )
-                )
-                finish()
+
+        binding.radioExpense.setOnCheckedChangeListener { _, isChecked ->
+            if (isChecked) {
+                category = "Expense"
+            }
+        }
+
+        binding.radioIncome.setOnCheckedChangeListener { _, isChecked ->
+            if (isChecked) {
+                category = "Income"
+            }
+        }
+
+        var intent = intent.extras
+        if (intent != null) {
+            val id = intent.getInt("id", 0)
+            var transaction = database.transactionDao.getId(id)
+
+            binding.inputTitle.setText(transaction.title)
+            binding.inputAmount.setText(transaction.amount.toString())
+            if (transaction.category == "Expense") {
+                binding.radioExpense.isChecked = true
+            } else if (transaction.category == "Income") {
+                binding.radioIncome.isChecked = true
+            }
+            binding.inputLocation.setText(transaction.location)
+        }
+
+        binding.buttonSave.setOnClickListener {
+            val title = binding.inputTitle.text.toString()
+            val amount = binding.inputAmount.text.toString()
+            val location = binding.inputLocation.text.toString()
+
+            if (title.isNotEmpty() && amount.isNotEmpty() && location.isNotEmpty() && (binding.radioExpense.isChecked || binding.radioIncome.isChecked)) {
+                try {
+                    var timestamp: String? = null
+
+                    if (intent != null) {
+                        val id = intent.getInt("id", 0)
+
+                        val transaction = database.transactionDao.getId(id)
+                        timestamp = transaction?.timestamp
+                    }
+                    if (intent != null) {
+                        database.transactionDao.updateTransaction(
+                            TransactionEntity(
+                                intent.getInt("id", 0),
+                                title,
+                                amount.toInt(),
+                                category,
+                                location,
+                                timestamp.toString()
+                            )
+                        )
+                        setResult(Activity.RESULT_OK)
+                    } else {
+                        val amountValue = amount.toInt()
+
+                        val timestamp = System.currentTimeMillis()
+                        val sdf = SimpleDateFormat("dd-MM-yyyy HH:mm:ss", Locale.getDefault())
+                        val currentDateAndTime: String = sdf.format(Date(timestamp))
+
+                        database.transactionDao.addTransaction(
+                            TransactionEntity(
+                                null,
+                                title,
+                                amountValue,
+                                category,
+                                location,
+                                currentDateAndTime
+                            )
+                        )
+                    }
+                    finish()
+                } catch (e: NumberFormatException) {
+                    // Handle kesalahan jika nilai amount tidak valid
+                    Toast.makeText(
+                        applicationContext,
+                        "Invalid amount entered",
+                        Toast.LENGTH_SHORT
+                    ).show()
+                } catch (ex: Exception) {
+                    // Handle kesalahan lainnya
+                    Toast.makeText(
+                        applicationContext,
+                        "Error occurred: ${ex.message}",
+                        Toast.LENGTH_SHORT
+                    ).show()
+                }
             } else {
+                // Menampilkan pesan jika ada field yang kosong
                 Toast.makeText(
                     applicationContext,
                     "Please fill all the fields",
@@ -50,4 +130,10 @@ class AddTransactionActivity : AppCompatActivity() {
             }
         }
     }
-}
\ No newline at end of file
+    private fun replaceFragment(header: Fragment) {
+        val fragmentManager = supportFragmentManager
+        val fragmentTransaction = fragmentManager.beginTransaction()
+        fragmentTransaction.replace(R.id.header_add_transaction, header)
+        fragmentTransaction.commit()
+    }
+}
diff --git a/app/src/main/java/com/example/android_hit/HeaderDetailTransaction.kt b/app/src/main/java/com/example/android_hit/HeaderDetailTransaction.kt
new file mode 100644
index 0000000000000000000000000000000000000000..7cc71fb3450083d51e1ef08e36222b83ff5efa95
--- /dev/null
+++ b/app/src/main/java/com/example/android_hit/HeaderDetailTransaction.kt
@@ -0,0 +1,59 @@
+package com.example.android_hit
+
+import android.os.Bundle
+import androidx.fragment.app.Fragment
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+
+// TODO: Rename parameter arguments, choose names that match
+// the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
+private const val ARG_PARAM1 = "param1"
+private const val ARG_PARAM2 = "param2"
+
+/**
+ * A simple [Fragment] subclass.
+ * Use the [HeaderDetailTransaction.newInstance] factory method to
+ * create an instance of this fragment.
+ */
+class HeaderDetailTransaction : Fragment() {
+    // TODO: Rename and change types of parameters
+    private var param1: String? = null
+    private var param2: String? = null
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        arguments?.let {
+            param1 = it.getString(ARG_PARAM1)
+            param2 = it.getString(ARG_PARAM2)
+        }
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater, container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View? {
+        // Inflate the layout for this fragment
+        return inflater.inflate(R.layout.fragment_header_detail_transaction, container, false)
+    }
+
+    companion object {
+        /**
+         * Use this factory method to create a new instance of
+         * this fragment using the provided parameters.
+         *
+         * @param param1 Parameter 1.
+         * @param param2 Parameter 2.
+         * @return A new instance of fragment HeaderDetailTransaction.
+         */
+        // TODO: Rename and change types and number of parameters
+        @JvmStatic
+        fun newInstance(param1: String, param2: String) =
+            HeaderDetailTransaction().apply {
+                arguments = Bundle().apply {
+                    putString(ARG_PARAM1, param1)
+                    putString(ARG_PARAM2, param2)
+                }
+            }
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/example/android_hit/Transaction.kt b/app/src/main/java/com/example/android_hit/Transaction.kt
index b2752dbf5fcc13e0d94fbb743cb5edab05bade12..7f55703e003b60ddf111364e590a7131ca925d30 100644
--- a/app/src/main/java/com/example/android_hit/Transaction.kt
+++ b/app/src/main/java/com/example/android_hit/Transaction.kt
@@ -11,6 +11,7 @@ import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
 import com.example.android_hit.adapter.TransactionAdapter
 import com.example.android_hit.databinding.ActivityMainBinding
+import com.example.android_hit.databinding.FragmentTransactionBinding
 import com.example.android_hit.room.TransactionDB
 import com.example.android_hit.room.TransactionEntity
 import com.google.android.material.floatingactionbutton.FloatingActionButton
@@ -27,48 +28,85 @@ private const val ARG_PARAM2 = "param2"
  */
 class Transaction : Fragment() {
     // TODO: Rename and change types of parameters
-    private lateinit var binding: ActivityMainBinding
+    private lateinit var binding: FragmentTransactionBinding
     private lateinit var recyclerView: RecyclerView
     private lateinit var adapter: TransactionAdapter
     private lateinit var database: TransactionDB
     private lateinit var fab: FloatingActionButton
     private var list = mutableListOf<TransactionEntity>()
 
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        binding = ActivityMainBinding.inflate(layoutInflater)
-    }
+//    override fun onCreate(savedInstanceState: Bundle?) {
+//        super.onCreate(savedInstanceState)
+//    }
 
     override fun onCreateView(
         inflater: LayoutInflater, container: ViewGroup?,
         savedInstanceState: Bundle?
     ): View? {
         // Inflate the layout for this fragment
-        return inflater.inflate(R.layout.fragment_transaction, container, false)
+        binding = FragmentTransactionBinding.inflate(inflater, container, false)
+        return binding.root
     }
 
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
-        recyclerView = view.findViewById(R.id.rv_transaction)
-        fab = view.findViewById(R.id.fab_add)
-        database = TransactionDB.getInstance(requireContext())
-        adapter = TransactionAdapter(list)
+        recyclerView = binding.rvTransaction
+        fab = binding.fabAdd
         recyclerView.layoutManager = LinearLayoutManager(requireContext())
-        recyclerView.addItemDecoration(DividerItemDecoration(requireContext(), DividerItemDecoration.VERTICAL))
+        recyclerView.addItemDecoration(
+            DividerItemDecoration(requireContext(), DividerItemDecoration.VERTICAL)
+        )
+        adapter = TransactionAdapter(list)
         recyclerView.adapter = adapter
-        getData()
         fab.setOnClickListener {
             startActivity(Intent(requireContext(), AddTransactionActivity::class.java))
         }
 
+        adapter.setOnDeleteClickListener(object : TransactionAdapter.OnDeleteClickListener {
+            override fun onDeleteClick(position: Int) {
+                deleteTransaction(position)
+            }
+        })
+        database = TransactionDB.getInstance(requireContext())
+        getData()
+        val totalExpenseAmount = database.transactionDao.getTotalExpense()
+        binding.amountExpense.text = totalExpenseAmount.toString()
+    }
+
+    private fun deleteTransaction(position: Int) {
+        val deletedItem = list[position]
+        // Kurangi total expense amount jika transaksi yang dihapus memiliki kategori expense
+        if (deletedItem.category == "Expense") {
+            val expenseAmount = deletedItem.amount
+            val currentTotalExpense = database.transactionDao.getTotalExpense()
+            val newTotalExpense = currentTotalExpense - expenseAmount
+            binding.amountExpense.text = newTotalExpense.toString()
+        } else {
+            val incomeAmount = deletedItem.amount
+            val currentTotalIncome = database.transactionDao.getTotalIncome()
+            val newTotalIncome = currentTotalIncome - incomeAmount
+            binding.amountIncome.text = newTotalIncome.toString()
+        }
+        // Hapus transaksi dari database dan daftar transaksi
+        database.transactionDao.deleteTransaction(deletedItem)
+        list.removeAt(position)
+        adapter.notifyItemRemoved(position)
     }
 
-    fun getData() {
+    private fun getData() {
         list.clear()
         list.addAll(database.transactionDao.getAllTransaction())
         adapter.notifyDataSetChanged()
+        val totalExpenseAmount = database.transactionDao.getTotalExpense()
+        binding.amountExpense.text = totalExpenseAmount.toString()
+        val totalIncomeAmount = database.transactionDao.getTotalIncome()
+        binding.amountIncome.text = totalIncomeAmount.toString()
     }
 
+    override fun onResume() {
+        super.onResume()
+        getData()
+    }
     companion object {
         /**
          * Use this factory method to create a new instance of
diff --git a/app/src/main/java/com/example/android_hit/adapter/TransactionAdapter.kt b/app/src/main/java/com/example/android_hit/adapter/TransactionAdapter.kt
index e12c1768b846381da3a85125eb5fc53630e75a66..16f3343aaddd4c72e4377ddd6ce705293a2533b5 100644
--- a/app/src/main/java/com/example/android_hit/adapter/TransactionAdapter.kt
+++ b/app/src/main/java/com/example/android_hit/adapter/TransactionAdapter.kt
@@ -1,36 +1,76 @@
 package com.example.android_hit.adapter
 
+import android.content.Intent
+import android.net.Uri
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import android.widget.ImageButton
 import android.widget.TextView
+import android.widget.Toast
 import androidx.recyclerview.widget.RecyclerView
+import com.example.android_hit.AddTransactionActivity
 import com.example.android_hit.R
+import com.example.android_hit.databinding.RowTransactionBinding
 import com.example.android_hit.room.TransactionEntity
 
-class TransactionAdapter(var list: List<TransactionEntity>) : RecyclerView.Adapter<TransactionAdapter.TransactionViewHolder>() {
-    class TransactionViewHolder(view: View) : RecyclerView.ViewHolder(view) {
-        var title = view.findViewById<TextView>(R.id.title)
-        var amount = view.findViewById<TextView>(R.id.amount)
-        var category = view.findViewById<TextView>(R.id.category)
-        var location = view.findViewById<TextView>(R.id.location)
-        var date = view.findViewById<TextView>(R.id.date)
+class TransactionAdapter(private val list: MutableList<TransactionEntity>) : RecyclerView.Adapter<TransactionAdapter.TransactionViewHolder>() {
+
+    inner class TransactionViewHolder(private val binding: RowTransactionBinding) : RecyclerView.ViewHolder(binding.root){
+        fun bind(transaction: TransactionEntity) {
+            binding.apply {
+                title.text = transaction.title
+                amount.text = transaction.amount.toString()
+                category.text = transaction.category
+                location.text = transaction.location
+                date.text = transaction.timestamp.toString()
+
+                deleteButton.setOnClickListener {
+                    val position = adapterPosition
+                    onDeleteClickListener?.onDeleteClick(position)
+                }
+
+                editButton.setOnClickListener {
+                    val position = adapterPosition
+                    val intent = Intent(binding.root.context, AddTransactionActivity::class.java)
+                    intent.putExtra("id", transaction.id)
+                    binding.root.context.startActivity(intent)
+                }
+
+                location.setOnClickListener {
+                    val locationUri = "geo:0,0?q=${transaction.location}"
+                    val mapIntent = Intent(Intent.ACTION_VIEW, Uri.parse(locationUri))
+                    mapIntent.setPackage("com.google.android.apps.maps")
+                    if (mapIntent.resolveActivity(binding.root.context.packageManager) != null) {
+                        binding.root.context.startActivity(mapIntent)
+                    } else {
+                        Toast.makeText(binding.root.context, "Google Maps app not found", Toast.LENGTH_SHORT).show()
+                    }
+                }
+            }
+        }
+    }
+
+    interface OnDeleteClickListener {
+        fun onDeleteClick(position: Int)
+    }
+
+    private var onDeleteClickListener: OnDeleteClickListener? = null
+
+    fun setOnDeleteClickListener(listener: OnDeleteClickListener) {
+        onDeleteClickListener = listener
     }
 
     override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): TransactionViewHolder {
-        val view = LayoutInflater.from(parent.context).inflate(R.layout.row_transaction, parent, false)
-        return TransactionViewHolder(view)
+        val binding = RowTransactionBinding.inflate(LayoutInflater.from(parent.context), parent, false)
+        return TransactionViewHolder(binding)
     }
 
     override fun onBindViewHolder(holder: TransactionViewHolder, position: Int) {
-        holder.title.text = list[position].title
-        holder.amount.text = list[position].amount.toString()
-        holder.category.text = list[position].category
-        holder.location.text = list[position].location
-        holder.date.text = list[position].date
+        holder.bind(list[position])
     }
 
     override fun getItemCount(): Int {
         return list.size
     }
-}
\ No newline at end of file
+}
diff --git a/app/src/main/java/com/example/android_hit/room/TransactionDB.kt b/app/src/main/java/com/example/android_hit/room/TransactionDB.kt
index 4a40af839552ef261ccf0c469fe93e3a23786ba7..a7e316cb86bf70b7608f53c85a8268c49d82adbe 100644
--- a/app/src/main/java/com/example/android_hit/room/TransactionDB.kt
+++ b/app/src/main/java/com/example/android_hit/room/TransactionDB.kt
@@ -7,7 +7,8 @@ import androidx.room.RoomDatabase
 
 @Database(
     entities = [TransactionEntity::class],
-    version = 1
+    version = 5,
+    exportSchema = false
 )
 abstract class TransactionDB : RoomDatabase() {
 
@@ -16,23 +17,20 @@ abstract class TransactionDB : RoomDatabase() {
     companion object {
         @Volatile
         private var INSTANCE: TransactionDB? = null
-        fun getInstance(context: Context): TransactionDB {
-            synchronized(this) {
-                var instance = INSTANCE
 
-                if (instance == null) {
-                    instance = Room.databaseBuilder(
-                        context.applicationContext,
-                        TransactionDB::class.java,
-                        "transaction_database"
-                    )
+        fun getInstance(context: Context): TransactionDB {
+            return INSTANCE ?: synchronized(this) {
+                val instance = Room.databaseBuilder(
+                    context.applicationContext,
+                    TransactionDB::class.java,
+                    "transaction_database"
+                )
                     .fallbackToDestructiveMigration()
                     .allowMainThreadQueries()
                     .build()
-                    INSTANCE = instance
-                }
-                return instance
+                INSTANCE = instance
+                instance
             }
         }
     }
-}
\ No newline at end of file
+}
diff --git a/app/src/main/java/com/example/android_hit/room/TransactionDao.kt b/app/src/main/java/com/example/android_hit/room/TransactionDao.kt
index ed490ea43e3436be56891c80c1e41d81c70fd2ba..7e74f16576f121152af8cca6d5d76cee08450fb8 100644
--- a/app/src/main/java/com/example/android_hit/room/TransactionDao.kt
+++ b/app/src/main/java/com/example/android_hit/room/TransactionDao.kt
@@ -6,17 +6,17 @@ import androidx.room.*
 @Dao
 interface TransactionDao {
 
-    @Query("SELECT * FROM transaction_table")
+    @Query("SELECT * FROM transaction_table ORDER BY id DESC")
     fun getAllTransaction() : List<TransactionEntity>
 
-    @Query("SELECT SUM(amount) FROM transaction_table WHERE category = 'income'")
-    fun getTotalIncome() : List<Int>
+    @Query("SELECT SUM(amount) FROM transaction_table WHERE category = 'Income'")
+    fun getTotalIncome() : Int
 
-    @Query("SELECT SUM(amount) FROM transaction_table WHERE category = 'expense'")
-    fun getTotalExpense() : List<Int>
+    @Query("SELECT SUM(amount) FROM transaction_table WHERE category = 'Expense'")
+    fun getTotalExpense() : Int
 
-    @Query("SELECT * FROM transaction_table WHERE title = :title")
-    fun getByJudul(title: String): TransactionEntity
+    @Query("SELECT * FROM transaction_table WHERE id = :id")
+    fun getId(id: Int) : TransactionEntity
 
     @Insert
     fun addTransaction(vararg transactionEntity: TransactionEntity)
diff --git a/app/src/main/java/com/example/android_hit/room/TransactionEntity.kt b/app/src/main/java/com/example/android_hit/room/TransactionEntity.kt
index fc1b757eeea724095c0e8989b8c8c3468c0115aa..4fb6391189fb4799ecb1bcb0af7b032d900649b8 100644
--- a/app/src/main/java/com/example/android_hit/room/TransactionEntity.kt
+++ b/app/src/main/java/com/example/android_hit/room/TransactionEntity.kt
@@ -11,5 +11,5 @@ class TransactionEntity (
     @ColumnInfo(name = "amount") val amount : Int,
     @ColumnInfo(name = "category") val category : String,
     @ColumnInfo(name = "location") val location : String,
-    @ColumnInfo(name = "date") val date : String
+    @ColumnInfo(name = "timestamp") val timestamp: String
 )
\ No newline at end of file
diff --git a/app/src/main/res/drawable/baseline_arrow_back_ios_24.xml b/app/src/main/res/drawable/baseline_arrow_back_ios_24.xml
new file mode 100644
index 0000000000000000000000000000000000000000..7963863026d5cd441f2781123dfce8073a89fe24
--- /dev/null
+++ b/app/src/main/res/drawable/baseline_arrow_back_ios_24.xml
@@ -0,0 +1,5 @@
+<vector android:autoMirrored="true" android:height="24dp"
+    android:tint="#322F50" android:viewportHeight="24"
+    android:viewportWidth="24" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M11.67,3.87L9.9,2.1 0,12l9.9,9.9 1.77,-1.77L3.54,12z"/>
+</vector>
diff --git a/app/src/main/res/drawable/border_transaction_layout.xml b/app/src/main/res/drawable/border_transaction_layout.xml
new file mode 100644
index 0000000000000000000000000000000000000000..2934ebe3d5e76746d0e1bb11fb130d31851051a5
--- /dev/null
+++ b/app/src/main/res/drawable/border_transaction_layout.xml
@@ -0,0 +1,13 @@
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <stroke
+        android:width="1dp"
+    android:color="@color/primary_color_1"/>
+    <corners
+        android:radius="12dp"/>
+    <padding
+        android:left="0dp"
+        android:top="0dp"
+        android:right="0dp"
+        android:bottom="0dp"/> <!-- Padding, sesuaikan dengan kebutuhan -->
+</shape>
diff --git a/app/src/main/res/drawable/expense.xml b/app/src/main/res/drawable/expense.xml
new file mode 100644
index 0000000000000000000000000000000000000000..f6006d1aed7c4e3f07bc6ac61042cb04e6cbc1ca
--- /dev/null
+++ b/app/src/main/res/drawable/expense.xml
@@ -0,0 +1,16 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="34dp"
+    android:height="32dp"
+    android:viewportWidth="34"
+    android:viewportHeight="32">
+  <path
+      android:pathData="M8,0L25.6,0A8,8 0,0 1,33.6 8L33.6,24A8,8 0,0 1,25.6 32L8,32A8,8 0,0 1,0 24L0,8A8,8 0,0 1,8 0z"
+      android:fillColor="#F0F0F2"/>
+  <group>
+    <clip-path
+        android:pathData="M8,8h17.6v16h-17.6z"/>
+    <path
+        android:pathData="M15.568,11.2L16,10.728V13.6C16,13.812 16.084,14.016 16.234,14.166C16.384,14.316 16.588,14.4 16.8,14.4C17.012,14.4 17.216,14.316 17.366,14.166C17.516,14.016 17.6,13.812 17.6,13.6V10.728L18.032,11.168C18.105,11.25 18.193,11.316 18.293,11.363C18.392,11.409 18.5,11.434 18.609,11.437C18.719,11.44 18.827,11.421 18.929,11.38C19.031,11.339 19.123,11.278 19.2,11.2C19.275,11.125 19.334,11.037 19.375,10.94C19.416,10.842 19.437,10.738 19.437,10.632C19.437,10.526 19.416,10.422 19.375,10.324C19.334,10.227 19.275,10.138 19.2,10.064L17.368,8.232C17.292,8.159 17.202,8.102 17.104,8.064C16.909,7.984 16.691,7.984 16.496,8.064C16.398,8.102 16.308,8.159 16.232,8.232L14.4,10.032C14.245,10.187 14.158,10.397 14.158,10.616C14.158,10.835 14.245,11.045 14.4,11.2C14.555,11.355 14.765,11.442 14.984,11.442C15.203,11.442 15.413,11.355 15.568,11.2ZM16.8,16C16.325,16 15.861,16.141 15.467,16.404C15.072,16.668 14.764,17.043 14.583,17.482C14.401,17.92 14.354,18.403 14.446,18.868C14.539,19.334 14.767,19.761 15.103,20.097C15.439,20.433 15.866,20.661 16.332,20.754C16.797,20.846 17.28,20.799 17.718,20.617C18.157,20.436 18.532,20.128 18.795,19.733C19.059,19.339 19.2,18.875 19.2,18.4C19.2,17.763 18.947,17.153 18.497,16.703C18.047,16.253 17.437,16 16.8,16ZM16.8,19.2C16.642,19.2 16.487,19.153 16.355,19.065C16.224,18.977 16.121,18.852 16.061,18.706C16,18.56 15.984,18.399 16.015,18.244C16.046,18.089 16.122,17.946 16.234,17.834C16.346,17.722 16.489,17.646 16.644,17.615C16.799,17.584 16.96,17.6 17.106,17.661C17.252,17.721 17.377,17.824 17.465,17.955C17.553,18.087 17.6,18.242 17.6,18.4C17.6,18.612 17.516,18.816 17.366,18.966C17.216,19.116 17.012,19.2 16.8,19.2ZM11.2,18.4C11.2,18.558 11.247,18.713 11.335,18.844C11.423,18.976 11.548,19.079 11.694,19.139C11.84,19.2 12.001,19.215 12.156,19.184C12.311,19.154 12.454,19.077 12.566,18.966C12.678,18.854 12.754,18.711 12.785,18.556C12.816,18.401 12.8,18.24 12.739,18.094C12.679,17.948 12.576,17.823 12.444,17.735C12.313,17.647 12.158,17.6 12,17.6C11.788,17.6 11.584,17.684 11.434,17.834C11.284,17.984 11.2,18.188 11.2,18.4ZM22.4,18.4C22.4,18.242 22.353,18.087 22.265,17.955C22.177,17.824 22.052,17.721 21.906,17.661C21.76,17.6 21.599,17.584 21.444,17.615C21.289,17.646 21.146,17.722 21.034,17.834C20.922,17.946 20.846,18.089 20.815,18.244C20.785,18.399 20.8,18.56 20.861,18.706C20.921,18.852 21.024,18.977 21.156,19.065C21.287,19.153 21.442,19.2 21.6,19.2C21.812,19.2 22.016,19.116 22.166,18.966C22.316,18.816 22.4,18.612 22.4,18.4ZM23.2,12.8H20C19.788,12.8 19.584,12.884 19.434,13.034C19.284,13.184 19.2,13.388 19.2,13.6C19.2,13.812 19.284,14.016 19.434,14.166C19.584,14.316 19.788,14.4 20,14.4H23.2C23.412,14.4 23.616,14.484 23.766,14.634C23.916,14.784 24,14.988 24,15.2V21.6C24,21.812 23.916,22.016 23.766,22.166C23.616,22.316 23.412,22.4 23.2,22.4H10.4C10.188,22.4 9.984,22.316 9.834,22.166C9.684,22.016 9.6,21.812 9.6,21.6V15.2C9.6,14.988 9.684,14.784 9.834,14.634C9.984,14.484 10.188,14.4 10.4,14.4H13.6C13.812,14.4 14.016,14.316 14.166,14.166C14.316,14.016 14.4,13.812 14.4,13.6C14.4,13.388 14.316,13.184 14.166,13.034C14.016,12.884 13.812,12.8 13.6,12.8H10.4C9.763,12.8 9.153,13.053 8.703,13.503C8.253,13.953 8,14.563 8,15.2V21.6C8,22.236 8.253,22.847 8.703,23.297C9.153,23.747 9.763,24 10.4,24H23.2C23.837,24 24.447,23.747 24.897,23.297C25.347,22.847 25.6,22.236 25.6,21.6V15.2C25.6,14.563 25.347,13.953 24.897,13.503C24.447,13.053 23.837,12.8 23.2,12.8Z"
+        android:fillColor="#D65C5C"/>
+  </group>
+</vector>
diff --git a/app/src/main/res/drawable/income.xml b/app/src/main/res/drawable/income.xml
new file mode 100644
index 0000000000000000000000000000000000000000..9cfd5a99e2ecf09cdfd00b1a72a09c959b695696
--- /dev/null
+++ b/app/src/main/res/drawable/income.xml
@@ -0,0 +1,5 @@
+<vector android:height="22.588236dp" android:viewportHeight="32"
+    android:viewportWidth="34" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#F0F0F2" android:pathData="M8,0L25.6,0A8,8 0,0 1,33.6 8L33.6,24A8,8 0,0 1,25.6 32L8,32A8,8 0,0 1,0 24L0,8A8,8 0,0 1,8 0z"/>
+    <path android:fillColor="#2DA039" android:pathData="M16.8,16C16.325,16 15.861,16.141 15.467,16.404C15.072,16.668 14.764,17.043 14.583,17.482C14.401,17.92 14.354,18.403 14.446,18.868C14.539,19.334 14.767,19.761 15.103,20.097C15.439,20.433 15.866,20.661 16.332,20.754C16.797,20.847 17.28,20.799 17.718,20.617C18.157,20.436 18.532,20.128 18.795,19.733C19.059,19.339 19.2,18.875 19.2,18.4C19.2,17.764 18.947,17.153 18.497,16.703C18.047,16.253 17.437,16 16.8,16ZM16.8,19.2C16.642,19.2 16.487,19.153 16.355,19.065C16.224,18.977 16.121,18.852 16.061,18.706C16,18.56 15.984,18.399 16.015,18.244C16.046,18.089 16.122,17.946 16.234,17.834C16.346,17.722 16.489,17.646 16.644,17.615C16.799,17.584 16.96,17.6 17.106,17.661C17.252,17.721 17.377,17.824 17.465,17.955C17.553,18.087 17.6,18.242 17.6,18.4C17.6,18.612 17.516,18.816 17.366,18.966C17.216,19.116 17.012,19.2 16.8,19.2ZM16.232,14.168C16.308,14.241 16.398,14.298 16.496,14.336C16.592,14.378 16.695,14.4 16.8,14.4C16.905,14.4 17.008,14.378 17.104,14.336C17.202,14.298 17.292,14.241 17.368,14.168L19.2,12.368C19.355,12.213 19.442,12.003 19.442,11.784C19.442,11.565 19.355,11.355 19.2,11.2C19.045,11.045 18.835,10.958 18.616,10.958C18.397,10.958 18.187,11.045 18.032,11.2L17.6,11.672V8.8C17.6,8.588 17.516,8.384 17.366,8.234C17.216,8.084 17.012,8 16.8,8C16.588,8 16.384,8.084 16.234,8.234C16.084,8.384 16,8.588 16,8.8V11.672L15.568,11.2C15.413,11.045 15.203,10.958 14.984,10.958C14.765,10.958 14.555,11.045 14.4,11.2C14.245,11.355 14.158,11.565 14.158,11.784C14.158,12.003 14.245,12.213 14.4,12.368L16.232,14.168ZM22.4,18.4C22.4,18.242 22.353,18.087 22.265,17.955C22.177,17.824 22.052,17.721 21.906,17.661C21.76,17.6 21.599,17.584 21.444,17.615C21.289,17.646 21.146,17.722 21.034,17.834C20.922,17.946 20.846,18.089 20.815,18.244C20.785,18.399 20.8,18.56 20.861,18.706C20.921,18.852 21.024,18.977 21.156,19.065C21.287,19.153 21.442,19.2 21.6,19.2C21.812,19.2 22.016,19.116 22.166,18.966C22.316,18.816 22.4,18.612 22.4,18.4ZM23.2,12.8H20.8C20.588,12.8 20.384,12.884 20.234,13.034C20.084,13.184 20,13.388 20,13.6C20,13.812 20.084,14.016 20.234,14.166C20.384,14.316 20.588,14.4 20.8,14.4H23.2C23.412,14.4 23.616,14.484 23.766,14.634C23.916,14.784 24,14.988 24,15.2V21.6C24,21.812 23.916,22.016 23.766,22.166C23.616,22.316 23.412,22.4 23.2,22.4H10.4C10.188,22.4 9.984,22.316 9.834,22.166C9.684,22.016 9.6,21.812 9.6,21.6V15.2C9.6,14.988 9.684,14.784 9.834,14.634C9.984,14.484 10.188,14.4 10.4,14.4H12.8C13.012,14.4 13.216,14.316 13.366,14.166C13.516,14.016 13.6,13.812 13.6,13.6C13.6,13.388 13.516,13.184 13.366,13.034C13.216,12.884 13.012,12.8 12.8,12.8H10.4C9.763,12.8 9.153,13.053 8.703,13.503C8.253,13.953 8,14.564 8,15.2V21.6C8,22.236 8.253,22.847 8.703,23.297C9.153,23.747 9.763,24 10.4,24H23.2C23.837,24 24.447,23.747 24.897,23.297C25.347,22.847 25.6,22.236 25.6,21.6V15.2C25.6,14.564 25.347,13.953 24.897,13.503C24.447,13.053 23.837,12.8 23.2,12.8ZM11.2,18.4C11.2,18.558 11.247,18.713 11.335,18.844C11.423,18.976 11.548,19.079 11.694,19.139C11.84,19.2 12.001,19.215 12.156,19.185C12.311,19.154 12.454,19.078 12.566,18.966C12.678,18.854 12.754,18.711 12.785,18.556C12.816,18.401 12.8,18.24 12.739,18.094C12.679,17.948 12.576,17.823 12.444,17.735C12.313,17.647 12.158,17.6 12,17.6C11.788,17.6 11.584,17.684 11.434,17.834C11.284,17.984 11.2,18.188 11.2,18.4Z"/>
+</vector>
diff --git a/app/src/main/res/drawable/outline_delete_24.xml b/app/src/main/res/drawable/outline_delete_24.xml
new file mode 100644
index 0000000000000000000000000000000000000000..316ac365cf8d41a12f8a9a91ab5c95ae73e1d86f
--- /dev/null
+++ b/app/src/main/res/drawable/outline_delete_24.xml
@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#D65C5C"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M16,9v10H8V9h8m-1.5,-6h-5l-1,1H5v2h14V4h-3.5l-1,-1zM18,7H6v12c0,1.1 0.9,2 2,2h8c1.1,0 2,-0.9 2,-2V7z"/>
+</vector>
diff --git a/app/src/main/res/drawable/outline_edit_note_24.xml b/app/src/main/res/drawable/outline_edit_note_24.xml
new file mode 100644
index 0000000000000000000000000000000000000000..ae11337d2e4719f51cca2b3765c030416a91b2ad
--- /dev/null
+++ b/app/src/main/res/drawable/outline_edit_note_24.xml
@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#322F50"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M3,10h11v2H3V10zM3,8h11V6H3V8zM3,16h7v-2H3V16zM18.01,12.87l0.71,-0.71c0.39,-0.39 1.02,-0.39 1.41,0l0.71,0.71c0.39,0.39 0.39,1.02 0,1.41l-0.71,0.71L18.01,12.87zM17.3,13.58l-5.3,5.3V21h2.12l5.3,-5.3L17.3,13.58z"/>
+</vector>
diff --git a/app/src/main/res/drawable/rounded_expense.xml b/app/src/main/res/drawable/rounded_expense.xml
new file mode 100644
index 0000000000000000000000000000000000000000..ad207cee894189e002ee2078238f857ffdd76197
--- /dev/null
+++ b/app/src/main/res/drawable/rounded_expense.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <corners android:radius="12dp" />
+    <solid android:color="@color/primary_color_3" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/rounded_income.xml b/app/src/main/res/drawable/rounded_income.xml
new file mode 100644
index 0000000000000000000000000000000000000000..e8014a563095fdf4c2463583c0a261cfa52234bc
--- /dev/null
+++ b/app/src/main/res/drawable/rounded_income.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <corners android:radius="12dp" />
+    <solid android:color="@color/primary_color_2" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_add_transaction.xml b/app/src/main/res/layout/activity_add_transaction.xml
index 68c22fa23da7fd2b741efd26a6c2f85ac3596707..b4a91db9929b56de9b7722aeacf59746dc70c23b 100644
--- a/app/src/main/res/layout/activity_add_transaction.xml
+++ b/app/src/main/res/layout/activity_add_transaction.xml
@@ -1,107 +1,107 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout
+<RelativeLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical"
-    android:layout_margin="16dp"
     tools:context=".AddTransactionActivity">
 
-    <TextView
+    <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:text="Judul"
-        android:textSize="16dp"
-        android:layout_marginTop="16dp"
-        android:textColor="@color/primary_color_1"/>
-    <com.google.android.material.textfield.TextInputLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        app:boxBackgroundColor="@color/secondary_color_2">
-        <EditText
-            android:id="@+id/et_title"
+        android:orientation="vertical"
+        android:layout_margin="16dp">
+        <TextView
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:inputType="textPersonName" />
-    </com.google.android.material.textfield.TextInputLayout>
-    <TextView
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:text="How Much?"
-        android:textSize="16dp"
-        android:textColor="@color/primary_color_1"
-        android:layout_marginTop="16dp"/>
-    <com.google.android.material.textfield.TextInputLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        app:boxBackgroundColor="@color/secondary_color_2">
-        <EditText
-            android:id="@+id/et_amount"
+            android:text="Title"
+            android:textSize="16dp"
+            android:layout_marginTop="16dp"
+            android:textColor="@color/primary_color_1"/>
+        <com.google.android.material.textfield.TextInputLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+            <EditText
+                android:id="@+id/inputTitle"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:inputType="textPersonName"
+                android:padding="8dp"/>
+        </com.google.android.material.textfield.TextInputLayout>
+        <TextView
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:inputType="textPersonName"/>
-    </com.google.android.material.textfield.TextInputLayout>
-    <TextView
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:text="Kategori"
-        android:textSize="16dp"
-        android:textColor="@color/primary_color_1"
-        android:layout_marginTop="16dp"/>
-    <com.google.android.material.textfield.TextInputLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        app:boxBackgroundColor="@color/secondary_color_2">
-        <EditText
-            android:id="@+id/et_category"
+            android:text="How Much?"
+            android:textSize="16dp"
+            android:textColor="@color/primary_color_1"
+            android:layout_marginTop="16dp"/>
+        <com.google.android.material.textfield.TextInputLayout
             android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+            <EditText
+                android:id="@+id/inputAmount"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:inputType="textPersonName"
+                android:textSize="36dp"
+                android:padding="8dp"/>
+        </com.google.android.material.textfield.TextInputLayout>
+        <TextView
+            android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:inputType="textPersonName"/>
-    </com.google.android.material.textfield.TextInputLayout>
-    <TextView
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:text="Location"
-        android:textSize="16dp"
-        android:textColor="@color/primary_color_1"
-        android:layout_marginTop="16dp"/>
-    <com.google.android.material.textfield.TextInputLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        app:boxBackgroundColor="@color/secondary_color_2">
-        <EditText
-            android:id="@+id/et_location"
+            android:text="Category"
+            android:textSize="16sp"
+            android:layout_marginTop="16dp"
+            android:textColor="@color/primary_color_1"/>
+
+        <RadioGroup
+            android:id="@+id/radioGroupCategory"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:orientation="horizontal"
+            android:layout_gravity="center">
+            <RadioButton
+                android:id="@+id/radioIncome"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="Income"
+                android:textSize="24dp"
+                android:layout_marginRight="24px" />
+            <RadioButton
+                android:id="@+id/radioExpense"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="Expense"
+                android:textSize="24dp"
+                android:layout_marginLeft="24px"/>
+        </RadioGroup>
+        <TextView
             android:layout_width="match_parent"
-            android:layout_height="wrap_content"/>
-    </com.google.android.material.textfield.TextInputLayout>
-    <TextView
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:text="Date"
-        android:textSize="16dp"
-        android:textColor="@color/primary_color_1"
-        android:layout_marginTop="16dp"/>
-    <com.google.android.material.textfield.TextInputLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        app:boxBackgroundColor="@color/secondary_color_2">
-        <EditText
-            android:id="@+id/et_date"
+            android:layout_height="wrap_content"
+            android:text="Location"
+            android:textSize="16dp"
+            android:textColor="@color/primary_color_1"
+            android:layout_marginTop="16dp"/>
+        <com.google.android.material.textfield.TextInputLayout
             android:layout_width="match_parent"
-            android:layout_height="wrap_content"/>
-    </com.google.android.material.textfield.TextInputLayout>
-    <Button
-        android:id="@+id/btn_save"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:text="Save"
-        android:backgroundTint="@color/primary_color_1"
-        android:textColor="@color/white"
-        android:layout_marginTop="80dp"
-        android:layout_gravity="center_horizontal"
-        />
-        
+            android:layout_height="wrap_content">
+            <EditText
+                android:id="@+id/inputLocation"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:padding="8dp"/>
+        </com.google.android.material.textfield.TextInputLayout>
+        <Button
+            android:id="@+id/buttonSave"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:text="Save"
+            android:backgroundTint="@color/primary_color_1"
+            android:textColor="@color/white"
+            android:layout_marginTop="48dp"
+            android:layout_gravity="center_horizontal"
+            />
 
-  </LinearLayout>
\ No newline at end of file
+    </LinearLayout>
+</RelativeLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_header_detail_transaction.xml b/app/src/main/res/layout/fragment_header_detail_transaction.xml
new file mode 100644
index 0000000000000000000000000000000000000000..64695a58ebcee279d1ec00d3a7cfabfec1fe8fe9
--- /dev/null
+++ b/app/src/main/res/layout/fragment_header_detail_transaction.xml
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    tools:context=".HeaderDetailTransaction"
+    android:id="@+id/header_add_transaction">
+
+    <!-- TODO: Update blank fragment layout -->
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:text="@string/hello_blank_fragment"
+        android:textSize="30dp"/>
+
+</FrameLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_transaction.xml b/app/src/main/res/layout/fragment_transaction.xml
index 974ea9ab852ad061a762e7bbfd2e48ce93448a3b..51d3b483fcfcd42447b9f44e5cad8a07e588232e 100644
--- a/app/src/main/res/layout/fragment_transaction.xml
+++ b/app/src/main/res/layout/fragment_transaction.xml
@@ -6,35 +6,148 @@
     android:layout_height="match_parent"
     tools:context=".Transaction">
 
-    <ScrollView
+    <LinearLayout
+        android:id="@+id/expense_layout"
         android:layout_width="match_parent"
-        android:layout_height="match_parent">
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:layout_marginVertical="8dp"
+        android:layout_marginHorizontal="16dp">
 
+        <!-- LinearLayout untuk kolom -->
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:orientation="vertical">
+            android:orientation="horizontal">
+
+            <!-- Kolom biru -->
+            <LinearLayout
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"
+                android:background="@drawable/rounded_income"
+                android:padding="16dp"
+                android:orientation="horizontal"
+                android:layout_marginRight="8dp">
+
+                <ImageView
+                    android:layout_width="32dp"
+                    android:layout_height="32dp"
+                    android:src="@drawable/income"
+                    android:scaleType="fitCenter"
+                    android:layout_gravity="center_vertical"
+                    android:layout_marginRight="12dp"
+                    />
+
+
+                <LinearLayout
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical">
+                    <TextView
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:text="Income"
+                        android:textColor="@color/primary_color_1"
+                        android:textStyle="normal"
+                        android:textSize="16dp"
+                        />
+
+                    <!-- Teks kedua di dalam kolom biru -->
+                    <TextView
+                        android:id="@+id/amount_income"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:textColor="@color/primary_color_1"
+                        android:textStyle="bold"
+                        android:textSize="16dp"
+                        />
+                </LinearLayout>
+
+            </LinearLayout>
+
+            <!-- Kolom kuning -->
+            <LinearLayout
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"
+                android:background="@drawable/rounded_expense"
+                android:padding="16dp"
+                android:orientation="horizontal"
+                android:layout_marginRight="8dp">
+
+                <ImageView
+                    android:layout_width="32dp"
+                    android:layout_height="32dp"
+                    android:src="@drawable/expense"
+                    android:scaleType="fitCenter"
+                    android:layout_gravity="center_vertical"
+                    android:layout_marginRight="12dp"
+                    />
+
+
+                <LinearLayout
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical">
+                    <TextView
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:text="Expense"
+                        android:textColor="@color/primary_color_1"
+                        android:textStyle="normal"
+                        android:textSize="16dp"
+                        />
+
+                    <!-- Teks kedua di dalam kolom biru -->
+                    <TextView
+                        android:id="@+id/amount_expense"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:textColor="@color/primary_color_1"
+                        android:textStyle="bold"
+                        android:textSize="16dp"
+                        />
+                </LinearLayout>
+            </LinearLayout>
+        </LinearLayout>
+        <TextView
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:text="Recently Transaction"
+            android:textSize="20dp"
+            android:textStyle="bold"
+            android:layout_marginTop="16dp"
+            android:textColor="@color/primary_color_1"/>
 
-            <!-- Isi konten Anda di sini -->
+        <ScrollView
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            android:layout_marginTop="8dp">
 
             <androidx.recyclerview.widget.RecyclerView
-                android:id="@+id/rv_transaction"
+                android:id="@+id/rvTransaction"
                 android:layout_width="match_parent"
-                android:layout_height="wrap_content">
+                android:layout_height="wrap_content"
+                android:paddingBottom="48dp">
             </androidx.recyclerview.widget.RecyclerView>
 
-        </LinearLayout>
+        </ScrollView>
+    </LinearLayout>
 
-    </ScrollView>
 
     <!-- Tombol Add -->
     <com.google.android.material.floatingactionbutton.FloatingActionButton
-        android:id="@+id/fab_add"
+        android:id="@+id/fabAdd"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_margin="16dp"
-        android:src="@drawable/baseline_add_circle_24"
         android:layout_alignParentBottom="true"
-        android:layout_alignParentEnd="true"/>
+        android:layout_alignParentEnd="true"
+        app:srcCompat="@drawable/baseline_add_circle_24"
+        app:backgroundTint="@android:color/transparent"
+        app:fabSize="auto"
+        app:maxImageSize="60dp"
+        app:elevation="0dp"/>
 
 </RelativeLayout>
diff --git a/app/src/main/res/layout/row_transaction.xml b/app/src/main/res/layout/row_transaction.xml
index 401eaeeee0db36f7557e3a5488bd26db53fdf134..b1f180d0fdc8fe1d45d2f9718c62a69b97c2e85f 100644
--- a/app/src/main/res/layout/row_transaction.xml
+++ b/app/src/main/res/layout/row_transaction.xml
@@ -4,7 +4,9 @@
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:orientation="vertical"
-    android:padding="16dp">
+    android:padding="16dp"
+    android:background="@drawable/border_transaction_layout"
+    android:layout_marginBottom="16dp">
 
     <LinearLayout
         android:id="@+id/transaction_layout"
@@ -18,15 +20,19 @@
             android:orientation="vertical"
             android:layout_marginRight="8dp">
             <TextView
-                android:id="@+id/date"
+                android:id="@+id/title"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:textSize="16dp"/>
+                android:textSize="20dp"
+                android:textStyle="bold"
+                android:gravity="left"
+                android:layout_marginBottom="8dp"/>
             <TextView
-                android:id="@+id/title"
+                android:id="@+id/date"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:textSize="16dp"/>
+                android:textSize="16dp"
+                android:gravity="left"/>
         </LinearLayout>
         <LinearLayout
             android:layout_width="wrap_content"
@@ -37,18 +43,60 @@
                 android:id="@+id/amount"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:textSize="16dp"/>
+                android:textSize="20dp"
+                android:textStyle="bold"
+                android:gravity="right"
+                android:layout_marginBottom="8dp"/>
             <TextView
                 android:id="@+id/category"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:textSize="16dp"/>
+                android:textSize="16dp"
+                android:gravity="right"/>
         </LinearLayout>
     </LinearLayout>
-    <TextView
-        android:id="@+id/location"
+    <LinearLayout
+        android:id="@+id/location_delete_edit_layout"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:textSize="16dp"/>
+        android:orientation="horizontal"
+        android:gravity="center_vertical"
+        android:layout_marginTop="8dp">
+        <ImageView
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/outline_location_on_24"
+            android:layout_gravity="center_vertical"/>
+        <TextView
+            android:id="@+id/location"
+            android:layout_width="wrap_content"
+            android:layout_weight="1"
+            android:layout_height="wrap_content"
+            android:textSize="16sp"
+            android:layout_marginStart="8dp"/>
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:orientation="horizontal"
+            android:layout_marginLeft="8dp"
+            android:gravity="end">
+            <ImageButton
+                android:id="@+id/delete_button"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:src="@drawable/outline_delete_24"
+                android:background="@android:color/transparent"
+                android:layout_marginRight="4dp"/>
+
+            <ImageButton
+                android:id="@+id/edit_button"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:src="@drawable/outline_edit_note_24"
+                android:background="@android:color/transparent"
+                android:layout_marginLeft="4dp"/>
+        </LinearLayout>
+    </LinearLayout>
 
 </LinearLayout>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 47b21c25c01e0fb42f690c2d4709b363b1664555..36e4f7e80fa77a5ddd460cd699f6fde5078defbf 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -5,5 +5,7 @@
     <string name="fragment_settings">Settings</string>
     <string name="fragment_graphs">Graphs</string>
     <string name="fragment_scan">Scan</string>
+    <!-- TODO: Remove or change this placeholder text -->
+    <string name="hello_blank_fragment">Hello blank fragment</string>
 
 </resources>
\ No newline at end of file