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

Apply suggestions from review

Browse source
This commit is contained in:
Jaiwanth 2021-07-26 23:40:27 +05:30
parent 41bc2b6481
commit b91309be82
13 changed files with 169 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
res/css/views/dialogs/_ExportDialog.scss
View file

@ -1,3 +1,19 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ExportDialog {
.mx_ExportDialog_subheading {
font-size: $font-16px;
@ -46,19 +62,14 @@
margin-top: unset;
margin-left: 18px;
}
.mx_ExportDialog_spinner {
animation: mx_rotate 2s linear infinite;
z-index: 2;
position: relative;
.mx_Spinner {
width: unset;
height: unset;
flex: unset;
margin-right: 10px;
width: 24px;
height: 24px;
& .mx_ExportDialog_spinner_path {
stroke: $accent-color;
stroke-linecap: round;
animation: mx_dash 1.5s ease-in-out infinite;
}
}
display: flex;
flex-direction: row;
justify-content: flex-end;
@ -78,24 +89,3 @@
padding: 9px 10px;
}
}
@keyframes mx_rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes mx_dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}

6
src/components/views/avatars/MemberAvatar.tsx
View file

@ -18,7 +18,6 @@ limitations under the License.
import React from 'react';
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
import { ResizeMethod } from 'matrix-js-sdk/src/@types/partials';
import { omit } from "lodash";
import dis from "../../../dispatcher/dispatcher";
import { Action } from "../../../dispatcher/actions";
@ -91,11 +90,10 @@ export default class MemberAvatar extends React.Component<IProps, IState> {
}
render() {
let { member, fallbackUserId, onClick, viewUserOnClick, ...otherProps } = this.props;
// eslint-disable-next-line @typescript-eslint/no-unused-vars
let { member, fallbackUserId, onClick, viewUserOnClick, forExport, ...otherProps } = this.props;
const userId = member ? member.userId : fallbackUserId;
otherProps = omit(otherProps, "forExport");
if (viewUserOnClick) {
onClick = () => {
dis.dispatch({

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

@ -1,3 +1,19 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { useRef, useState } from "react";
import { Room } from "matrix-js-sdk/src";
import { _t } from "../../../languageHandler";
@ -19,6 +35,7 @@ import JSONExporter from "../../../utils/exportUtils/JSONExport";
import PlainTextExporter from "../../../utils/exportUtils/PlainTextExport";
import { useStateCallback } from "../../../hooks/useStateCallback";
import Exporter from "../../../utils/exportUtils/Exporter";
import Spinner from "../elements/Spinner";
interface IProps extends IDialogProps {
room: Room;
@ -352,16 +369,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
</div>
{ isExporting ? (
<div className="mx_ExportDialog_progress">
<svg className="mx_ExportDialog_spinner" viewBox="0 0 50 50">
<circle
className="mx_ExportDialog_spinner_path"
cx="25"
cy="25"
r="20"
fill="none"
stroke-width="5"
/>
</svg>
<Spinner w={24} h={24} />
<p ref={exportProgressRef}>
{ _t("Processing...") }
</p>

4
src/components/views/elements/EventListSummary.tsx
View file

@ -76,8 +76,8 @@ const EventListSummary: React.FC<IProps> = ({
{ children }
</React.Fragment>;
} else {
const avatars = summaryMembers.map((m, idx) =>
<MemberAvatar key={m.userId} member={m} width={14} height={14} />);
const avatars = summaryMembers.map((m) => <MemberAvatar key={m.userId} member={m} width={14} height={14} />);
body = (
<div className="mx_EventTile_line">
<div className="mx_EventTile_info">

10
src/components/views/elements/ReplyThread.tsx
View file

@ -354,8 +354,14 @@ export default class ReplyThread extends React.Component<IProps, IState> {
</blockquote>;
} else if (this.props.forExport) {
const eventId = ReplyThread.getParentEventId(this.props.parentEv);
header = <p style={{ marginTop: -5, marginBottom: 5 }}>
In reply to <a className="mx_reply_anchor" href={`#${eventId}`} scroll-to={eventId}>this message</a>
header = <p className="mx_ReplyThread_Export">
{ _t("In reply to <messageLink/>",
{},
{ messageLink: () => (
<a className="mx_reply_anchor" href={`#${eventId}`} scroll-to={eventId}> { _t("this message") } </a>
),
})
}
</p>;
} else if (this.state.loading) {
header = <Spinner w={16} h={16} />;

2
src/components/views/messages/RedactedBody.tsx
View file

@ -39,7 +39,7 @@ const RedactedBody = React.forwardRef<any, IBodyProps>(({ mxEvent, forExport },
return (
<span className="mx_RedactedBody" ref={ref} title={titleText}>
{ forExport ? <img alt="Redacted" className="mx_export_trash_icon" src="icons/trash.svg" /> : null }
{ forExport ? <img alt={_t("Redacted")} className="mx_export_trash_icon" src="icons/trash.svg" /> : null }
{ text }
</span>
);

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

@ -1951,6 +1951,7 @@
"<reactors/><reactedWith> reacted with %(content)s</reactedWith>": "<reactors/><reactedWith> reacted with %(content)s</reactedWith>",
"<reactors/><reactedWith>reacted with %(shortName)s</reactedWith>": "<reactors/><reactedWith>reacted with %(shortName)s</reactedWith>",
"Message deleted on %(date)s": "Message deleted on %(date)s",
"Redacted": "Redacted",
"%(senderDisplayName)s changed the avatar for %(roomName)s": "%(senderDisplayName)s changed the avatar for %(roomName)s",
"%(senderDisplayName)s removed the room avatar.": "%(senderDisplayName)s removed the room avatar.",
"%(senderDisplayName)s changed the room avatar to <img/>": "%(senderDisplayName)s changed the room avatar to <img/>",
@ -2098,6 +2099,8 @@
"QR Code": "QR Code",
"Unable to load event that was replied to, it either does not exist or you do not have permission to view it.": "Unable to load event that was replied to, it either does not exist or you do not have permission to view it.",
"<a>In reply to</a> <pill>": "<a>In reply to</a> <pill>",
"In reply to <messageLink/>": "In reply to <messageLink/>",
"this message": "this message",
"Room address": "Room address",
"e.g. my-room": "e.g. my-room",
"Some characters not allowed": "Some characters not allowed",

24
src/utils/exportUtils/Exporter.ts
View file

@ -1,7 +1,23 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixClientPeg } from "../../MatrixClientPeg";
import { exportOptions, exportTypes } from "./exportUtils";
import { IExportOptions, exportTypes } from "./exportUtils";
import { decryptFile } from "../DecryptFile";
import { mediaFromContent } from "../../customisations/Media";
import { formatFullDateNoDay } from "../../DateUtils";
@ -23,7 +39,7 @@ export default abstract class Exporter {
protected constructor(
protected room: Room,
protected exportType: exportTypes,
protected exportOptions: exportOptions,
protected exportOptions: IExportOptions,
protected exportProgressRef: MutableRefObject<HTMLParagraphElement>,
) {
this.cancelled = false;
@ -53,6 +69,8 @@ export default abstract class Exporter {
protected async downloadZIP(): Promise<any> {
const filename = `matrix-export-${formatFullDateNoDay(new Date())}.zip`;
console.log(this.files, this.files.length);
const zip = new JSZip();
// Create a writable stream to the directory
if (!this.cancelled) this.updateProgress("Generating a ZIP");
@ -62,7 +80,7 @@ export default abstract class Exporter {
const content = await zip.generateAsync({ type: "blob" });
await saveAs(content, filename);
saveAs(content, filename);
}
protected cleanUp(): string {

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

@ -1,3 +1,19 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { MutableRefObject } from "react";
import Exporter from "./Exporter";
import { mediaFromMxc } from "../../customisations/Media";
@ -18,7 +34,7 @@ import exportCSS from "./exportCSS";
import exportJS from "./exportJS";
import exportIcons from "./exportIcons";
import { exportTypes } from "./exportUtils";
import { exportOptions } from "./exportUtils";
import { IExportOptions } from "./exportUtils";
import MatrixClientContext from "../../contexts/MatrixClientContext";
export default class HTMLExporter extends Exporter {
@ -30,7 +46,7 @@ export default class HTMLExporter extends Exporter {
constructor(
room: Room,
exportType: exportTypes,
exportOptions: exportOptions,
exportOptions: IExportOptions,
exportProgressRef: MutableRefObject<HTMLParagraphElement>,
) {
super(room, exportType, exportOptions, exportProgressRef);

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

@ -1,10 +1,26 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import Exporter from "./Exporter";
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { formatFullDateNoDay, formatFullDateNoDayNoTime } from "../../DateUtils";
import { haveTileForEvent } from "../../components/views/rooms/EventTile";
import { exportTypes } from "./exportUtils";
import { exportOptions } from "./exportUtils";
import { IExportOptions } from "./exportUtils";
import { EventType } from "matrix-js-sdk/src/@types/event";
import { MutableRefObject } from "react";
@ -15,7 +31,7 @@ export default class JSONExporter extends Exporter {
constructor(
room: Room,
exportType: exportTypes,
exportOptions: exportOptions,
exportOptions: IExportOptions,
exportProgressRef: MutableRefObject<HTMLParagraphElement>,
) {
super(room, exportType, exportOptions, exportProgressRef);

20
src/utils/exportUtils/PlainTextExport.ts
View file

@ -1,3 +1,19 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import Exporter from "./Exporter";
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
@ -5,7 +21,7 @@ import { formatFullDateNoDay } from "../../DateUtils";
import { _t } from "../../languageHandler";
import { haveTileForEvent } from "../../components/views/rooms/EventTile";
import { exportTypes } from "./exportUtils";
import { exportOptions } from "./exportUtils";
import { IExportOptions } from "./exportUtils";
import { textForEvent } from "../../TextForEvent";
import { MutableRefObject } from "react";
@ -16,7 +32,7 @@ export default class PlainTextExporter extends Exporter {
constructor(
room: Room,
exportType: exportTypes,
exportOptions: exportOptions,
exportOptions: IExportOptions,
exportProgressRef: MutableRefObject<HTMLParagraphElement>,
) {
super(room, exportType, exportOptions, exportProgressRef);

21
src/utils/exportUtils/exportCSS.ts
View file

@ -1,3 +1,19 @@
/*
Copyright 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/* eslint-disable max-len */
const lightCSS = `@charset "utf-8";
.hljs-addition {
@ -25405,6 +25421,11 @@ a.mx_reply_anchor:hover{
}
}
.mx_ReplyThread_Export {
margin-top: -5px;
margin-bottom: 5px;
}
.mx_RedactedBody img.mx_export_trash_icon {
height: 14px;
width: 14px;

18
src/utils/exportUtils/exportUtils.ts
View file

@ -1,3 +1,19 @@
/*
Copyright 2018-2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { _t } from "../../languageHandler";
export enum exportFormats {
@ -37,7 +53,7 @@ export const textForType = (type: string): string => {
}
};
export interface exportOptions {
export interface IExportOptions {
startDate?: number;
numberOfMessages?: number;
attachmentsIncluded: boolean;