Merge pull request #992 from anytypeio/feature/990

Feature/990: Export to markdown

electron.js

@@ -405,6 +405,10 @@ function menuInit () {
 					label: 'Import',
 					click: () => { send('import'); }
 				},
+				{
+					label: 'Export',
+					click: () => { send('export'); }
+				},
 				{ role: 'close' },
 			]
 		},

src/img/icon/popup/settings/export.svg

@@ -0,0 +1,5 @@
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="28" height="28" rx="6" fill="#2869E9"/>
+<circle cx="14" cy="14" r="9" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.25 19.3107C13.25 19.7249 13.5858 20.0607 14 20.0607C14.4142 20.0607 14.75 19.7249 14.75 19.3107L14.75 11.1213L18.4697 14.841C18.7626 15.1339 19.2374 15.1339 19.5303 14.841C19.8232 14.5481 19.8232 14.0732 19.5303 13.7803L14 8.25001L8.46967 13.7803C8.17678 14.0732 8.17678 14.5481 8.46967 14.841C8.76256 15.1339 9.23744 15.1339 9.53033 14.841L13.25 11.1213L13.25 19.3107Z" fill="#2869E9"/>
+</svg>

src/json/text.json

@@ -52,6 +52,7 @@
 
 	"progress0": { "en": "Copying files %s/%s" },
 	"progress1": { "en": "Import in progress" },
+	"progress2": { "en": "Export in progress" },
 
 	"headerHistoryCurrent": { "en": "Current version" },
 	"headerHistoryRestore": { "en": "Restore version" },
@@ -209,6 +210,10 @@
 	"popupSettingsImportPageTitle": { "en": "Get certain pages:" },
 	"popupSettingsImportZip": { "en": "After that you need to select Zip archive and Anytype will do the rest." },
 	"popupSettingsImportOk": { "en": "Import data" },
+	"popupSettingsExportTitle": { "en": "Export" },
+	"popupSettingsExportMarkdownTitle": { "en": "Export to markdown" },
+	"popupSettingsExportMarkdownText": { "en": "All your workspace data except columns and text color styling will be exported to markdown. It’s a free and readable format that can be opened and edited with many free and beautiful applications.<br/><br/>If you want to add all your data back in Anytype, use the <b>Import</b> section." },
+	"popupSettingsExportOk": { "en": "Export data" },
 	"popupSettingsLogout": { "en": "Log out" },
 
 	"popupFeedbackTitle": { "en": "Feedback" },

src/scss/popup/settings.scss

@@ -38,6 +38,7 @@
 				.icon.phrase { background-image: url('~img/icon/popup/settings/phrase.svg'); }
 				.icon.pin { background-image: url('~img/icon/popup/settings/pin.svg'); }
 				.icon.import { background-image: url('~img/icon/popup/settings/import.svg'); }
+				.icon.export { background-image: url('~img/icon/popup/settings/export.svg'); }
 				
 				.label { display: inline-block; vertical-align: top; }
 				.icon.arrow { 
@@ -153,5 +154,10 @@
 			.button { margin-top: 25px; }
 		}
 
+		.tabExportMarkdown {
+			.label.last { margin: 0px; }
+			.button { margin-top: 25px; }
+		}
+
 	}
 }

src/ts/app.tsx

@@ -422,6 +422,7 @@ class App extends React.Component<Props, State> {
 		});
 
 		ipcRenderer.on('import', this.onImport);
+		ipcRenderer.on('export', this.onExport);
 
 		ipcRenderer.on('command', this.onCommand);
 
@@ -490,6 +491,12 @@ class App extends React.Component<Props, State> {
 		});
 	};
 
+	onExport () {
+		commonStore.popupOpen('settings', {
+			data: { page: 'exportMarkdown' }
+		});
+	};
+
 	onMenu (e: any) {
 		ipcRenderer.send('winCommand', 'menu');
 	};

src/ts/component/popup/settings.tsx

@@ -13,7 +13,9 @@ interface State {
 	error: string;
 };
 
-const { dialog } = window.require('electron').remote;
+const { dialog, app } = window.require('electron').remote;
+const { ipcRenderer } = window.require('electron');
+const userPath = app.getPath('userData');
 const $ = require('jquery');
 const Constant: any = require('json/constant.json');
 const sha1 = require('sha1');
