feat(ui): export/import custom list

AxaFrance · Feb 4, 2021 · 35abff4 · 35abff4
1 parent 7cb869a
commit 35abff4
Show file tree

Hide file tree

Showing 2 changed files with 115 additions and 33 deletions.
diff --git a/src/components/CustomListSettings/CustomListSettings.svelte b/src/components/CustomListSettings/CustomListSettings.svelte
@@ -1,4 +1,7 @@
 <script lang="ts">
+	const {dialog} = require('electron').remote;
+	const fs = require('fs')
+
 	import { v4 as uuidv4 } from 'uuid';
 	import type { CustomListType } from 'models/skizzle/CustomListType';
 	import AccountTitle from 'components/AccountTitle';
@@ -19,42 +22,77 @@
 		? $customLists.find(list => list.id === id).repositoriesIds
 		: [];
 
+	const onImport = () => {
+		const options = {
+				properties: ['openFile'],
+				title: "Importer une liste",
+				filters: [
+					{name: 'Skizzle List', extensions: ['json']}
+				]
+			}
+
+		const loadFrom = dialog.showOpenDialog(options);
+
+		loadFrom.then(file => {
+			 const data = JSON.parse(fs.readFileSync(file.filePaths[0],'utf8'))
+
+			 const list: CustomListType = {
+					id: uuidv4(),
+					...data
+				};
+
+			 customLists.update(_list => [..._list, list]);
+
+			 notifications.update(notifications => [
+					...notifications,
+					{
+						text: "Liste importée.",
+						id: uuidv4(),
+					},
+				]);
+			 onDone()
+		})
+
+	}
+
 	const onSubmit = (event): void => {
 		event.preventDefault();
 
-		if (id) {
-			const list: CustomListType = {
-				id,
-				name: listName,
-				repositoriesIds,
-			};
-
-			customLists.update(_list =>
-				_list.map(__list => {
-					if (__list.id === id) {
-						return list;
-					}
-
-					return __list;
-				}),
-			);
-		} else {
-			const list: CustomListType = {
-				id: uuidv4(),
-				name: listName,
-				repositoriesIds,
-			};
-
-			customLists.update(_list => [..._list, list]);
-			notifications.update(notifications => [
-				...notifications,
-				{
-					text: "Liste crée.",
+		if(event.submitter.id !== 'import') {
+			if (id) {
+				const list: CustomListType = {
+					id,
+					name: listName,
+					repositoriesIds,
+				};
+
+				customLists.update(_list =>
+					_list.map(__list => {
+						if (__list.id === id) {
+							return list;
+						}
+
+						return __list;
+					}),
+				);
+			} else {
+				const list: CustomListType = {
 					id: uuidv4(),
-				},
-			]);
+					name: listName,
+					repositoriesIds,
+				};
+
+				customLists.update(_list => [..._list, list]);
+				notifications.update(notifications => [
+					...notifications,
+					{
+						text: "Liste crée.",
+						id: uuidv4(),
+					},
+				]);
+			}
+			onDone();
 		}
-		onDone();
 	};
 
 	const deleteRepository = (id: string): void => {
@@ -67,7 +105,10 @@
 
 <!-- svelte-ignore a11y-no-onchange a11y-autofocus -->
 <form on:submit={onSubmit}>
-	<AccountTitle>{id ? 'Modifier la liste' : 'Nouvelle liste'}</AccountTitle>
+	<AccountTitle>
+			{id ? 'Modifier la liste' : 'Nouvelle liste'}
+			<input id="import" on:click={onImport} type="submit" value={'Charger une liste'} />
+</AccountTitle>
 	<Fieldset
 		title="Nom de la liste"
 		intro="Choisissez un nom pour votre liste, il apparaitra dans l'onglet."

diff --git a/src/components/Main/Main.svelte b/src/components/Main/Main.svelte
@@ -1,20 +1,60 @@
 <script lang="ts">
+	const {remote} = require('electron');
+	const fs = require('fs')
+
 	import { v4 as uuidv4 } from 'uuid';
 	import { pullRequests, customLists, notifications } from 'shared/stores/default.store';
 	import PullRequest from 'components/PullRequest';
 	import Tabs from 'components/Tabs';
 	import Modale from 'components/Modale';
 	import CustomListSettings from 'components/CustomListSettings';
-	
+
 	let creatingList: boolean = false;
 	let modifyingListId: string = null;
 	let currentTab: string = 'all';
+	const dialog = remote.dialog;
+	let customListsData;
 
 	const closeModale = () => {
 		creatingList = false;
 		modifyingListId = null;
 	};
 
+	customLists.subscribe(value => {
+		customListsData = value;
+	});
+
+const exportList = () => {
+	const currentTabData = customListsData.filter(customList => customList.id == currentTab)[0]
+
+	const options = {
+    title: "Exporter la liste sous...",
+    defaultPath : `${currentTabData.name}.json`,
+    filters: [
+        {name: 'Skizzle List', extensions: ['json']}
+    ]
+}
+	const saveDialog = dialog.showSaveDialog(remote.getCurrentWindow(), options);
+
+	saveDialog.then(function(saveTo) {
+		fs.writeFileSync(saveTo.filePath, JSON.stringify(
+			{
+				name: currentTabData.name,
+				repositoriesIds: currentTabData.repositoriesIds
+			})
+		)
+
+		notifications.update(notifications => [
+				...notifications,
+				{
+					text: "Liste exportée.",
+					id: uuidv4(),
+				},
+			]);
+	})
+
+}
+
 	const deleteList = () => {
 		customLists.update(list => list.filter(_list => _list.id !== currentTab));
 		notifications.update(notifications => [
@@ -117,6 +157,7 @@
 					modifyingListId = currentTab;
 				}}>Modifier</button>
 			<button on:click={deleteList}>Supprimer</button>
+			<button on:click={exportList}>Exporter</button>
 		</div>
 	{/if}
 	{#if displayedList.length}