TP-33740 | Revamp Navi Configuration Screen (#7134)

2023-07-11 23:33:55 +05:30
parent 081607ca61
commit e4f68f6149
18 changed files with 649 additions and 216 deletions
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -125,8 +125,6 @@ android {
        qa {
            dimension "app"
            applicationId "com.naviapp.dev"
-            buildConfigField 'String', 'BASE_URL_QA', formatString('https://qa-sa.navi.com/')
-            buildConfigField 'String', 'BASE_URL_DEV', formatString('https://dev-sa.navi.com/')
            buildConfigField 'String', 'BASE_URL', formatString('https://qa-sa.navi.com/')
            buildConfigField 'String', 'MOENGAGE_KEY', formatString('2PDJ4M6TDY7ADQ5N5LU48H9Y')
            buildConfigField 'String', 'APPSFLYER_KEY', formatString('ua6cppJ9oQx7aPQPNyHrHA')
@@ -142,8 +140,6 @@ android {
        dev {
            applicationId "com.naviapp.dev"
            dimension "app"
-            buildConfigField 'String', 'BASE_URL_QA', formatString('https://qa-sa.navi.com/')
-            buildConfigField 'String', 'BASE_URL_DEV', formatString('https://dev-sa.navi.com/')
            buildConfigField 'String', 'BASE_URL', formatString('https://dev-sa.navi.com/')
            buildConfigField "String", "MOENGAGE_KEY", formatString('2PDJ4M6TDY7ADQ5N5LU48H9Y')
            buildConfigField "String", "APPSFLYER_KEY", formatString('ua6cppJ9oQx7aPQPNyHrHA')
@@ -160,8 +156,6 @@ android {
            dimension "app"
            if (project.hasProperty('BASE_URL') && project.hasProperty('MOENGAGE_KEY') && project.hasProperty('APPSFLYER_KEY') && project.hasProperty('UXCAM_KEY') && project.hasProperty('HYPERVERGE_APP_KEY') && project.hasProperty('HYPERVERGE_APP_ID') && project.hasProperty('TRUECALLER_KEY') && project.hasProperty('GI_SECRET_KEY')
                    && project.hasProperty('GI_RAZORPAY_KEY') && project.hasProperty('XIAOMI_PUSH_APP_ID') && project.hasProperty('XIAOMI_PUSH_APP_KEY') && project.hasProperty('GOOGLE_MAPS_KEY') && project.hasProperty('GI_RAZORPAY_KEY') && project.hasProperty('FACEBOOK_APP_ID')) {
-                buildConfigField 'String', 'BASE_URL_QA', formatString('https://qa-sa.navi.com/')
-                buildConfigField 'String', 'BASE_URL_DEV', formatString('https://dev-sa.navi.com/')
                buildConfigField 'String', 'BASE_URL', formatString("$BASE_URL")
                buildConfigField 'String', 'MOENGAGE_KEY', formatString("$MOENGAGE_KEY")
                buildConfigField 'String', 'APPSFLYER_KEY', formatString("$APPSFLYER_KEY")
@@ -169,7 +163,7 @@ android {
                buildConfigField 'String', 'HYPERVERGE_APP_ID', formatString("$HYPERVERGE_APP_ID")
                buildConfigField 'String', 'XIAOMI_PUSH_APP_ID', formatString("$XIAOMI_PUSH_APP_ID")
                buildConfigField 'String', 'XIAOMI_PUSH_APP_KEY', formatString("$XIAOMI_PUSH_APP_KEY")
-                manifestPlaceholders = [TRUECALLER_KEY : "$TRUECALLER_KEY", GOOGLE_MAPS_KEY: "$GOOGLE_MAPS_KEY", FACEBOOK_APP_ID: "$FACEBOOK_APP_ID"]
+                manifestPlaceholders = [TRUECALLER_KEY: "$TRUECALLER_KEY", GOOGLE_MAPS_KEY: "$GOOGLE_MAPS_KEY", FACEBOOK_APP_ID: "$FACEBOOK_APP_ID"]
                buildConfigField 'String', 'GOOGLE_MAPS_KEY', formatString("$GOOGLE_MAPS_KEY")
                buildConfigField 'String', 'GI_SECRET_KEY', formatString("$GI_SECRET_KEY")
                buildConfigField 'String', 'YOUTUBE_KEY', formatString("$YOUTUBE_KEY")
@@ -301,7 +295,7 @@ dependencies {
    androidTestImplementation "androidx.test.espresso:espresso-core:$espresso_version"
    androidTestImplementation "androidx.test.espresso:espresso-intents:$espresso_version"
    androidTestImplementation "androidx.test.espresso:espresso-web:$espresso_version"
-    androidTestImplementation ("androidx.test.espresso:espresso-contrib:$espresso_version"){
+    androidTestImplementation("androidx.test.espresso:espresso-contrib:$espresso_version") {
        exclude(group: "com.google.protobuf", module: "protobuf-lite")
    }
    androidTestImplementation "org.hamcrest:hamcrest:$hamcrest_version"
--- a/app/src/debug/AndroidManifest.xml
+++ b/app/src/debug/AndroidManifest.xml
@@ -2,15 +2,17 @@

 <!--
  ~
-  ~  * Copyright © 2019-2022 by Navi Technologies Limited
+  ~  * Copyright © 2023 by Navi Technologies Limited
  ~  * All rights reserved. Strictly confidential
  ~
  -->

 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
+
    <application
-        android:name="HyperionDebug.DebugApp"
-        tools:replace="android:name"
-        />
+        android:name="hyperion.HyperionApplication"
+        tools:ignore="MissingApplicationIcon"
+        tools:replace="android:name" />
+
 </manifest>
--- a/app/src/debug/java/HyperionDebug/HyperionApplication.kt
+++ b/app/src/debug/java/HyperionDebug/HyperionApplication.kt
@@ -1,24 +0,0 @@
-package HyperionDebug
-
-import android.content.Intent
-import com.github.takahirom.hyperion.plugin.simpleitem.SimpleItem
-import com.github.takahirom.hyperion.plugin.simpleitem.SimpleItemHyperionPlugin
-import com.naviapp.app.NaviApplication
-import com.naviapp.home.activity.DevSettingsActivity
-
-class DebugApp : NaviApplication() {
-    override fun onCreate() {
-        super.onCreate()
-
-        val qaButton: SimpleItem = SimpleItem.Builder()
-            .title("DevSettings")
-            .text("Open DevSettings")
-            .clickListener {
-                val intent = Intent(applicationContext, DevSettingsActivity::class.java)
-                intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
-                startActivity(intent)
-            }
-            .build();
-        SimpleItemHyperionPlugin.addItem(qaButton)
-    }
-}
--- a/app/src/debug/java/hyperion/HyperionApplication.kt
+++ b/app/src/debug/java/hyperion/HyperionApplication.kt
@@ -0,0 +1,33 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package hyperion
+
+import android.content.Intent
+import com.github.takahirom.hyperion.plugin.simpleitem.SimpleItem
+import com.github.takahirom.hyperion.plugin.simpleitem.SimpleItemHyperionPlugin
+import com.naviapp.R
+import com.naviapp.app.NaviApplication
+import com.naviapp.configuration.NaviConfigurationActivity
+
+class HyperionApplication : NaviApplication() {
+    override fun onCreate() {
+        super.onCreate()
+        SimpleItemHyperionPlugin.addItem(
+            SimpleItem.Builder()
+                .title("Navi Configuration")
+                .text("Change Environment, Version Code, & Base URL on the fly.")
+                .clickListener {
+                    val intent = Intent(applicationContext, NaviConfigurationActivity::class.java)
+                    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
+                    startActivity(intent)
+                }
+                .image(R.drawable.ic_navi_logo)
+                .build()
+        )
+    }
+}
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -54,10 +54,11 @@
            android:screenOrientation="portrait"
            android:exported="false" />
        <activity
-            android:name=".home.activity.DevSettingsActivity"
+            android:name=".configuration.NaviConfigurationActivity"
            android:exported="false"
            android:screenOrientation="portrait"
-            android:theme="@style/BaseThemeStyle" />
+            android:theme="@style/BaseThemeStyle"
+            android:windowSoftInputMode="adjustResize" />
        <activity
            android:name=".personalloanrevamp.getloanRevamp.activities.SkipMandateV2Activity"
            android:exported="false"
--- a/app/src/main/java/com/naviapp/configuration/NaviConfigurationActivity.kt
+++ b/app/src/main/java/com/naviapp/configuration/NaviConfigurationActivity.kt
@@ -0,0 +1,55 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration
+
+import android.os.Bundle
+import androidx.activity.ComponentActivity
+import androidx.activity.compose.setContent
+import com.navi.base.utils.BaseUtils
+import com.navi.base.utils.DEV
+import com.navi.base.utils.QA
+import com.navi.base.utils.isNull
+import com.naviapp.BuildConfig
+import com.naviapp.configuration.composable.NaviConfigurationScreen
+import dagger.hilt.android.AndroidEntryPoint
+
+@AndroidEntryPoint
+class NaviConfigurationActivity : ComponentActivity() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        setContent {
+            NaviConfigurationScreen(
+                onDevClick = { setUrlOnClick(DEV) },
+                isDevEnabled = isButtonEnabled(DEV),
+                onQaClick = { setUrlOnClick(QA) },
+                isQaEnabled = isButtonEnabled(QA),
+                onVersionCodeChange = { BaseUtils.saveUpdatedVersionCodeAndRestart(it, this) },
+                onBaseUrlChanged = { BaseUtils.saveUpdatedBaseUrlAndRestart(it, this) },
+                onBackButtonClick = { finish() }
+            )
+        }
+    }
+
+    private fun isButtonEnabled(id: String): Boolean {
+        if (BaseUtils.getUpdatedBaseUrl().isNull())
+            return (getBaseUrlFromId(id) == BuildConfig.BASE_URL).not()
+        return (BaseUtils.getUpdatedBaseUrl() == getBaseUrlFromId(id)).not()
+    }
+
+    private fun getBaseUrlFromId(id: String): String {
+        return when (id) {
+            DEV -> "https://dev-sa.navi.com/"
+            QA -> "https://qa-sa.navi.com/"
+            else -> BuildConfig.BASE_URL
+        }
+    }
+
+    private fun setUrlOnClick(text: CharSequence?) {
+        BaseUtils.saveUpdatedBaseUrlAndRestart(getBaseUrlFromId(text.toString()), this)
+    }
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviButton.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviButton.kt
@@ -0,0 +1,63 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Button
+import androidx.compose.material.ButtonDefaults
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.navi.design.font.FontWeightEnum
+import com.navi.design.theme.FF1F002A
+import com.navi.design.theme.GreyA3A3AB
+import com.navi.design.theme.WhiteFFFFFF
+import com.navi.design.theme.composeFontFamily
+import com.navi.design.theme.getFontWeight
+
+@Composable
+internal fun NaviButton(
+    title: String,
+    onButtonClick: () -> Unit,
+    isSelected: Boolean = true,
+) {
+    Button(
+        contentPadding = PaddingValues(horizontal = 24.dp, vertical = 10.dp),
+        onClick = onButtonClick,
+        shape = RoundedCornerShape(size = 4.dp),
+        enabled = isSelected,
+        colors =
+            ButtonDefaults.buttonColors(
+                backgroundColor = FF1F002A,
+                contentColor = WhiteFFFFFF,
+                disabledBackgroundColor = GreyA3A3AB,
+                disabledContentColor = WhiteFFFFFF,
+            )
+    ) {
+        Text(
+            text = title,
+            fontSize = 14.sp,
+            color = WhiteFFFFFF,
+            fontFamily = composeFontFamily,
+            fontWeight = getFontWeight(FontWeightEnum.TT_MEDIUM),
+        )
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviButtonPreview() {
+    NaviButton(
+        onButtonClick = {},
+        title = "Button Title",
+        isSelected = true,
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviConfigurationScreen.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviConfigurationScreen.kt
@@ -0,0 +1,98 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.navi.base.utils.EMPTY
+
+@Composable
+fun NaviConfigurationScreen(
+    onDevClick: () -> Unit,
+    isDevEnabled: Boolean,
+    onQaClick: () -> Unit,
+    isQaEnabled: Boolean,
+    onVersionCodeChange: (versionCode: String) -> Unit,
+    onBaseUrlChanged: (baseUrl: String) -> Unit,
+    onBackButtonClick: () -> Unit,
+) {
+    var versionCode by remember { mutableStateOf(TextFieldValue(EMPTY)) }
+    var baseUrl by remember { mutableStateOf(TextFieldValue(EMPTY)) }
+
+    Column {
+        NaviTopNavigationBar(onBackButtonClick = onBackButtonClick)
+
+        Column(modifier = Modifier.verticalScroll(state = rememberScrollState())) {
+            NaviHeaderView(
+                titleText = "Navi Configuration",
+                subtitleText = "Change Environment, Version Code, & Base URL on the fly",
+            )
+
+            Spacer(modifier = Modifier.height(6.dp))
+
+            NaviToggleButtonsWithTitle(
+                titleText = "Environment",
+                firstButtonTitleText = "DEV",
+                onFirstButtonClick = onDevClick,
+                isFirstButtonSelected = isDevEnabled,
+                secondButtonTitleText = "QA",
+                onSecondButtonClick = onQaClick,
+                isSecondButtonSelected = isQaEnabled,
+            )
+
+            NaviTextFieldWithTitleAndButton(
+                titleText = "Version Code",
+                placeholderText = "Enter version code here",
+                keyboardType = KeyboardType.Number,
+                inputText = versionCode,
+                onTextValueChanged = { versionCode = it },
+                buttonText = "Update",
+                onButtonClick = { onVersionCodeChange(versionCode.text) },
+            )
+
+            NaviTextFieldWithTitleAndButton(
+                titleText = "Base URL",
+                placeholderText = "Enter base url here",
+                keyboardType = KeyboardType.Uri,
+                inputText = baseUrl,
+                onTextValueChanged = { baseUrl = it },
+                buttonText = "Update",
+                onButtonClick = { onBaseUrlChanged(baseUrl.text) },
+            )
+
+            Spacer(modifier = Modifier.height(12.dp))
+        }
+    }
+}
+
+@Preview(showSystemUi = true, showBackground = true)
+@Composable
+private fun NaviConfigurationScreenPreview() {
+    NaviConfigurationScreen(
+        onDevClick = {},
+        isDevEnabled = true,
+        onQaClick = {},
+        isQaEnabled = false,
+        onVersionCodeChange = {},
+        onBaseUrlChanged = {},
+        onBackButtonClick = {}
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviHeaderView.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviHeaderView.kt
@@ -0,0 +1,68 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.navi.design.font.FontWeightEnum
+import com.navi.design.theme.Black1A1A1A
+import com.navi.design.theme.Grey6B6B6B
+import com.navi.design.theme.composeFontFamily
+import com.navi.design.theme.getFontWeight
+
+@Composable
+internal fun NaviHeaderView(
+    titleText: String,
+    subtitleText: String,
+) {
+    Column(
+        modifier =
+            Modifier.fillMaxWidth()
+                .padding(
+                    start = 16.dp,
+                    end = 16.dp,
+                    top = 8.dp,
+                )
+    ) {
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = titleText,
+            fontSize = 24.sp,
+            color = Black1A1A1A,
+            fontFamily = composeFontFamily,
+            fontWeight = getFontWeight(FontWeightEnum.TT_MEDIUM),
+        )
+        Spacer(modifier = Modifier.height(4.dp))
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = subtitleText,
+            fontSize = 12.sp,
+            color = Grey6B6B6B,
+            fontFamily = composeFontFamily,
+            fontWeight = getFontWeight(FontWeightEnum.TT_MEDIUM),
+        )
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviHeaderViewPreview() {
+    NaviHeaderView(
+        titleText = "Header Title",
+        subtitleText = "Header Subtitle",
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviOutlinedTextField.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviOutlinedTextField.kt
@@ -0,0 +1,101 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.OutlinedTextField
+import androidx.compose.material.Text
+import androidx.compose.material.TextFieldDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardCapitalization
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.navi.base.utils.EMPTY
+import com.navi.design.font.FontWeightEnum
+import com.navi.design.theme.FF191919
+import com.navi.design.theme.FF1F002A
+import com.navi.design.theme.FFA8A8A8
+import com.navi.design.theme.GreyE3E5E5
+import com.navi.design.theme.WhiteFFFFFF
+import com.navi.design.theme.composeFontFamily
+import com.navi.design.theme.getFontWeight
+
+@Composable
+internal fun NaviOutlinedTextField(
+    placeholderText: String,
+    inputText: TextFieldValue,
+    keyboardType: KeyboardType = KeyboardType.Text,
+    onTextValueChanged: (TextFieldValue) -> Unit,
+    onDone: () -> Unit,
+) {
+    OutlinedTextField(
+        modifier =
+            Modifier.fillMaxWidth()
+                .border(
+                    width = 1.dp,
+                    color = GreyE3E5E5,
+                    shape = RoundedCornerShape(size = 8.dp),
+                ),
+        value = inputText,
+        placeholder = {
+            Text(
+                text = placeholderText,
+                fontSize = 14.sp,
+                color = FFA8A8A8,
+                fontFamily = composeFontFamily,
+                fontWeight = getFontWeight(FontWeightEnum.TT_REGULAR),
+            )
+        },
+        onValueChange = { onTextValueChanged(it) },
+        singleLine = true,
+        colors =
+            TextFieldDefaults.outlinedTextFieldColors(
+                focusedBorderColor = Color.Unspecified,
+                unfocusedBorderColor = Color.Unspecified,
+                cursorColor = FF1F002A,
+                backgroundColor = WhiteFFFFFF,
+            ),
+        textStyle =
+            TextStyle(
+                fontSize = 14.sp,
+                color = FF191919,
+                fontFamily = composeFontFamily,
+                fontWeight = getFontWeight(FontWeightEnum.TT_REGULAR),
+            ),
+        keyboardOptions =
+            KeyboardOptions(
+                capitalization = KeyboardCapitalization.None,
+                autoCorrect = false,
+                keyboardType = keyboardType,
+                imeAction = ImeAction.Done,
+            ),
+        keyboardActions = KeyboardActions(onDone = { onDone() }),
+    )
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviOutlinedTextFieldPreview() {
+    NaviOutlinedTextField(
+        placeholderText = "Enter your input here",
+        inputText = TextFieldValue(EMPTY),
+        onTextValueChanged = {},
+        onDone = {}
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviTextFieldWithTitleAndButton.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviTextFieldWithTitleAndButton.kt
@@ -0,0 +1,84 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.navi.base.utils.EMPTY
+import com.navi.design.font.FontWeightEnum
+import com.navi.design.theme.Black1A1A1A
+import com.navi.design.theme.composeFontFamily
+import com.navi.design.theme.getFontWeight
+
+@Composable
+internal fun NaviTextFieldWithTitleAndButton(
+    titleText: String,
+    placeholderText: String,
+    keyboardType: KeyboardType = KeyboardType.Text,
+    inputText: TextFieldValue,
+    onTextValueChanged: (TextFieldValue) -> Unit,
+    buttonText: String,
+    onButtonClick: () -> Unit,
+) {
+    Column(
+        modifier =
+            Modifier.fillMaxWidth()
+                .padding(
+                    start = 16.dp,
+                    end = 16.dp,
+                    top = 24.dp,
+                ),
+    ) {
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = titleText,
+            fontSize = 16.sp,
+            color = Black1A1A1A,
+            fontFamily = composeFontFamily,
+            fontWeight = getFontWeight(FontWeightEnum.TT_MEDIUM),
+        )
+        Spacer(modifier = Modifier.height(8.dp))
+        NaviOutlinedTextField(
+            placeholderText = placeholderText,
+            inputText = inputText,
+            keyboardType = keyboardType,
+            onTextValueChanged = onTextValueChanged,
+            onDone = onButtonClick
+        )
+        Spacer(modifier = Modifier.height(6.dp))
+        NaviButton(
+            title = buttonText,
+            onButtonClick = onButtonClick,
+        )
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviTextFieldWithTitleAndButtonPreview() {
+    NaviTextFieldWithTitleAndButton(
+        titleText = "Label",
+        placeholderText = "Enter your input here",
+        keyboardType = KeyboardType.Text,
+        inputText = TextFieldValue(EMPTY),
+        onTextValueChanged = {},
+        buttonText = "Update",
+        onButtonClick = {},
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviToggleButtonsWithTitle.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviToggleButtonsWithTitle.kt
@@ -0,0 +1,86 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.navi.design.font.FontWeightEnum
+import com.navi.design.theme.Black1A1A1A
+import com.navi.design.theme.composeFontFamily
+import com.navi.design.theme.getFontWeight
+
+@Composable
+internal fun NaviToggleButtonsWithTitle(
+    titleText: String,
+    firstButtonTitleText: String,
+    onFirstButtonClick: () -> Unit,
+    isFirstButtonSelected: Boolean,
+    secondButtonTitleText: String,
+    onSecondButtonClick: () -> Unit,
+    isSecondButtonSelected: Boolean,
+) {
+    Column(
+        modifier =
+            Modifier.fillMaxWidth()
+                .padding(
+                    start = 16.dp,
+                    end = 16.dp,
+                    top = 24.dp,
+                )
+    ) {
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = titleText,
+            fontSize = 16.sp,
+            color = Black1A1A1A,
+            fontFamily = composeFontFamily,
+            fontWeight = getFontWeight(FontWeightEnum.TT_MEDIUM),
+        )
+        Spacer(modifier = Modifier.height(6.dp))
+        Row {
+            NaviButton(
+                title = firstButtonTitleText,
+                onButtonClick = onFirstButtonClick,
+                isSelected = isFirstButtonSelected,
+            )
+
+            Spacer(modifier = Modifier.width(10.dp))
+
+            NaviButton(
+                title = secondButtonTitleText,
+                onButtonClick = onSecondButtonClick,
+                isSelected = isSecondButtonSelected,
+            )
+        }
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviToggleButtonsWithTitlePreview() {
+    NaviToggleButtonsWithTitle(
+        titleText = "Label",
+        firstButtonTitleText = "Button One",
+        onFirstButtonClick = {},
+        isFirstButtonSelected = true,
+        secondButtonTitleText = "Button Two",
+        onSecondButtonClick = {},
+        isSecondButtonSelected = false,
+    )
+}
--- a/app/src/main/java/com/naviapp/configuration/composable/NaviTopNavigationBar.kt
+++ b/app/src/main/java/com/naviapp/configuration/composable/NaviTopNavigationBar.kt
@@ -0,0 +1,47 @@
+/*
+ *
+ *  * Copyright © 2023 by Navi Technologies Limited
+ *  * All rights reserved. Strictly confidential
+ *
+ */
+
+package com.naviapp.configuration.composable
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.naviapp.R
+
+@Composable
+internal fun NaviTopNavigationBar(onBackButtonClick: () -> Unit) {
+    Row(
+        modifier = Modifier.fillMaxWidth().padding(all = 16.dp),
+    ) {
+        Image(
+            painter = painterResource(id = R.drawable.ic_back_arrow_black),
+            contentDescription = null,
+            modifier =
+                Modifier.clickable(
+                    interactionSource = remember { MutableInteractionSource() },
+                    indication = null,
+                ) {
+                    onBackButtonClick()
+                },
+        )
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun NaviTopNavigationBarPreview() {
+    NaviTopNavigationBar(onBackButtonClick = {})
+}
--- a/app/src/main/java/com/naviapp/home/activity/DevSettingsActivity.kt
+++ b/app/src/main/java/com/naviapp/home/activity/DevSettingsActivity.kt
@@ -1,63 +0,0 @@
-package com.naviapp.home.activity
-
-import android.os.Bundle
-import androidx.activity.ComponentActivity
-import androidx.activity.compose.setContent
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.ui.Modifier
-import com.navi.base.utils.*
-import com.naviapp.BuildConfig
-import com.naviapp.home.composables.DevSettingsScreen
-import dagger.hilt.android.AndroidEntryPoint
-
-@AndroidEntryPoint
-class DevSettingsActivity : ComponentActivity() {
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        setContent {
-            MaterialTheme {
-                Surface(
-                    modifier = Modifier.fillMaxSize(),
-                    color = MaterialTheme.colors.background
-                ) {
-                    DevSettingsScreen(
-                        onDevClick = {
-                            setUrlOnClick(DEV)
-                        },
-                        isDevEnabled = isButtonEnabled(DEV),
-                        onQaClick = {
-                            setUrlOnClick(QA)
-                        },
-                        isQaEnabled = isButtonEnabled(QA),
-                        onVersionCodeChange = {
-                            BaseUtils.saveUpdatedVersionCodeAndRestart(it, this)
-                        },
-                        onUrlChanged = {
-                            BaseUtils.saveUpdatedBaseUrlAndRestart(it, this)
-                        }
-                    )
-                }
-            }
-        }
-    }
-
-    private fun isButtonEnabled(id: String): Boolean {
-        if (BaseUtils.getUpdatedBaseUrl().isNull())
-            return (getBaseUrlFromId(id) == BuildConfig.BASE_URL).not()
-        return (BaseUtils.getUpdatedBaseUrl() == getBaseUrlFromId(id)).not()
-    }
-
-    private fun getBaseUrlFromId(id: String): String {
-        return when(id) {
-            DEV -> BuildConfig.BASE_URL_DEV
-            QA -> BuildConfig.BASE_URL_QA
-            else -> BuildConfig.BASE_URL
-        }
-    }
-
-    private fun setUrlOnClick(text: CharSequence?) {
-        BaseUtils.saveUpdatedBaseUrlAndRestart(getBaseUrlFromId(text.toString()), this)
-    }
-}
--- a/app/src/main/java/com/naviapp/home/composables/DevSettingsComposable.kt
+++ b/app/src/main/java/com/naviapp/home/composables/DevSettingsComposable.kt
@@ -1,69 +0,0 @@
-package com.naviapp.home.composables
-
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.OutlinedTextField
-import androidx.compose.material.Text
-import androidx.compose.runtime.*
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.input.TextFieldValue
-import androidx.compose.ui.unit.dp
-
-@Composable
-fun DevSettingsScreen(
-    onDevClick: () -> Unit,
-    isDevEnabled: Boolean,
-    onQaClick: () -> Unit,
-    isQaEnabled: Boolean,
-    onVersionCodeChange: (versionCode: String) -> Unit,
-    onUrlChanged: (url: String) -> Unit
-) {
-    var text by remember { mutableStateOf(TextFieldValue("")) }
-    var url by remember { mutableStateOf(TextFieldValue("")) }
-    Column(modifier = Modifier.padding(20.dp, 40.dp, 20.dp, 20.dp)) {
-        Text(
-            text = "Change Environment",
-            color = MaterialTheme.colors.onBackground,
-            style = MaterialTheme.typography.subtitle1
-        )
-        Row {
-            RoundedCornerButton(
-                onButtonClick = onDevClick,
-                title = "Dev",
-                isSelected = isDevEnabled
-            )
-            RoundedCornerButton(
-                onButtonClick = onQaClick,
-                title = "Qa",
-                isSelected = isQaEnabled
-            )
-        }
-        Text(
-            text = "Change Version Code",
-            color = MaterialTheme.colors.onBackground,
-            style = MaterialTheme.typography.subtitle1
-        )
-        OutLineTextFieldSample(label = "Version Code", text = text, onTextValueChanged = {
-            text = it
-        })
-        RoundedCornerButton(onButtonClick = {
-            onVersionCodeChange(text.text)
-        }, title = "Update", isSelected = true)
-
-        Text(
-            text = "Change Url",
-            color = MaterialTheme.colors.onBackground,
-            style = MaterialTheme.typography.subtitle1
-        )
-        OutLineTextFieldSample(label = "Enter endpoint here", text = url, onTextValueChanged = {
-            url = it
-        })
-        RoundedCornerButton(onButtonClick = {
-            onUrlChanged(url.text)
-        }, title = "Update", isSelected = true)
-    }
-}
--- a/app/src/main/java/com/naviapp/home/composables/OutLineTextFieldSample.kt
+++ b/app/src/main/java/com/naviapp/home/composables/OutLineTextFieldSample.kt
@@ -1,25 +0,0 @@
-package com.naviapp.home.composables
-
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material.OutlinedTextField
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.input.TextFieldValue
-import androidx.compose.ui.unit.dp
-
-@Composable
-fun OutLineTextFieldSample(
-    label: String,
-    text: TextFieldValue,
-    onTextValueChanged: (TextFieldValue) -> Unit
-) {
-    OutlinedTextField(
-        value = text,
-        label = { Text(text = label) },
-        onValueChange = {
-            onTextValueChanged(it)
-        },
-        modifier = Modifier.padding(10.dp, 10.dp, 10.dp, 0.dp)
-    )
-}
--- a/app/src/main/java/com/naviapp/home/composables/RoundedCornerButton.kt
+++ b/app/src/main/java/com/naviapp/home/composables/RoundedCornerButton.kt
@@ -1,21 +0,0 @@
-package com.naviapp.home.composables
-
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-
-@Composable
-fun RoundedCornerButton(onButtonClick: () -> Unit, title: String, isSelected: Boolean = true) {
-    Button(
-        onClick = onButtonClick,
-        shape = RoundedCornerShape(20.dp),
-        modifier = Modifier.padding(10.dp),
-        enabled = isSelected
-    ) {
-        Text(text = title)
-    }
-}
--- a/navi-design/src/main/java/com/navi/design/theme/Color.kt
+++ b/navi-design/src/main/java/com/navi/design/theme/Color.kt
@@ -23,3 +23,6 @@ val Grey6B6B6B = Color(0xFF6B6B6B)
 val Green22A940 = Color(0xFF22A940)
 val WhiteFAFAFA = Color(0xFFFAFAFA)
 val FFFF5732 = Color(0xFFFF5732)
+val FF1F002A = Color(0xFF1F002A)
+val FFA8A8A8 = Color(0xFFA8A8A8)
+val FF191919 = Color(0xFF191919)