Skip to content

Commit 3d3d97d

Browse files
Enhance UI components with Material3 updates and improve search functionality (#90)
1 parent 7c3a476 commit 3d3d97d

File tree

3 files changed

+268
-206
lines changed

3 files changed

+268
-206
lines changed

app/src/main/java/com/yogeshpaliyal/deepr/ui/screens/home/DeeprItem.kt

Lines changed: 107 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,12 @@ import androidx.compose.foundation.layout.fillMaxWidth
1616
import androidx.compose.foundation.layout.height
1717
import androidx.compose.foundation.layout.padding
1818
import androidx.compose.material3.Card
19+
import androidx.compose.material3.CardDefaults
1920
import androidx.compose.material3.DropdownMenu
2021
import androidx.compose.material3.DropdownMenuItem
22+
import androidx.compose.material3.FilterChip
2123
import androidx.compose.material3.Icon
2224
import androidx.compose.material3.IconButton
23-
import androidx.compose.material3.InputChip
2425
import androidx.compose.material3.MaterialTheme
2526
import androidx.compose.material3.Text
2627
import androidx.compose.runtime.Composable
@@ -65,135 +66,135 @@ fun DeeprItem(
6566
remember(account.tagsNames) { account.tagsNames?.split(",")?.toMutableList() }
6667

6768
Card(
69+
colors =
70+
CardDefaults.cardColors(
71+
containerColor = MaterialTheme.colorScheme.surfaceContainerHighest,
72+
),
6873
modifier =
6974
modifier
7075
.fillMaxWidth()
71-
.padding(vertical = 4.dp)
7276
.combinedClickable(
7377
onClick = { onItemClick?.invoke(account) },
7478
onLongClick = { onItemLongClick?.invoke(account) },
7579
),
7680
) {
77-
Row(
81+
Column(
7882
modifier =
7983
Modifier
80-
.padding(horizontal = 16.dp, vertical = 8.dp)
81-
.fillMaxWidth(),
82-
horizontalArrangement = Arrangement.SpaceBetween,
83-
verticalAlignment = Alignment.CenterVertically,
84+
.fillMaxWidth()
85+
.padding(horizontal = 16.dp, vertical = 8.dp),
8486
) {
85-
Column(
86-
modifier =
87-
Modifier
88-
.weight(1f)
89-
.padding(end = 8.dp),
87+
Row(
88+
modifier = Modifier.fillMaxWidth(),
89+
horizontalArrangement = Arrangement.SpaceBetween,
90+
verticalAlignment = Alignment.CenterVertically,
9091
) {
91-
Row(modifier = Modifier.fillMaxWidth()) {
92-
Column(modifier = Modifier.weight(1f)) {
93-
if (account.name.isNotEmpty()) {
94-
Text(
95-
text = account.name,
96-
maxLines = 1,
97-
overflow = TextOverflow.Ellipsis,
98-
style = MaterialTheme.typography.labelLarge,
99-
)
100-
}
92+
Column(modifier = Modifier.weight(1f)) {
93+
if (account.name.isNotEmpty()) {
10194
Text(
102-
text = account.link,
95+
text = account.name,
10396
maxLines = 1,
10497
overflow = TextOverflow.Ellipsis,
98+
style = MaterialTheme.typography.labelLarge,
99+
)
100+
}
101+
Text(
102+
text = account.link,
103+
maxLines = 1,
104+
overflow = TextOverflow.Ellipsis,
105+
style = MaterialTheme.typography.bodySmall,
106+
)
107+
Spacer(modifier = Modifier.height(4.dp))
108+
Row(verticalAlignment = Alignment.CenterVertically) {
109+
Text(
110+
text = formatDateTime(account.createdAt),
111+
style = MaterialTheme.typography.bodySmall,
112+
color = MaterialTheme.colorScheme.onSurfaceVariant,
113+
)
114+
Spacer(modifier = Modifier.weight(1f))
115+
Text(
116+
text = "Opened: ${account.openedCount}",
105117
style = MaterialTheme.typography.bodySmall,
118+
color = MaterialTheme.colorScheme.onSurfaceVariant,
106119
)
107-
Spacer(modifier = Modifier.height(4.dp))
108-
Row(verticalAlignment = Alignment.CenterVertically) {
109-
Text(
110-
text = formatDateTime(account.createdAt),
111-
style = MaterialTheme.typography.bodySmall,
112-
color = MaterialTheme.colorScheme.onSurfaceVariant,
113-
)
114-
Spacer(modifier = Modifier.weight(1f))
115-
Text(
116-
text = "Opened: ${account.openedCount}",
117-
style = MaterialTheme.typography.bodySmall,
118-
color = MaterialTheme.colorScheme.onSurfaceVariant,
119-
)
120-
}
121120
}
122-
Box {
123-
IconButton(onClick = { expanded = true }) {
124-
Icon(TablerIcons.DotsVertical, contentDescription = "More options")
125-
}
121+
}
122+
Box {
123+
IconButton(onClick = { expanded = true }) {
124+
Icon(TablerIcons.DotsVertical, contentDescription = "More options")
125+
}
126126

127-
DropdownMenu(
128-
expanded = expanded,
129-
onDismissRequest = { expanded = false },
130-
) {
131-
DropdownMenuItem(
132-
text = { Text("Copy link") },
133-
onClick = {
134-
val clipboard =
135-
context.getSystemService(Context.CLIPBOARD_SERVICE) as ClipboardManager
136-
val clip = ClipData.newPlainText("Link copied", account.link)
137-
clipboard.setPrimaryClip(clip)
138-
Toast.makeText(context, "Link copied", Toast.LENGTH_SHORT).show()
139-
expanded = false
140-
},
141-
leadingIcon = {
142-
Icon(
143-
TablerIcons.Copy,
144-
contentDescription = "Copy link",
145-
)
146-
},
147-
)
148-
ShortcutMenuItem(account, {
149-
onShortcutClick?.invoke(it)
127+
DropdownMenu(
128+
expanded = expanded,
129+
onDismissRequest = { expanded = false },
130+
) {
131+
DropdownMenuItem(
132+
text = { Text("Copy link") },
133+
onClick = {
134+
val clipboard =
135+
context.getSystemService(Context.CLIPBOARD_SERVICE) as ClipboardManager
136+
val clip = ClipData.newPlainText("Link copied", account.link)
137+
clipboard.setPrimaryClip(clip)
138+
Toast.makeText(context, "Link copied", Toast.LENGTH_SHORT).show()
150139
expanded = false
151-
})
152-
ShowQRCodeMenuItem(account, {
153-
onQrCodeClick?.invoke(it)
140+
},
141+
leadingIcon = {
142+
Icon(
143+
TablerIcons.Copy,
144+
contentDescription = "Copy link",
145+
)
146+
},
147+
)
148+
ShortcutMenuItem(account, {
149+
onShortcutClick?.invoke(it)
150+
expanded = false
151+
})
152+
ShowQRCodeMenuItem(account, {
153+
onQrCodeClick?.invoke(it)
154+
expanded = false
155+
})
156+
DropdownMenuItem(
157+
text = { Text("Edit") },
158+
onClick = {
159+
onEditClick?.invoke(account)
160+
expanded = false
161+
},
162+
leadingIcon = {
163+
Icon(
164+
TablerIcons.Edit,
165+
contentDescription = "Edit",
166+
)
167+
},
168+
)
169+
DropdownMenuItem(
170+
text = { Text("Delete") },
171+
onClick = {
172+
onRemoveClick?.invoke(account)
154173
expanded = false
155-
})
156-
DropdownMenuItem(
157-
text = { Text("Edit") },
158-
onClick = {
159-
onEditClick?.invoke(account)
160-
expanded = false
161-
},
162-
leadingIcon = {
163-
Icon(
164-
TablerIcons.Edit,
165-
contentDescription = "Edit",
166-
)
167-
},
168-
)
169-
DropdownMenuItem(
170-
text = { Text("Delete") },
171-
onClick = {
172-
onRemoveClick?.invoke(account)
173-
expanded = false
174-
},
175-
leadingIcon = {
176-
Icon(
177-
TablerIcons.Trash,
178-
contentDescription = "Delete",
179-
)
180-
},
181-
)
182-
}
174+
},
175+
leadingIcon = {
176+
Icon(
177+
TablerIcons.Trash,
178+
contentDescription = "Delete",
179+
)
180+
},
181+
)
183182
}
184183
}
184+
}
185185

186-
FlowRow(
187-
modifier = Modifier.fillMaxWidth(),
188-
horizontalArrangement = Arrangement.spacedBy(4.dp),
189-
) {
190-
selectedTags?.forEach { tag ->
191-
InputChip(
192-
selected = selectedTag?.name == tag.trim(),
193-
onClick = { onTagClick?.invoke(tag.trim()) },
194-
label = { Text(tag.trim()) },
195-
)
196-
}
186+
FlowRow(
187+
modifier = Modifier.fillMaxWidth(),
188+
horizontalArrangement = Arrangement.spacedBy(4.dp),
189+
) {
190+
selectedTags?.forEach { tag ->
191+
FilterChip(
192+
modifier = Modifier.padding(0.dp),
193+
elevation = null,
194+
selected = selectedTag?.name == tag.trim(),
195+
onClick = { onTagClick?.invoke(tag.trim()) },
196+
label = { Text(tag.trim()) },
197+
)
197198
}
198199
}
199200
}

0 commit comments

Comments
 (0)