mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web.git synced 2024-12-14 05:03:06 +03:00
Code Issues Projects Releases Packages Wiki Activity

Apply suggestions

Browse source
This commit is contained in:
Jaiwanth 2021-06-29 10:57:02 +05:30
parent 025a7eb9a5
commit e404fa3cae
4 changed files with 161 additions and 165 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

257
src/components/views/dialogs/ExportDialog.tsx
View file

@ -212,151 +212,154 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
const sizePostFix = <span>{ _t("MB") }</span>; const sizePostFix = <span>{ _t("MB") }</span>;
let componentToDisplay: JSX.Element;
if (exportCancelled) { if (exportCancelled) {
// Display successful cancellation message // Display successful cancellation message
return <BaseDialog return (
title={_t("Export Cancelled")} <BaseDialog
className="mx_ExportDialog" title={_t("Export Cancelled")}
contentId="mx_Dialog_content" className="mx_ExportDialog"
onFinished={onFinished} contentId="mx_Dialog_content"
fixedWidth={true} onFinished={onFinished}
> fixedWidth={true}
<p>{ _t("The export was cancelled successfully") }</p> >
<p>{ _t("The export was cancelled successfully") }</p>
<DialogButtons <DialogButtons
primaryButton={_t("Okay")} primaryButton={ _t("Okay") }
hasCancel={false} hasCancel={false}
onPrimaryButtonClick={onFinished} onPrimaryButtonClick={onFinished}
/> />
</BaseDialog> </BaseDialog>
);
} else if (exportSuccessful) { } else if (exportSuccessful) {
// Display successful export message // Display successful export message
return <BaseDialog return (
title={_t("Export Successful")} <BaseDialog
className="mx_ExportDialog" title={_t("Export Successful")}
contentId="mx_Dialog_content" className="mx_ExportDialog"
onFinished={onFinished} contentId="mx_Dialog_content"
fixedWidth={true} onFinished={onFinished}
> fixedWidth={true}
<p>{ _t("Your messages were successfully exported") }</p> >
<p>{ _t("Your messages were successfully exported") }</p>
<DialogButtons <DialogButtons
primaryButton={_t("Okay")} primaryButton={_t("Okay")}
hasCancel={false} hasCancel={false}
onPrimaryButtonClick={onFinished} onPrimaryButtonClick={onFinished}
/> />
</BaseDialog> </BaseDialog>
);
} else if (!isExporting) { } else if (!isExporting) {
// Display export settings // Display export settings
<BaseDialog return (
title={_t("Export Chat")} <BaseDialog
className="mx_ExportDialog" title={_t("Export Chat")}
contentId="mx_Dialog_content" className="mx_ExportDialog"
hasCancel={true} contentId="mx_Dialog_content"
onFinished={onFinished} hasCancel={true}
fixedWidth={true} onFinished={onFinished}
> fixedWidth={true}
<p>
{_t(
"Select from the options below to export chats from your timeline",
)}
</p>
<span className="mx_ExportDialog_subheading">{ _t("Format") }</span>
<StyledRadioGroup
name="feedbackRating"
value={exportFormat}
onChange={(key) => setExportFormat(exportFormats[key])}
definitions={exportFormatOptions}
/>
<span className="mx_ExportDialog_subheading">{ _t("Messages") }</span>
<Field
element="select"
value={exportType}
onChange={(e) => {
setExportType(exportTypes[e.target.value]);
}}
> >
{ exportTypeOptions } <p>
</Field> { _t("Select from the options below to export chats from your timeline") }
{ messageCount } </p>
<span className="mx_ExportDialog_subheading"> <span className="mx_ExportDialog_subheading">{ _t("Format") }</span>
{ _t("Size Limit") }
</span>
<Field <StyledRadioGroup
type="number" name="feedbackRating"
autoComplete="off" value={exportFormat}
onValidate={onValidateSize} onChange={(key) => setExportFormat(exportFormats[key])}
element="input" definitions={exportFormatOptions}
ref={sizeLimitRef} />
value={sizeLimit}
postfixComponent={sizePostFix}
onChange={(e) => setSizeLimit(parseInt(e.target.value))}
/>
<StyledCheckbox <span className="mx_ExportDialog_subheading">{ _t("Messages") }</span>
checked={includeAttachments}
onChange={(e) =>
setAttachments((e.target as HTMLInputElement).checked)
}
>
{ _t("Include Attachments") }
</StyledCheckbox>
<DialogButtons <Field
primaryButton={_t("Export")} element="select"
onPrimaryButtonClick={onExportClick} value={exportType}
onCancel={() => onFinished(false)} onChange={(e) => {
/> setExportType(exportTypes[e.target.value]);
</BaseDialog> }}
>
{ exportTypeOptions }
</Field>
{ messageCount }
<span className="mx_ExportDialog_subheading">{ _t("Size Limit") }</span>
<Field
type="number"
autoComplete="off"
onValidate={onValidateSize}
element="input"
ref={sizeLimitRef}
value={sizeLimit}
postfixComponent={sizePostFix}
onChange={(e) => setSizeLimit(parseInt(e.target.value))}
/>
<StyledCheckbox
checked={includeAttachments}
onChange={(e) =>
setAttachments((e.target as HTMLInputElement).checked)
}
>
{ _t("Include Attachments") }
</StyledCheckbox>
<DialogButtons
primaryButton={_t("Export")}
onPrimaryButtonClick={onExportClick}
onCancel={() => onFinished(false)}
/>
</BaseDialog>
);
} else if (displayCancel) { } else if (displayCancel) {
// Display cancel warning // Display cancel warning
<BaseDialog return (
title={_t("Warning")} <BaseDialog
className="mx_ExportDialog" title={_t("Warning")}
contentId="mx_Dialog_content" className="mx_ExportDialog"
onFinished={onFinished} contentId="mx_Dialog_content"
fixedWidth={true} onFinished={onFinished}
> fixedWidth={true}
<p> >
{_t( <p>
"Are you sure you want to stop exporting your data? If you do, you'll need to start over.", {_t(
)} "Are you sure you want to stop exporting your data? If you do, you'll need to start over.",
</p> )}
<DialogButtons </p>
primaryButton={_t("Abort export process")} <DialogButtons
primaryButtonClass="danger" primaryButton={_t("Abort export process")}
hasCancel={true} primaryButtonClass="danger"
cancelButton={_t("Continue")} hasCancel={true}
onCancel={() => setCancelWarning(false)} cancelButton={_t("Continue")}
onPrimaryButtonClick={confirmCanel} onCancel={() => setCancelWarning(false)}
/> onPrimaryButtonClick={confirmCanel}
</BaseDialog> />
</BaseDialog>
);
} else { } else {
// Display progress dialog // Display progress dialog
return <BaseDialog return (
title={_t("Exporting your data...")} <BaseDialog
className="mx_ExportDialog" title={_t("Exporting your data...")}
contentId="mx_Dialog_content" className="mx_ExportDialog"
onFinished={onFinished} contentId="mx_Dialog_content"
fixedWidth={true} onFinished={onFinished}
> fixedWidth={true}
<DialogButtons >
primaryButton={_t("Cancel")} <DialogButtons
primaryButtonClass="danger" primaryButton={_t("Cancel")}
hasCancel={false} primaryButtonClass="danger"
onPrimaryButtonClick={onCancel} hasCancel={false}
/> onPrimaryButtonClick={onCancel}
</BaseDialog> />
</BaseDialog>
);
} }
return componentToDisplay;
}; };
export default ExportDialog; export default ExportDialog;

