Revamped the whole Profile Screen

uncrack-vault · May 14, 2024 · ec8de93 · ec8de93
1 parent acf6169
commit ec8de93
Show file tree

Hide file tree

Showing 9 changed files with 263 additions and 53 deletions.
diff --git a/app/src/main/java/com/geekymusketeers/uncrack/components/ProfileContainer.kt b/app/src/main/java/com/geekymusketeers/uncrack/components/ProfileContainer.kt
@@ -31,7 +31,7 @@ fun ProfileContainer(
             contentDescription = null,
             contentScale = ContentScale.Crop,
             modifier = modifier
-                .size(120.dp)
+                .size(100.dp)
                 .clip(CircleShape)
         )
 

diff --git a/app/src/main/java/com/geekymusketeers/uncrack/components/SettingsItemGroup.kt b/app/src/main/java/com/geekymusketeers/uncrack/components/SettingsItemGroup.kt
@@ -0,0 +1,31 @@
+package com.geekymusketeers.uncrack.components
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.unit.dp
+import com.geekymusketeers.uncrack.ui.theme.BackgroundLight
+
+@Composable
+fun SettingsItemGroup(
+    modifier: Modifier = Modifier,
+    columnScope: @Composable ColumnScope.() -> Unit
+) {
+    Column(
+        modifier = modifier
+            .widthIn(max = 500.dp)
+            .padding(start = 12.dp, end = 12.dp)
+            .clip(RoundedCornerShape(8.dp))
+            .background(BackgroundLight),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        columnScope()
+    }
+}
diff --git a/app/src/main/java/com/geekymusketeers/uncrack/components/UCSettingsCard.kt b/app/src/main/java/com/geekymusketeers/uncrack/components/UCSettingsCard.kt
@@ -0,0 +1,50 @@
+package com.geekymusketeers.uncrack.components
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.geekymusketeers.uncrack.R
+import com.geekymusketeers.uncrack.ui.theme.medium18
+import com.geekymusketeers.uncrack.ui.theme.normal16
+import com.geekymusketeers.uncrack.ui.theme.normal18
+import com.geekymusketeers.uncrack.ui.theme.normal20
+
+@Composable
+fun UCSettingsCard(
+    itemName: String,
+    iconId: Int,
+    modifier: Modifier = Modifier,
+    onClick: () -> Unit
+) {
+    Row(
+        modifier = modifier
+            .fillMaxWidth()
+            .padding(16.dp)
+            .clickable { onClick() },
+        horizontalArrangement = Arrangement.spacedBy(12.dp, Alignment.Start),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        Icon(
+            modifier = Modifier.size(26.dp),
+            painter = painterResource(iconId),
+            contentDescription = stringResource(R.string.icon),
+        )
+        Text(
+            text = itemName,
+            style = medium18.copy(Color.Black)
+        )
+    }
+}
diff --git a/app/src/main/java/com/geekymusketeers/uncrack/navigation/Navigation.kt b/app/src/main/java/com/geekymusketeers/uncrack/navigation/Navigation.kt
@@ -87,6 +87,7 @@ fun Navigation(
         Screen.UpdateMasterKeyScreen.name,
         Screen.PasswordGeneratorScreen.name,
         Screen.CategoryScreen.name,
+        Screen.AccountScreen.name,
         "${Screen.ViewPasswordScreen.name}/{id}",
         Screen.PasswordHealthScreen.name
     )
