uploaded_files_list: Fix id pollution.

The HTML id attribute is supposed to be globally unique; it’s not an
appropriate place to store a user-controlled string, or to identify
part of a component that’s rendered more than once.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg 2024-09-30 13:16:33 -07:00 committed by Tim Abbott
parent 762617e23f
commit b0653d1ea4
3 changed files with 4 additions and 4 deletions

View File

@ -184,7 +184,7 @@ export function set_up_attachments(): void {
});
$("#uploaded_files_table").on("click", ".remove-attachment", (e) => {
const file_name = $(e.target).closest(".uploaded_file_row").attr("id");
const file_name = $(e.target).closest(".uploaded_file_row").attr("data-attachment-name");
delete_attachments(
$(e.target).closest(".uploaded_file_row").attr("data-attachment-id")!,
file_name!,

View File

@ -526,7 +526,7 @@ input[type="checkbox"] {
margin-left: 5px;
}
.edit-attachment-buttons #download_attachment {
.edit-attachment-buttons .download-attachment {
display: block;
padding: 6px 9px;
text-decoration: none;

View File

@ -1,5 +1,5 @@
{{#with attachment}}
<tr class="uploaded_file_row" id="{{name}}" data-attachment-id="{{id}}">
<tr class="uploaded_file_row" data-attachment-name="{{name}}" data-attachment-id="{{id}}">
<td>
<a type="submit" class="tippy-zulip-delayed-tooltip" href="/user_uploads/{{path_id}}" target="_blank" rel="noopener noreferrer" data-tippy-content="{{t 'View file' }}">
{{ name }}
@ -20,7 +20,7 @@
<td class="upload-size" >{{ size_str }}</td>
<td class="actions">
<span class="edit-attachment-buttons">
<a type="submit" href="/user_uploads/{{path_id}}" class="button rounded small sea-green tippy-zulip-delayed-tooltip" data-tippy-content="{{t 'Download' }}" id="download_attachment" download>
<a type="submit" href="/user_uploads/{{path_id}}" class="button rounded small sea-green tippy-zulip-delayed-tooltip download-attachment" data-tippy-content="{{t 'Download' }}" download>
<i class="fa fa-download sea-green" aria-hidden="true"></i>
</a>
</span>