Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: show common actions #93

Merged
merged 3 commits into from
Sep 11, 2024
Merged

fix: show common actions #93

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5465b19
fix: show common actions
shaokeyibb Sep 10, 2024
1d8ba4e
refactor: rename action class
shaokeyibb Sep 10, 2024
6e21fa8
feat: show comment menu when hover
shaokeyibb Sep 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 25 additions & 5 deletions frontend/lib/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -653,8 +653,8 @@ const _renderComments = (comments: Comment[]) => {
<span class="comment_time comment_edited_time">最后编辑于 ${comment.last_edited_time ? dateTimeFormatter.format(new Date(comment.last_edited_time)) : ""}</span>
<div class="comment_actions">
<button class="comment_actions_item" data-action="copy_permalink" title="分享">${iconShare}</button>
<button class="comment_actions_item" data-action="modify" title="编辑">${iconEdit}</button>
<button class="comment_actions_item" data-action="delete" title="删除">${iconDelete}</button>
<button class="comment_actions_item comment_actions_item_administration" data-action="modify" title="编辑">${iconEdit}</button>
<button class="comment_actions_item comment_actions_item_administration" data-action="delete" title="删除">${iconDelete}</button>
</div>
</div>
<div class="comment_main">
Expand All @@ -671,7 +671,10 @@ const _renderComments = (comments: Comment[]) => {
const commenter = commentEl.querySelector(
".comment_commenter",
)! as HTMLAnchorElement;
commenter.textContent = comment.commenter.name;
if (comment.commenter.name) {
commenter.textContent = comment.commenter.name;
commenter.title = comment.commenter.name;
}

const userAvatar = commentEl.querySelector(
".comment_user_avatar",
Expand All @@ -697,19 +700,36 @@ const _renderComments = (comments: Comment[]) => {
".comment_header .comment_actions",
) as HTMLDivElement;

let shouldShowAdministrationActions = false;
let shouldShowCommonActions = true;

if (
!userInfo ||
userInfo.provider !== comment.commenter.oauth_provider ||
userInfo.id !== comment.commenter.oauth_user_id
) {
commentActionsHeader.style.display = "none";
shouldShowAdministrationActions = false;
}

if (userInfo && userInfo.isAdmin === true) {
commentActionsHeader.style.display = "";
shouldShowAdministrationActions = true;
}

if (comment.id === -1) {
shouldShowAdministrationActions = false;
}

if (!shouldShowAdministrationActions) {
commentActionsHeader
.querySelectorAll<HTMLButtonElement>(
".comment_actions_item_administration",
)
.forEach((it) => {
it.style.display = "none";
});
}

if (!shouldShowAdministrationActions && !shouldShowCommonActions) {
commentActionsHeader.style.display = "none";
}

Expand Down
18 changes: 16 additions & 2 deletions frontend/lib/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -331,24 +331,38 @@
}

& .comment_header {
display: flex;
display: grid;
align-items: center;

flex-wrap: wrap;
grid-template-columns: fit-content(40%) max-content auto;

gap: 3px 10px;

font-size: 12px;

user-select: none;

& .comment_commenter {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

& .comment_time {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

color: var(--review-secondary-text-color);
}

& .comment_actions {
display: none;
}

&:hover .comment_actions {
display: flex;
}
}

& .comment.comment_pending {
Expand Down