History

Highlight Selected Items (#130)

* feat: added support for highlighted rows in search results * feat: added bold to Source Text * feat: added highlights to Added date * feat: added highlighted item support for downloaded items * feat: added highlighted item support for seeding list * fix: formatting * fix: removed highlight colors and only relying on dimColor * fix: formatting * fix: dim happens when the item is not selected * fix: removed highlight colors ---------

StaticAron committed 3 months agomain

Commit 7b297461 parent ce409463 files · +61 −17Browse files

Unified · Split

3 files
  1. src/ui/components/Downloads.tsx +25 −7
  2. src/ui/components/Results.tsx +20 −6
  3. src/ui/components/Seeding.tsx +16 −4
src/ui/components/Downloads.tsx+25−7
@@ -188,11 +188,18 @@ export function Downloads() { · 187 unmodified lines
188188 </Text>
189189 </Box>
190190 <Box width={10} flexShrink={0} marginLeft={1} justifyContent="flex-end">
191− <Text dimColor>{it.totalBytes > 0 ? formatBytes(it.totalBytes) : "-"}</Text>
191+ <Text
192+ dimColor={!here}
193+ bold={here}
194+ >{it.totalBytes > 0 ? formatBytes(it.totalBytes) : "-"}
195+ </Text>
192196 </Box>
193197 <Box width={4} flexShrink={0} marginLeft={1} justifyContent="flex-end">
194− <Text color={it.source ? ss.color : undefined} dimColor={!it.source || !here}>
195− {it.source ? ss.tag : "mag"}
198+ <Text
199+ color={it.source ? ss.color : undefined}
200+ dimColor={!it.source || !here}
201+ bold={here}
202+ >{it.source ? ss.tag : "mag"}
196203 </Text>
197204 </Box>
198205 </Box>
@@ -245,14 +252,25 @@ export function Downloads() { · 46 unmodified lines
245252 </Text>
246253 </Box>
247254 <Box width={10} flexShrink={0} marginLeft={1} justifyContent="flex-end">
248− <Text dimColor>{h.sizeBytes > 0 ? formatBytes(h.sizeBytes) : "-"}</Text>
255+ <Text
256+ dimColor={!here}
257+ bold={here}
258+ >{h.sizeBytes > 0 ? formatBytes(h.sizeBytes) : "-"}
259+ </Text>
249260 </Box>
250261 <Box width={12} flexShrink={0} marginLeft={1} justifyContent="flex-end">
251− <Text dimColor>{when || "-"}</Text>
262+ <Text
263+ dimColor={!here}
264+ bold={here}
265+ >{when || "-"}
266+ </Text>
252267 </Box>
253268 <Box width={4} flexShrink={0} marginLeft={1} justifyContent="flex-end">
254− <Text color={h.source ? ss.color : undefined} dimColor={!h.source || !here}>
255− {h.source ? ss.tag : "mag"}
269+ <Text
270+ color={h.source ? ss.color : undefined}
271+ dimColor={!h.source || !here}
272+ bold={here}
273+ >{h.source ? ss.tag : "mag"}
256274 </Text>
257275 </Box>
258276 </Box>
src/ui/components/Results.tsx+20−6
@@ -465,11 +465,18 @@ export function Results() { · 464 unmodified lines
465465 {showStats ? (
466466 <>
467467 <Box width={10} flexShrink={0} marginLeft={1} justifyContent="flex-end">
468− <Text dimColor>{r.sizeBytes > 0 ? formatBytes(r.sizeBytes) : "-"}</Text>
468+ <Text
469+ dimColor={!here}
470+ bold={here}
471+ >{r.sizeBytes > 0 ? formatBytes(r.sizeBytes) : "-"}
472+ </Text>
469473 </Box>
470474 <Box width={9} flexShrink={0} marginLeft={1} justifyContent="flex-end">
471− <Text color={r.seeders > 0 ? COLOR.good : undefined} dimColor={r.seeders === 0}>
472− {r.seeders || r.leechers
475+ <Text
476+ color={r.seeders > 0 ? COLOR.good : undefined}
477+ dimColor={!here}
478+ bold={here}
479+ >{r.seeders || r.leechers
473480 ? `${formatCount(r.seeders)}:${formatCount(r.leechers)}`
474481 : "-"}
475482 </Text>
@@ -477,12 +484,19 @@ export function Results() { · 1 unmodified line
477484 </>
478485 ) : (
479486 <Box width={12} flexShrink={0} marginLeft={1} justifyContent="flex-end">
480− <Text dimColor>{formatRelative(r.added) || "-"}</Text>
487+ <Text
488+ dimColor={!here}
489+ bold={here}
490+ >{formatRelative(r.added) || "-"}
491+ </Text>
481492 </Box>
482493 )}
483494 <Box width={4} flexShrink={0} marginLeft={1} justifyContent="flex-end">
484− <Text color={ss.color} dimColor={!here}>
485− {ss.tag}
495+ <Text
496+ color={ss.color}
497+ dimColor={!here}
498+ bold={here}
499+ >{ss.tag}
486500 </Text>
487501 </Box>
488502 </Box>
src/ui/components/Seeding.tsx+16−4
@@ -155,14 +155,26 @@ export function Seeding() { · 154 unmodified lines
155155 </Text>
156156 </Box>
157157 <Box width={SIZE_W} flexShrink={0} marginLeft={1} justifyContent="flex-end">
158− <Text dimColor>{h.sizeBytes > 0 ? formatBytes(h.sizeBytes) : "-"}</Text>
158+ <Text
159+ dimColor={!here}
160+ bold={here}
161+ >{h.sizeBytes > 0 ? formatBytes(h.sizeBytes) : "-"}
162+ </Text>
159163 </Box>
160164 <Box width={STATUS_W} flexShrink={0} marginLeft={1} justifyContent="flex-end">
161− <Text color={st.color} dimColor={st.dim}>{truncate(st.text, STATUS_W)}</Text>
165+ <Text
166+ color={st.color}
167+ dimColor={!here}
168+ bold={here}
169+ >{truncate(st.text, STATUS_W)}
170+ </Text>
162171 </Box>
163172 <Box width={SRC_W} flexShrink={0} marginLeft={1} justifyContent="flex-end">
164− <Text color={h.source ? ss.color : undefined} dimColor={!h.source || !here}>
165− {h.source ? ss.tag : "mag"}
173+ <Text
174+ color={h.source ? ss.color : undefined}
175+ dimColor={!h.source || !here}
176+ bold={here}
177+ >{h.source ? ss.tag : "mag"}
166178 </Text>
167179 </Box>
168180 </Box>