@@ -99,6 +101,12 @@ class PopupSettings extends React.Component<Props, State> {
 								<Label text={translate('popupSettingsImportTitle')} />
 								<Icon className="arrow" />
 							</div>
+
+							<div className="row" onClick={() => { this.onPage('exportMarkdown'); }}>
+								<Icon className="export" />
+								<Label text={translate('popupSettingsExportTitle')} />
+								<Icon className="arrow" />
+							</div>
 						</div>
 
 						<div className="logout" onClick={this.onLogout}>{translate('popupSettingsLogout')}</div>
@@ -301,6 +309,19 @@ class PopupSettings extends React.Component<Props, State> {
 					</div>
 				);
 				break;
+
+			case 'exportMarkdown':
+				content = (
+					<div>
+						<Head id="index" name={translate('popupSettingsTitle')} />
+
+						<Title text={translate('popupSettingsExportMarkdownTitle')} />
+						<Label text={translate('popupSettingsExportMarkdownText')} />
+
+						<Button text={translate('popupSettingsExportOk')} className="orange" onClick={() => { this.onExport(I.ExportFormat.Markdown); }} />
+					</div>
+				);
+				break;
 		};
 
 		return (
@@ -446,6 +467,50 @@ class PopupSettings extends React.Component<Props, State> {
 		});
 	};
 
+	onExport (format: I.ExportFormat) {
+		const { root } = blockStore;
+
+		let options: any = {};
+
+		switch (format) {
+			case I.ExportFormat.Markdown:
+				options = { 
+					properties: [ 'openDirectory' ],
+				};
+
+				dialog.showOpenDialog(options).then((result: any) => {
+					const files = result.filePaths;
+					if ((files == undefined) || !files.length) {
+						return;
+					};
+
+					this.setState({ loading: true });
+
+					C.Export(files[0], [], format, true, (message: any) => {	
+						this.setState({ loading: false });
+
+						if (message.error.code) {
+							commonStore.popupOpen('confirm', {
+								data: {
+									title: 'Ooops!',
+									text: 'Something went wrong. <br/>If you think it’s our fault, please write us a feedback.',
+									textConfirm: 'Try one more time',
+									canCancel: false,
+									onConfirm: () => {
+									},
+								},
+							});
+							return;
+						};
+
+						ipcRenderer.send('pathOpen', files[0]);
+						this.props.close();
+					});
+				});
+				break;
+		};
+	};
+
 	init () {
 		this.props.position();
 		$(window).unbind('resize.settings').on('resize.settings', () => { this.props.position(); });

src/ts/interface/common.tsx

@@ -53,4 +53,8 @@ export interface LinkPreview {
 	description: string;
 	faviconUrl: string;
 	imageUrl: string;
-};
+};
+
+export enum ExportFormat {
+	Markdown = 0,
+}

src/ts/interface/index.tsx

@@ -1,4 +1,4 @@
-import { Account, Platform, DragItem, CoverType, CrumbsType, NavigationType, Option, HistoryVersion, LinkPreview } from './common';
+import { Account, Platform, DragItem, CoverType, CrumbsType, NavigationType, Option, HistoryVersion, LinkPreview, ExportFormat } from './common';
 import { ThreadStatus, ThreadSummary, ThreadDevice, ThreadAccount, ThreadCafe, FilesStatus } from './thread';
 import { Progress, ProgressType, ProgressState } from './progress';
 import { PopupParam, Popup } from './popup';
@@ -43,6 +43,7 @@ export {
 	Option,
 	HistoryVersion,
 	LinkPreview,
+	ExportFormat,
 	
 	ThreadStatus,
 	ThreadSummary,

src/ts/lib/command.tsx

@@ -39,6 +39,17 @@ const LinkPreview = (url: string, callBack?: (message: any) => void) => {
 	dispatcher.request('linkPreview', request, callBack);
 };
 
+const Export = (path: string, ids: string[], format: I.ExportFormat, zip: boolean, callBack?: (message: any) => void) => {
+	const request = new Rpc.Export.Request();
+
+	request.setPath(path);
+	request.setDocidsList(ids);
+	request.setFormat(format);
+	request.setZip(zip);
+
+	dispatcher.request('export', request, callBack);
+};
+
 const UploadFile = (url: string, path: string, type: I.FileType, enc: boolean, callBack?: (message: any) => void) => {
 	if (!url && !path) {
 		return;
@@ -892,6 +903,7 @@ export {
 	LinkPreview,
 	UploadFile,
 	ProcessCancel,
+	Export,
 
 	WalletCreate,
 	WalletRecover,

src/ts/lib/response.tsx

@@ -23,6 +23,10 @@ const Shutdown = () => {
 	return {};
 };
 
+const Export = () => {
+	return {};
+};
+
 const LinkPreview = (response: any) => {
 	return {
 		linkPreview: response.hasLinkpreview() ? Mapper.From.LinkPreview(response.getLinkpreview()) : {},