18
src/components/views/elements/ReplyThread.js
View file

@ -73,16 +73,16 @@ export default class ReplyThread extends React.Component {
this.unmounted = false; this.unmounted = false;
if (this.props.forExport) return; if (this.props.forExport) {
this.context.on("Event.replaced", this.onEventReplaced);
this.room = this.context.getRoom(this.props.parentEv.getRoomId());
this.room.on("Room.redaction", this.onRoomRedaction);
this.room.on("Room.redactionCancelled", this.onRoomRedaction);
this.context.on("Event.replaced", this.onEventReplaced); this.onQuoteClick = this.onQuoteClick.bind(this);
this.room = this.context.getRoom(this.props.parentEv.getRoomId()); this.canCollapse = this.canCollapse.bind(this);
this.room.on("Room.redaction", this.onRoomRedaction); this.collapse = this.collapse.bind(this);
this.room.on("Room.redactionCancelled", this.onRoomRedaction); }
this.onQuoteClick = this.onQuoteClick.bind(this);
this.canCollapse = this.canCollapse.bind(this);
this.collapse = this.collapse.bind(this);
} }
static getParentEventId(ev) { static getParentEventId(ev) {

14
src/i18n/strings/en_EN.json
View file

@ -2261,19 +2261,19 @@
"Enter a number between %(min)s and %(max)s": "Enter a number between %(min)s and %(max)s", "Enter a number between %(min)s and %(max)s": "Enter a number between %(min)s and %(max)s",
"Number of messages": "Number of messages", "Number of messages": "Number of messages",
"MB": "MB", "MB": "MB",
"Are you sure you want to stop exporting your data? If you do, you'll need to start over.": "Are you sure you want to stop exporting your data? If you do, you'll need to start over.", "Export Cancelled": "Export Cancelled",
"Abort export process": "Abort export process", "The export was cancelled successfully": "The export was cancelled successfully",
"Okay": "Okay",
"Export Successful": "Export Successful",
"Your messages were successfully exported": "Your messages were successfully exported",
"Export Chat": "Export Chat", "Export Chat": "Export Chat",
"Select from the options below to export chats from your timeline": "Select from the options below to export chats from your timeline", "Select from the options below to export chats from your timeline": "Select from the options below to export chats from your timeline",
"Format": "Format", "Format": "Format",
"Size Limit": "Size Limit", "Size Limit": "Size Limit",
"Include Attachments": "Include Attachments", "Include Attachments": "Include Attachments",
"Export": "Export", "Export": "Export",
"Export Successful": "Export Successful", "Are you sure you want to stop exporting your data? If you do, you'll need to start over.": "Are you sure you want to stop exporting your data? If you do, you'll need to start over.",
"Your messages were successfully exported": "Your messages were successfully exported", "Abort export process": "Abort export process",
"Okay": "Okay",
"Export Cancelled": "Export Cancelled",
"The export was cancelled successfully": "The export was cancelled successfully",
"Exporting your data...": "Exporting your data...", "Exporting your data...": "Exporting your data...",
"Feedback sent": "Feedback sent", "Feedback sent": "Feedback sent",
"Rate %(brand)s": "Rate %(brand)s", "Rate %(brand)s": "Rate %(brand)s",

37
src/utils/exportUtils/JSONExport.ts
View file

@ -10,35 +10,30 @@ import { EventType } from "matrix-js-sdk/src/@types/event";
export default class JSONExporter extends Exporter { export default class JSONExporter extends Exporter {
protected totalSize: number; protected totalSize: number;
protected messages: any[];
constructor(room: Room, exportType: exportTypes, exportOptions: exportOptions) { constructor(room: Room, exportType: exportTypes, exportOptions: exportOptions) {
super(room, exportType, exportOptions); super(room, exportType, exportOptions);
this.totalSize = 0; this.totalSize = 0;
this.messages = [];
} }
protected wrapJSON(json: string): string { protected createJSONString(): string {
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();
const creatorName = this.room?.getMember(creator)?.rawDisplayName || creator; const creatorName = this.room?.getMember(creator)?.rawDisplayName || creator;
const topic = this.room.currentState.getStateEvents(EventType.RoomTopic, "")?.getContent()?.topic || ""; const topic = this.room.currentState.getStateEvents(EventType.RoomTopic, "")?.getContent()?.topic || "";
const exporter = this.client.getUserId(); const exporter = this.client.getUserId();
const exporterName = this.room?.getMember(exporter)?.rawDisplayName || exporter; const exporterName = this.room?.getMember(exporter)?.rawDisplayName || exporter;
return `{ const jsonObject = {
"room_name": "${this.room.name}", room_name: this.room.name,
"room_creator": "${creatorName}", room_creator: creatorName,
"topic": "${topic}", topic,
"export_date": "${exportDate}", export_date: exportDate,
"exported_by": "${exporterName}", exported_by: exporterName,
"messages": [ messages: this.messages,
${json} }
] return JSON.stringify(jsonObject, null, 2);
}`
}
protected indentEachLine(JSONString: string, spaces: number) {
const indent = ' ';
const regex = /^(?!\s*$)/gm;
return JSONString.replace(regex, indent.repeat(spaces));
} }
protected async getJSONString(mxEv: MatrixEvent) { protected async getJSONString(mxEv: MatrixEvent) {
@ -57,18 +52,16 @@ ${json}
} }
const jsonEvent: any = mxEv.toJSON(); const jsonEvent: any = mxEv.toJSON();
const clearEvent = mxEv.isEncrypted() ? jsonEvent.decrypted : jsonEvent; const clearEvent = mxEv.isEncrypted() ? jsonEvent.decrypted : jsonEvent;
const jsonString = JSON.stringify(clearEvent, null, 2); return clearEvent;
return jsonString.length > 2 ? jsonString + ",\n" : "";
} }
protected async createOutput(events: MatrixEvent[]) { protected async createOutput(events: MatrixEvent[]) {
let content = "";
for (const event of events) { for (const event of events) {
if (this.cancelled) return this.cleanUp(); if (this.cancelled) return this.cleanUp();
if (!haveTileForEvent(event)) continue; if (!haveTileForEvent(event)) continue;
content += await this.getJSONString(event); this.messages.push(await this.getJSONString(event));
} }
return this.wrapJSON(this.indentEachLine(content.slice(0, -2), 2)); return this.createJSONString();
} }
public async export() { public async export() {