chore(client): fix a table nesting issue

This commit is contained in:
Elian Doran 2025-08-26 11:53:58 +03:00
parent 4dbc76790a
commit c38bf09af0
No known key found for this signature in database

View file

@ -37,53 +37,55 @@ export default function NoteInfoTab({ note }: TabContext) {
<div className="note-info-widget"> <div className="note-info-widget">
{note && ( {note && (
<table className="note-info-widget-table"> <table className="note-info-widget-table">
<tr> <tbody>
<th>{t("note_info_widget.note_id")}:</th> <tr>
<td>{note.noteId}</td> <th>{t("note_info_widget.note_id")}:</th>
<th>{t("note_info_widget.created")}:</th> <td>{note.noteId}</td>
<td>{formatDateTime(metadata?.dateCreated)}</td> <th>{t("note_info_widget.created")}:</th>
<th>{t("note_info_widget.modified")}:</th> <td>{formatDateTime(metadata?.dateCreated)}</td>
<td>{formatDateTime(metadata?.dateModified)}</td> <th>{t("note_info_widget.modified")}:</th>
</tr> <td>{formatDateTime(metadata?.dateModified)}</td>
</tr>
<tr> <tr>
<th>{t("note_info_widget.type")}:</th> <th>{t("note_info_widget.type")}:</th>
<td> <td>
<span class="note-info-type">{note.type}</span>{' '} <span class="note-info-type">{note.type}</span>{' '}
{ note.mime && <span class="note-info-mime">({note.mime})</span> } { note.mime && <span class="note-info-mime">({note.mime})</span> }
</td> </td>
<th title={t("note_info_widget.note_size_info")}>{t("note_info_widget.note_size")}:</th> <th title={t("note_info_widget.note_size_info")}>{t("note_info_widget.note_size")}:</th>
<td colSpan={3}> <td colSpan={3}>
{!isLoading && !noteSizeResponse && !subtreeSizeResponse && ( {!isLoading && !noteSizeResponse && !subtreeSizeResponse && (
<Button <Button
className="calculate-button" className="calculate-button"
style={{ padding: "0px 10px 0px 10px" }} style={{ padding: "0px 10px 0px 10px" }}
icon="bx bx-calculator" icon="bx bx-calculator"
text={t("note_info_widget.calculate")} text={t("note_info_widget.calculate")}
onClick={() => { onClick={() => {
setIsLoading(true); setIsLoading(true);
setTimeout(async () => { setTimeout(async () => {
await Promise.allSettled([ await Promise.allSettled([
server.get<NoteSizeResponse>(`stats/note-size/${note.noteId}`).then(setNoteSizeResponse), server.get<NoteSizeResponse>(`stats/note-size/${note.noteId}`).then(setNoteSizeResponse),
server.get<SubtreeSizeResponse>(`stats/subtree-size/${note.noteId}`).then(setSubtreeSizeResponse) server.get<SubtreeSizeResponse>(`stats/subtree-size/${note.noteId}`).then(setSubtreeSizeResponse)
]); ]);
setIsLoading(false); setIsLoading(false);
}, 0); }, 0);
}} }}
/> />
)} )}
<span className="note-sizes-wrapper"> <span className="note-sizes-wrapper">
<span class="note-size">{formatSize(noteSizeResponse?.noteSize)}</span> <span class="note-size">{formatSize(noteSizeResponse?.noteSize)}</span>
{" "} {" "}
{subtreeSizeResponse && subtreeSizeResponse.subTreeNoteCount > 1 && {subtreeSizeResponse && subtreeSizeResponse.subTreeNoteCount > 1 &&
<span class="subtree-size">{t("note_info_widget.subtree_size", { size: formatSize(subtreeSizeResponse.subTreeSize), count: subtreeSizeResponse.subTreeNoteCount })}</span> <span class="subtree-size">{t("note_info_widget.subtree_size", { size: formatSize(subtreeSizeResponse.subTreeSize), count: subtreeSizeResponse.subTreeNoteCount })}</span>
} }
{isLoading && <LoadingSpinner />} {isLoading && <LoadingSpinner />}
</span> </span>
</td> </td>
</tr> </tr>
</tbody>
</table> </table>
)} )}
</div> </div>