PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

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

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

46
src/utils/exportUtils/HtmlExport.tsx
View file

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

41
test/utils/exportUtils/HTMLExport-test.ts
View file

@ -315,4 +315,45 @@ describe("HTMLExport", () => {
expect(fileName).not.toMatch(/^files\/hello/); 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");
});
});
}); });

2
test/utils/exportUtils/__snapshots__/HTMLExport-test.ts.snap
View file

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