diff --git a/res/css/_components.scss b/res/css/_components.scss
index ec3af8655e..c0fade8e5e 100644
--- a/res/css/_components.scss
+++ b/res/css/_components.scss
@@ -75,6 +75,7 @@
@import "./views/dialogs/_DeactivateAccountDialog.scss";
@import "./views/dialogs/_DevtoolsDialog.scss";
@import "./views/dialogs/_EditCommunityPrototypeDialog.scss";
+@import "./views/dialogs/_ExportDialog.scss";
@import "./views/dialogs/_FeedbackDialog.scss";
@import "./views/dialogs/_ForwardDialog.scss";
@import "./views/dialogs/_GroupAddressPicker.scss";
diff --git a/res/css/views/dialogs/_ExportDialog.scss b/res/css/views/dialogs/_ExportDialog.scss
new file mode 100644
index 0000000000..69b76221bb
--- /dev/null
+++ b/res/css/views/dialogs/_ExportDialog.scss
@@ -0,0 +1,22 @@
+.mx_ExportDialog_subheading {
+ font-size: $font-16px;
+ display: block;
+ font-family: $font-family;
+ font-weight: 600;
+ color: $primary-fg-color;
+ margin-top: 18px;
+ margin-bottom: 12px;
+}
+
+.mx_ExportDialog .mx_RadioButton > .mx_RadioButton_content {
+ margin-top: 5px;
+ margin-bottom: 5px;
+}
+
+.mx_ExportDialog .mx_Field {
+ width: 256px;
+}
+
+.mx_ExportDialog .mx_Field_postfix {
+ padding: 9px 10px;
+}
diff --git a/src/components/views/dialogs/ExportDialog.tsx b/src/components/views/dialogs/ExportDialog.tsx
index 7aba38c5c0..8cefffaa9f 100644
--- a/src/components/views/dialogs/ExportDialog.tsx
+++ b/src/components/views/dialogs/ExportDialog.tsx
@@ -4,10 +4,14 @@ import { _t } from "../../../languageHandler";
import { IDialogProps } from "./IDialogProps";
import BaseDialog from "./BaseDialog";
import DialogButtons from "../elements/DialogButtons";
-import Dropdown from "../elements/Dropdown";
+import Field from "../elements/Field";
+import StyledRadioGroup from "../elements/StyledRadioGroup";
+import StyledCheckbox from "../elements/StyledCheckbox";
import exportConversationalHistory, {
exportFormats,
exportTypes,
+ textForFormat,
+ textForType,
} from "../../../utils/exportUtils/exportUtils";
interface IProps extends IDialogProps {
@@ -15,18 +19,21 @@ interface IProps extends IDialogProps {
}
const ExportDialog: React.FC = ({ room, onFinished }) => {
- const [format, setFormat] = useState("HTML");
+ const [exportFormat, setExportFormat] = useState("HTML");
+ const [exportType, setExportType] = useState("TIMELINE");
+ const [includeAttachments, setAttachments] = useState(false);
+ const [numberOfMessages, setNumberOfMessages] = useState();
+ const [sizeLimit, setSizeLimit] = useState(8);
+
const onExportClick = async () => {
await exportConversationalHistory(
room,
- exportFormats.PLAIN_TEXT,
- exportTypes.START_DATE,
+ exportFormats[exportFormat],
+ exportTypes[exportType],
{
- startDate: parseInt(
- new Date("2021.05.20").getTime().toFixed(0),
- ),
- attachmentsIncluded: true,
- maxSize: 7 * 1024 * 1024, // 7 MB
+ numberOfMessages,
+ attachmentsIncluded: includeAttachments,
+ maxSize: sizeLimit * 1024 * 1024,
},
);
};
@@ -35,15 +42,40 @@ const ExportDialog: React.FC = ({ room, onFinished }) => {
onFinished(false);
};
- const options = Object.keys(exportFormats).map(key => {
- return
- { exportFormats[key] }
-
- })
+ const exportFormatOptions = Object.keys(exportFormats).map((format) => ({
+ value: format,
+ label: textForFormat(format),
+ }));
+
+ const exportTypeOptions = Object.keys(exportTypes).map((type) => {
+ return (
+
+ );
+ });
+
+ let MessageCount = null;
+ if (exportType === exportTypes.LAST_N_MESSAGES) {
+ MessageCount = (
+ {
+ setNumberOfMessages(parseInt(e.target.value));
+ }}
+ type="number"
+ />
+ );
+ }
+
+ const sizePostFix = ({_t("MB")});
return (
= ({ room, onFinished }) => {
)}
- { setFormat(key) }}
- value={format}
- label={_t("Export formats")}
+ {_t("Format")}
+
+ setExportFormat(key)}
+ definitions={exportFormatOptions}
+ />
+
+ {_t("Messages")}
+
+ {
+ setExportType(e.target.value);
+ }}
>
- { options }
-
+ {exportTypeOptions}
+
+ { MessageCount }
+
+
+ {_t("Size Limit")}
+
+
+ setSizeLimit(e.target.value)}
+ />
+
+
+ setAttachments((e.target as HTMLInputElement).checked)
+ }
+ >
+ {_t("Include Attachments")}
+
{
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index 9ab4a77c9f..cb28f2b07b 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -735,6 +735,12 @@
"Invite to %(spaceName)s": "Invite to %(spaceName)s",
"Share your public space": "Share your public space",
"Unknown App": "Unknown App",
+ "HTML": "HTML",
+ "JSON": "JSON",
+ "Plain Text": "Plain Text",
+ "From the beginning": "From the beginning",
+ "For a number of messages": "For a number of messages",
+ "Current Timeline": "Current Timeline",
"Media omitted": "Media omitted",
"Media omitted - file size limit exceeded": "Media omitted - file size limit exceeded",
"%(creatorName)s created this room.": "%(creatorName)s created this room.",
@@ -2249,8 +2255,13 @@
"There was an error updating your community. The server is unable to process your request.": "There was an error updating your community. The server is unable to process your request.",
"Update community": "Update community",
"An error has occurred.": "An error has occurred.",
+ "Number of messages": "Number of messages",
+ "MB": "MB",
"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",
+ "Format": "Format",
+ "Size Limit": "Size Limit",
+ "Include Attachments": "Include Attachments",
"Export": "Export",
"Feedback sent": "Feedback sent",
"Rate %(brand)s": "Rate %(brand)s",
diff --git a/src/utils/exportUtils/exportUtils.ts b/src/utils/exportUtils/exportUtils.ts
index 7a1d4a9f11..37d0bbc524 100644
--- a/src/utils/exportUtils/exportUtils.ts
+++ b/src/utils/exportUtils/exportUtils.ts
@@ -4,26 +4,41 @@ import HTMLExporter from "./HtmlExport";
import JSONExporter from "./JSONExport";
import PlainTextExporter from "./PlainTextExport";
-_t("HTML");
-_t("JSON");
-_t("Plain Text");
-
export enum exportFormats {
HTML = "HTML",
JSON = "JSON",
- PLAIN_TEXT = "Plain Text",
+ PLAIN_TEXT = "PLAIN_TEXT",
}
-_t("Current Timeline");
-_t("From the beginning")
-_t("From a specific date")
-_t("Last n messages");
-
export enum exportTypes {
- TIMELINE = "Current Timeline",
- BEGINNING = "From the beginning",
- START_DATE = "From a specific date",
- LAST_N_MESSAGES = "Last n messages",
+ TIMELINE = "TIMELINE",
+ BEGINNING = "BEGINNING",
+ // START_DATE = "START_DATE",
+ LAST_N_MESSAGES = "LAST_N_MESSAGES",
+}
+
+export const textForFormat = (format: string) => {
+ switch (format) {
+ case exportFormats.HTML:
+ return _t("HTML");
+ case exportFormats.JSON:
+ return _t("JSON");
+ case exportFormats.PLAIN_TEXT:
+ return _t("Plain Text");
+ }
+}
+
+export const textForType = (type: string) => {
+ switch (type) {
+ case exportTypes.BEGINNING:
+ return _t("From the beginning");
+ case exportTypes.LAST_N_MESSAGES:
+ return _t("For a number of messages");
+ case exportTypes.TIMELINE:
+ return _t("Current Timeline");
+ // case exportTypes.START_DATE:
+ // return _t("From a specific date");
+ }
}
export interface exportOptions {