@@ -192,6 +193,7 @@ fun Navigation(
 
             composable(route = Screen.ProfileScreen.name) {
                 ProfileScreen(
+                    navController,
                     userViewModel
                 )
             }

diff --git a/app/src/main/java/com/geekymusketeers/uncrack/presentation/account/profile/ProfileScreen.kt b/app/src/main/java/com/geekymusketeers/uncrack/presentation/account/profile/ProfileScreen.kt
@@ -1,8 +1,12 @@
 package com.geekymusketeers.uncrack.presentation.account.profile
 
+import android.content.Intent
+import android.net.Uri
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -12,90 +16,164 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavHostController
+import com.geekymusketeers.uncrack.BuildConfig
 import com.geekymusketeers.uncrack.R
 import com.geekymusketeers.uncrack.components.ProfileContainer
+import com.geekymusketeers.uncrack.components.SettingsItemGroup
 import com.geekymusketeers.uncrack.components.UCButton
+import com.geekymusketeers.uncrack.components.UCSettingsCard
 import com.geekymusketeers.uncrack.components.UCTextField
 import com.geekymusketeers.uncrack.components.UCTopAppBar
+import com.geekymusketeers.uncrack.navigation.Screen
+import com.geekymusketeers.uncrack.sharedViewModel.UserViewModel
+import com.geekymusketeers.uncrack.ui.theme.BackgroundLight
+import com.geekymusketeers.uncrack.ui.theme.OnPrimaryContainerLight
+import com.geekymusketeers.uncrack.ui.theme.OnSurfaceLight
+import com.geekymusketeers.uncrack.ui.theme.SurfaceTintLight
+import com.geekymusketeers.uncrack.ui.theme.SurfaceVariantLight
+import com.geekymusketeers.uncrack.ui.theme.medium22
+import com.geekymusketeers.uncrack.ui.theme.medium32
+import com.geekymusketeers.uncrack.ui.theme.normal14
+import com.geekymusketeers.uncrack.util.Constants
+import com.geekymusketeers.uncrack.util.Util
 
-@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun ProfileScreen(
+    navHostController: NavHostController,
+    userViewModel: UserViewModel,
     modifier: Modifier = Modifier
 ) {
 
-    Scaffold(
-        topBar = {
-            UCTopAppBar(
-                title = "Profile",
-                colors = TopAppBarDefaults.topAppBarColors(
-                    Color.White
-                )
-            )
-        }
-    ) { paddingValues ->
-
-        Box(
-            modifier = modifier
-                .fillMaxSize()
-                .background(Color.White)
-                .padding(paddingValues)
-                .padding(bottom = 20.dp)
-                .imePadding()
+    val context = LocalContext.current
+    val userData = userViewModel.state.value
+
+    Column(
+        modifier = modifier
+            .fillMaxSize()
+            .background(SurfaceVariantLight),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(BackgroundLight)
+                .padding(16.dp),
+            verticalAlignment = Alignment.CenterVertically
         ) {
+
             Column(
                 modifier = Modifier
-                    .fillMaxSize()
-                    .verticalScroll(rememberScrollState()),
+                    .fillMaxWidth()
+                    .padding(16.dp),
                 horizontalAlignment = Alignment.CenterHorizontally
             ) {
-
                 ProfileContainer {
-
                 }
 
-                Spacer(modifier = Modifier.height(20.dp))
+                Spacer(modifier = Modifier.height(22.dp))
 
-                UCTextField(
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .padding(20.dp, 0.dp),
-                    headerText = "Name",
-                    hintText = stringResource(id = R.string.name_hint),
-                    value = "",
-                    onValueChange = {}
+                Text(
+                    text = userData.email,
+                    style = medium22.copy(color = OnSurfaceLight)
                 )
+            }
+        }
 
-                Spacer(modifier = Modifier.height(20.dp))
+        Spacer(modifier = Modifier.height(20.dp))
 
-                UCTextField(
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .padding(20.dp, 0.dp),
-                    headerText = "Email",
-                    hintText = stringResource(id = R.string.email_hint),
-                    value = "",
-                    onValueChange = {}
-                )
+        SettingsItemGroup {
+            UCSettingsCard(
+                itemName = stringResource(id = R.string.settings),
+                iconId = R.drawable.settings_new,
+                onClick = {
+                    navHostController.navigate(Screen.AccountScreen.name)
+                }
+            )
 
-                Spacer(modifier = Modifier.weight(1f))
+            HorizontalDivider(
+                thickness = 2.dp,
+                color = SurfaceVariantLight
+            )
 
-                UCButton(
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .padding(16.dp,0.dp),
-                    text = stringResource(id = R.string.save),
-                    onClick = {}
-                )
-            }
+            UCSettingsCard(
+                itemName = "Import",
+                iconId = R.drawable.import_icon,
+                onClick = {
+
+                }
+            )
+
+            HorizontalDivider(
+                thickness = 2.dp,
+                color = SurfaceVariantLight
+            )
+
+            UCSettingsCard(
+                itemName = stringResource(R.string.help),
+                iconId = R.drawable.help,
+                onClick = {
+
+                }
+            )
         }
+
+        Spacer(modifier = Modifier.height(30.dp))
+
+        SettingsItemGroup {
+            UCSettingsCard(
+                itemName = stringResource(R.string.rate_uncrack),
+                iconId = R.drawable.rating,
+                onClick = {
+                    val intent = Intent(Intent.ACTION_VIEW)
+                    intent.data = Uri.parse(Util.PLAYSTORE_URL)
+                    context.startActivity(intent)
+                }
+            )
+
+            HorizontalDivider(
+                thickness = 2.dp,
+                color = SurfaceVariantLight
+            )
+
+            UCSettingsCard(
+                itemName = stringResource(R.string.invite_friends),
+                iconId = R.drawable.share_app,
+                onClick = {
+                    val sendIntent = Intent(Intent.ACTION_SEND).apply {
+                        putExtra(Intent.EXTRA_TEXT, Constants.INVITE)
+                        type = "text/plain"
+                    }
+                    val shareIntent = Intent.createChooser(sendIntent, null)
+                    context.startActivity(shareIntent)
+                }
+            )
+        }
+
+        Spacer(modifier = Modifier.weight(1f))
+
+        Text(
+            modifier = Modifier.padding(top = 20.dp, bottom = 10.dp),
+            text = "Version: ${BuildConfig.VERSION_NAME} (${BuildConfig.VERSION_CODE})",
+            style = normal14.copy(color = SurfaceTintLight)
+        )
+        Text(
+            modifier = Modifier.padding(bottom = 150.dp),
+            text = stringResource(R.string.by_aritra_das),
+            style = normal14.copy(color = SurfaceTintLight)
+        )
+
     }
-}
+}
diff --git a/app/src/main/res/drawable/help.xml b/app/src/main/res/drawable/help.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M11.95,18C12.3,18 12.596,17.879 12.838,17.637C13.08,17.395 13.201,17.099 13.2,16.75C13.199,16.401 13.079,16.105 12.838,15.862C12.597,15.619 12.301,15.499 11.95,15.5C11.599,15.501 11.303,15.622 11.063,15.863C10.823,16.104 10.702,16.399 10.7,16.75C10.698,17.101 10.819,17.397 11.063,17.638C11.307,17.879 11.603,18 11.95,18ZM11.05,14.15H12.9C12.9,13.6 12.963,13.167 13.088,12.85C13.213,12.533 13.567,12.1 14.15,11.55C14.583,11.117 14.925,10.704 15.175,10.312C15.425,9.92 15.55,9.449 15.55,8.9C15.55,7.967 15.208,7.25 14.525,6.75C13.842,6.25 13.033,6 12.1,6C11.15,6 10.379,6.25 9.788,6.75C9.197,7.25 8.784,7.85 8.55,8.55L10.2,9.2C10.283,8.9 10.471,8.575 10.763,8.225C11.055,7.875 11.501,7.7 12.1,7.7C12.633,7.7 13.033,7.846 13.3,8.138C13.567,8.43 13.7,8.751 13.7,9.1C13.7,9.433 13.6,9.746 13.4,10.038C13.2,10.33 12.95,10.601 12.65,10.85C11.917,11.5 11.467,11.992 11.3,12.325C11.133,12.658 11.05,13.267 11.05,14.15ZM12,22C10.617,22 9.317,21.738 8.1,21.213C6.883,20.688 5.825,19.976 4.925,19.075C4.025,18.174 3.313,17.116 2.788,15.9C2.263,14.684 2.001,13.384 2,12C1.999,10.616 2.262,9.316 2.788,8.1C3.314,6.884 4.026,5.826 4.925,4.925C5.824,4.024 6.882,3.312 8.1,2.788C9.318,2.264 10.618,2.001 12,2C13.382,1.999 14.682,2.261 15.9,2.788C17.118,3.315 18.176,4.027 19.075,4.925C19.974,5.823 20.686,6.881 21.213,8.1C21.74,9.319 22.002,10.619 22,12C21.998,13.381 21.735,14.681 21.212,15.9C20.689,17.119 19.976,18.177 19.075,19.075C18.174,19.973 17.115,20.686 15.9,21.213C14.685,21.74 13.385,22.003 12,22ZM12,20C14.233,20 16.125,19.225 17.675,17.675C19.225,16.125 20,14.233 20,12C20,9.767 19.225,7.875 17.675,6.325C16.125,4.775 14.233,4 12,4C9.767,4 7.875,4.775 6.325,6.325C4.775,7.875 4,9.767 4,12C4,14.233 4.775,16.125 6.325,17.675C7.875,19.225 9.767,20 12,20Z"
+      android:fillColor="#000000"/>
+</vector>
diff --git a/app/src/main/res/drawable/import_icon.xml b/app/src/main/res/drawable/import_icon.xml
@@ -0,0 +1,20 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,3V15M12,15L8,11M12,15L16,11"
+      android:strokeLineJoin="round"
+      android:strokeWidth="2"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"
+      android:strokeLineCap="round"/>
+  <path
+      android:pathData="M8,5H4C3.47,5 2.961,5.211 2.586,5.586C2.211,5.961 2,6.47 2,7V17C2,17.53 2.211,18.039 2.586,18.414C2.961,18.789 3.47,19 4,19H20C20.53,19 21.039,18.789 21.414,18.414C21.789,18.039 22,17.53 22,17V7C22,6.47 21.789,5.961 21.414,5.586C21.039,5.211 20.53,5 20,5H16"
+      android:strokeLineJoin="round"
+      android:strokeWidth="2"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"
+      android:strokeLineCap="round"/>
+</vector>
diff --git a/app/src/main/res/drawable/settings_new.xml b/app/src/main/res/drawable/settings_new.xml
@@ -0,0 +1,16 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,15C13.657,15 15,13.657 15,12C15,10.343 13.657,9 12,9C10.343,9 9,10.343 9,12C9,13.657 10.343,15 12,15Z"
+      android:strokeWidth="1.5"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"/>
+  <path
+      android:pathData="M13.765,2.152C13.398,2 12.932,2 12,2C11.068,2 10.602,2 10.235,2.152C9.992,2.253 9.772,2.4 9.586,2.586C9.4,2.772 9.252,2.992 9.152,3.235C9.06,3.458 9.023,3.719 9.009,4.098C9.003,4.372 8.927,4.64 8.789,4.877C8.651,5.113 8.455,5.311 8.219,5.451C7.98,5.585 7.711,5.656 7.437,5.657C7.162,5.659 6.892,5.591 6.652,5.459C6.316,5.281 6.073,5.183 5.832,5.151C5.306,5.082 4.775,5.224 4.354,5.547C4.04,5.79 3.806,6.193 3.34,7C2.874,7.807 2.64,8.21 2.589,8.605C2.555,8.865 2.572,9.13 2.64,9.384C2.708,9.638 2.825,9.876 2.985,10.084C3.133,10.276 3.34,10.437 3.661,10.639C4.134,10.936 4.438,11.442 4.438,12C4.438,12.558 4.134,13.064 3.661,13.36C3.34,13.563 3.132,13.724 2.985,13.916C2.825,14.124 2.708,14.362 2.64,14.616C2.572,14.87 2.555,15.134 2.589,15.395C2.641,15.789 2.874,16.193 3.339,17C3.806,17.807 4.039,18.21 4.354,18.453C4.562,18.613 4.8,18.73 5.054,18.798C5.308,18.866 5.573,18.883 5.833,18.849C6.073,18.817 6.316,18.719 6.652,18.541C6.892,18.409 7.162,18.341 7.437,18.343C7.711,18.344 7.98,18.415 8.219,18.549C8.702,18.829 8.989,19.344 9.009,19.902C9.023,20.282 9.059,20.542 9.152,20.765C9.252,21.008 9.4,21.228 9.586,21.414C9.772,21.6 9.992,21.747 10.235,21.848C10.602,22 11.068,22 12,22C12.932,22 13.398,22 13.765,21.848C14.008,21.747 14.228,21.6 14.414,21.414C14.6,21.228 14.747,21.008 14.848,20.765C14.94,20.542 14.977,20.282 14.991,19.902C15.011,19.344 15.298,18.828 15.781,18.549C16.02,18.415 16.289,18.344 16.563,18.343C16.837,18.341 17.108,18.409 17.348,18.541C17.684,18.719 17.927,18.817 18.167,18.849C18.427,18.883 18.692,18.866 18.946,18.798C19.2,18.73 19.438,18.613 19.646,18.453C19.961,18.211 20.194,17.807 20.66,17C21.126,16.193 21.36,15.79 21.411,15.395C21.445,15.134 21.428,14.87 21.36,14.616C21.292,14.362 21.175,14.124 21.015,13.916C20.867,13.724 20.66,13.563 20.339,13.361C20.105,13.219 19.91,13.019 19.775,12.781C19.639,12.543 19.566,12.274 19.562,12C19.562,11.442 19.866,10.936 20.339,10.64C20.66,10.437 20.868,10.276 21.015,10.084C21.175,9.876 21.292,9.638 21.36,9.384C21.428,9.13 21.445,8.865 21.411,8.605C21.359,8.211 21.126,7.807 20.661,7C20.194,6.193 19.961,5.79 19.646,5.547C19.438,5.387 19.2,5.27 18.946,5.202C18.692,5.134 18.427,5.117 18.167,5.151C17.927,5.183 17.684,5.281 17.347,5.459C17.107,5.59 16.837,5.659 16.563,5.657C16.289,5.656 16.02,5.585 15.781,5.451C15.545,5.311 15.349,5.113 15.211,4.877C15.073,4.64 14.997,4.372 14.991,4.098C14.977,3.718 14.941,3.458 14.848,3.235C14.747,2.992 14.6,2.772 14.414,2.586C14.228,2.4 14.008,2.253 13.765,2.152Z"
+      android:strokeWidth="1.5"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"/>
+</vector>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -207,6 +207,10 @@
     <string name="you_will_be_using_master_password_as_a_key_to_unlock_your_passwords">You will be using Master Password as a key to unlock your passwords</string>
     <string name="create_master_password">Create Master Password</string>
     <string name="kindly_provide_your_master_password">Kindly provide your Master Password</string>
+    <string name="icon">icon\n</string>
+    <string name="help">Help</string>
+    <string name="rate_uncrack">Rate UnCrack</string>
+    <string name="invite_friends">Invite Friends</string>
     <string-array name="accounts">
         <item>Others</item>
         <item>PayPal</item>