mirror of
https://seed.radicle.dev/rad:z4V1sjrXqjvFdnCUbxPFqd5p4DtH5.git
synced 2026-11-02 02:00:31 +08:00
fix(web): Provide visual response to old reviews
Previously radicle-explorer kept old reviews the exact same style as new ones (greyed out text like). This change sets the new review color to be the same as users are normally while greying out old ones (both the user and the icon). To provide further clarity we've added a tooltip for explaining that a review is old, and started sorting the reviews so that outdated reviews sink to the bottom/end. In review, it was mentioned that this would go well with jumping to the review by clicking on the checks/crosses. This is a larger and more-different change than we believe fits in this patch. We'll make a followup for it in the future.
This commit is contained in:
committed by
Skyler Grey
parent
5657a6ff47
commit
144fc42970
@@ -7,6 +7,16 @@
|
||||
|
||||
export let baseUrl: BaseUrl;
|
||||
export let reviews: PatchReviews;
|
||||
|
||||
$: sortedReviews = Array.from(Object.values(reviews)).sort((a, b) => {
|
||||
if (a.latest === b.latest) {
|
||||
return 0;
|
||||
} else if (b.latest) {
|
||||
return 1;
|
||||
} else {
|
||||
return -1;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@@ -21,7 +31,6 @@
|
||||
font-size: var(--font-size-small);
|
||||
}
|
||||
.review {
|
||||
color: var(--color-fill-gray);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
@@ -32,6 +41,10 @@
|
||||
.review-reject {
|
||||
color: var(--color-foreground-red);
|
||||
}
|
||||
.txt-missing .review-accept,
|
||||
.txt-missing .review-reject {
|
||||
color: var(--color-foreground-dim);
|
||||
}
|
||||
@media (max-width: 1349.98px) {
|
||||
.wrapper {
|
||||
display: flex;
|
||||
@@ -58,8 +71,13 @@
|
||||
<div class="wrapper">
|
||||
<div class="header">Reviews</div>
|
||||
<div class="body">
|
||||
{#each Object.values(reviews) as { latest, review }}
|
||||
<div class="review" class:txt-missing={!latest}>
|
||||
{#each sortedReviews as { latest, review }}
|
||||
<div
|
||||
class="review"
|
||||
class:txt-missing={!latest}
|
||||
title={!latest
|
||||
? `This review was on a previous revision. Please ask ${review.author.alias} to re-review`
|
||||
: ""}>
|
||||
<span
|
||||
class:review-accept={review.verdict === "accept"}
|
||||
class:review-reject={review.verdict === "reject"}>
|
||||
|
||||
Reference in New Issue
Block a user