Add link to next file in the export (#10190)

Co-authored-by: grimhilt <grimhilt@users.noreply.github.com>
This commit is contained in:
grimhilt 2023-02-22 11:29:49 +01:00 committed by GitHub
parent 168f6df7c8
commit fbeddba782
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 94 additions and 17 deletions

View file

@ -89,7 +89,7 @@ export default class HTMLExporter extends Exporter {
return renderToStaticMarkup(avatar);
}
protected async wrapHTML(content: string): Promise<string> {
protected async wrapHTML(content: string, currentPage: number, nbPages: number): Promise<string> {
const roomAvatar = await this.getRoomAvatar();
const exportDate = formatFullDateNoDayNoTime(new Date());
const creator = this.room.currentState.getStateEvents(EventType.RoomCreate, "")?.getSender();
@ -128,6 +128,29 @@ export default class HTMLExporter extends Exporter {
);
const topicText = topic ? _t("Topic: %(topic)s", { topic }) : "";
const previousMessagesLink = renderToStaticMarkup(
currentPage !== 0 ? (
<div style={{ textAlign: "center" }}>
<a href={`./messages${currentPage === 1 ? "" : currentPage}.html`} style={{ fontWeight: "bold" }}>
Previous group of messages
</a>
</div>
) : (
<></>
),
);
const nextMessagesLink = renderToStaticMarkup(
currentPage < nbPages - 1 ? (
<div style={{ textAlign: "center", margin: "10px" }}>
<a href={"./messages" + (currentPage + 2) + ".html"} style={{ fontWeight: "bold" }}>
Next group of messages
</a>
</div>
) : (
<></>
),
);
return `
<!DOCTYPE html>
@ -168,6 +191,7 @@ export default class HTMLExporter extends Exporter {
<div class="mx_RoomHeader_topic" dir="auto"> ${topic} </div>
</div>
</div>
${previousMessagesLink}
<div class="mx_MainSplit">
<div class="mx_RoomView_body">
<div
@ -186,13 +210,17 @@ export default class HTMLExporter extends Exporter {
aria-live="polite"
role="list"
>
<div class="mx_NewRoomIntro">
${
currentPage == 0
? `<div class="mx_NewRoomIntro">
${roomAvatar}
<h2> ${this.room.name} </h2>
<p> ${createdText} <br/><br/> ${exportedText} </p>
<br/>
<p> ${topicText} </p>
</div>
</div>`
: ""
}
${content}
</ol>
</div>
@ -205,6 +233,7 @@ export default class HTMLExporter extends Exporter {
</div>
</div>
</div>
${nextMessagesLink}
</main>
</div>
</div>
@ -381,7 +410,12 @@ export default class HTMLExporter extends Exporter {
return eventTile;
}
protected async createHTML(events: MatrixEvent[], start: number): Promise<string> {
protected async createHTML(
events: MatrixEvent[],
start: number,
currentPage: number,
nbPages: number,
): Promise<string> {
let content = "";
let prevEvent: MatrixEvent | null = null;
for (let i = start; i < Math.min(start + 1000, events.length); i++) {
@ -405,7 +439,7 @@ export default class HTMLExporter extends Exporter {
content += body;
prevEvent = event;
}
return this.wrapHTML(content);
return this.wrapHTML(content, currentPage, nbPages);
}
public async export(): Promise<void> {
@ -428,7 +462,7 @@ export default class HTMLExporter extends Exporter {
const usedClasses = new Set<string>();
for (let page = 0; page < res.length / 1000; page++) {
const html = await this.createHTML(res, page * 1000);
const html = await this.createHTML(res, page * 1000, page, res.length / 1000);
const document = new DOMParser().parseFromString(html, "text/html");
document.querySelectorAll("*").forEach((element) => {
element.classList.forEach((c) => usedClasses.add(c));

View file

@ -315,4 +315,45 @@ describe("HTMLExport", () => {
expect(fileName).not.toMatch(/^files\/hello/);
}
});
it("should add link to next and previous file", async () => {
const exporter = new HTMLExporter(
room,
ExportType.LastNMessages,
{
attachmentsIncluded: false,
maxSize: 1_024 * 1_024,
},
() => {},
);
// test link to the first page
//@ts-ignore private access
exporter.wrapHTML("", 0, 3).then((res) => {
expect(res).not.toContain("Previous group of messages");
expect(res).toContain(
'<div style="text-align:center;margin:10px"><a href="./messages2.html" style="font-weight:bold">Next group of messages</a></div>',
);
});
// test link for a middle page
//@ts-ignore private access
exporter.wrapHTML("", 1, 3).then((res) => {
expect(res).toContain(
'<div style="text-align:center"><a href="./messages.html" style="font-weight:bold">Previous group of messages</a></div>',
);
expect(res).toContain(
'<div style="text-align:center;margin:10px"><a href="./messages3.html" style="font-weight:bold">Next group of messages</a></div>',
);
});
// test link for last page
//@ts-ignore private access
exporter.wrapHTML("", 2, 3).then((res) => {
expect(res).toContain(
'<div style="text-align:center"><a href="./messages2.html" style="font-weight:bold">Previous group of messages</a></div>',
);
expect(res).not.toContain("Next group of messages");
});
});
});

View file

@ -40,6 +40,7 @@ exports[`HTMLExport should export 1`] = `
<div class="mx_RoomHeader_topic" dir="auto"> </div>
</div>
</div>
<div class="mx_MainSplit">
<div class="mx_RoomView_body">
<div
@ -77,6 +78,7 @@ exports[`HTMLExport should export 1`] = `
</div>
</div>
</div>
</main>
</div>
</div>