Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Commit

Permalink
Add link to next file in the export (#10190)
Browse files Browse the repository at this point in the history
Co-authored-by: grimhilt <[email protected]>
  • Loading branch information
grimhilt and grimhilt authored Feb 22, 2023
1 parent 168f6df commit fbeddba
Show file tree
Hide file tree
Showing 3 changed files with 94 additions and 17 deletions.
56 changes: 45 additions & 11 deletions src/utils/exportUtils/HtmlExport.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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();
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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
Expand All @@ -186,13 +210,17 @@ export default class HTMLExporter extends Exporter {
aria-live="polite"
role="list"
>
<div class="mx_NewRoomIntro">
${roomAvatar}
<h2> ${this.room.name} </h2>
<p> ${createdText} <br/><br/> ${exportedText} </p>
<br/>
<p> ${topicText} </p>
</div>
${
currentPage == 0
? `<div class="mx_NewRoomIntro">
${roomAvatar}
<h2> ${this.room.name} </h2>
<p> ${createdText} <br/><br/> ${exportedText} </p>
<br/>
<p> ${topicText} </p>
</div>`
: ""
}
${content}
</ol>
</div>
Expand All @@ -205,6 +233,7 @@ export default class HTMLExporter extends Exporter {
</div>
</div>
</div>
${nextMessagesLink}
</main>
</div>
</div>
Expand Down Expand Up @@ -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++) {
Expand All @@ -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> {
Expand All @@ -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));
Expand Down
41 changes: 41 additions & 0 deletions test/utils/exportUtils/HTMLExport-test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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");
});
});
});
14 changes: 8 additions & 6 deletions test/utils/exportUtils/__snapshots__/HTMLExport-test.ts.snap

Large diffs are not rendered by default.

0 comments on commit fbeddba

Please sign in to comment.