Add generic error's message

Change-type: patch
Changelog-entry: Add generic error's message
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>

lib/gui/app/components/source-selector/source-selector.tsx

@@ -16,7 +16,6 @@
 
 import { faFile, faLink } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import * as jsonStorageCb from 'electron-json-storage';
 import { sourceDestination } from 'etcher-sdk';
 import * as _ from 'lodash';
 import { GPTPartition, MBRPartition } from 'partitioninfo';
@@ -46,35 +45,36 @@ import { colors } from '../../theme';
 import { middleEllipsis } from '../../utils/middle-ellipsis';
 import { SVGIcon } from '../svg-icon/svg-icon';
 
-const jsonStorage = {
-	get: (key: string) => {
-		return new Promise((resolve, reject) => {
-			jsonStorageCb.get(key, (err, value) => {
-				if (err) {
-					reject(err);
-					throw err;
-				}
-				resolve(value);
-				return value;
-			});
-		});
-	},
-	set: (key: string, value: object) => {
-		return new Promise((resolve, reject) => {
-			jsonStorageCb.set(key, value, err => {
-				if (err) {
-					reject(err);
-					throw err;
-				}
-				resolve(value);
-				return value;
-			});
-		});
-	},
-};
+const recentUrlImagesKey = 'recentUrlImages';
 
-const getRecentUrlImages = () =>
-	jsonStorage.get('recentUrlImages') as Promise<string[]>;
+function normalizeRecentUrlImages(urls: any[]): string[] {
+	if (!Array.isArray(urls)) {
+		urls = [];
+	}
+	return _.chain(urls)
+		.filter(_.isString)
+		.reject(_.isEmpty)
+		.uniq()
+		.takeRight(5)
+		.value();
+}
+
+function getRecentUrlImages(): string[] {
+	let urls = [];
+	try {
+		urls = JSON.parse(localStorage.getItem(recentUrlImagesKey) || '[]');
+	} catch {
+		// noop
+	}
+	return normalizeRecentUrlImages(urls);
+}
+
+function setRecentUrlImages(urls: string[]) {
+	localStorage.setItem(
+		recentUrlImagesKey,
+		JSON.stringify(normalizeRecentUrlImages(urls)),
+	);
+}
 
 const Card = styled(BaseCard)`
 	hr {
@@ -107,32 +107,27 @@ const URLSelector = ({ done }: { done: (imageURL: string) => void }) => {
 		string[],
 		(value: React.SetStateAction<string[]>) => void,
 	] = React.useState([]);
+	const [loading, setLoading] = React.useState(false);
 	React.useEffect(() => {
 		const fetchRecentUrlImages = async () => {
-			try {
-				const recentUrlImages: string[] = await getRecentUrlImages();
-				if (!Array.isArray(recentUrlImages)) {
-					setRecentImages([]);
-				} else {
-					setRecentImages(recentUrlImages);
-				}
-			} catch (err) {
-				console.error(err);
-			}
+			const recentUrlImages: string[] = await getRecentUrlImages();
+			setRecentImages(recentUrlImages);
 		};
 		fetchRecentUrlImages();
 	}, []);
 	return (
 		<Modal
+			primaryButtonProps={{
+				disabled: loading,
+			}}
 			done={async () => {
-				const sanitizedRecentUrls = _.uniq(
-					_.reject([...recentImages, imageURL], _.isEmpty),
-				);
-				await jsonStorage.set(
-					'recentUrlImages',
-					_.takeRight(sanitizedRecentUrls, 5),
-				);
-				done(imageURL);
+				setLoading(true);
+				const sanitizedRecentUrls = normalizeRecentUrlImages([
+					...recentImages,
+					imageURL,
+				]);
+				setRecentUrlImages(sanitizedRecentUrls);
+				await done(imageURL);
 			}}
 		>
 			<label style={{ width: '100%' }}>
@@ -228,7 +223,6 @@ export class SourceSelector extends React.Component<
 > {
 	private unsubscribe: () => void;
 	private afterSelected: SourceSelectorProps['afterSelected'];
-	private flows: Flow[];
 
 	constructor(props: SourceSelectorProps) {
 		super(props);
@@ -245,19 +239,6 @@ export class SourceSelector extends React.Component<
 		this.onDrop = this.onDrop.bind(this);
 		this.showSelectedImageDetails = this.showSelectedImageDetails.bind(this);
 		this.afterSelected = props.afterSelected.bind(this);
-
-		this.flows = [
-			{
-				onClick: this.openImageSelector,
-				label: 'Flash from file',
-				icon: <FontAwesomeIcon icon={faFile} />,
-			},
-			{
-				onClick: this.openURLSelector,
-				label: 'Flash from URL',
-				icon: <FontAwesomeIcon icon={faLink} />,
-			},
-		];
 	}
 
 	public componentDidMount() {
@@ -376,7 +357,7 @@ export class SourceSelector extends React.Component<
 		}
 
 		let source;
-		if (SourceType.name === sourceDestination.File.name) {
+		if (SourceType === sourceDestination.File) {
 			source = new sourceDestination.File({
 				path: imagePath,
 			});
@@ -545,9 +526,24 @@ export class SourceSelector extends React.Component<
 							</>
 						) : (
 							<StepSelection>
-								{_.map(this.flows, flow => {
-									return <FlowSelector key={flow.label} flow={flow} />;
-								})}
+								<FlowSelector
+									key="Flash from file"
+									flow={{
+										onClick: this.openImageSelector,
+										label: 'Flash from file',
+										icon: <FontAwesomeIcon icon={faFile} />,
+									}}
+								/>
+								;
+								<FlowSelector
+									key="Flash from URL"
+									flow={{
+										onClick: this.openURLSelector,
+										label: 'Flash from URL',
+										icon: <FontAwesomeIcon icon={faLink} />,
+									}}
+								/>
+								;
 							</StepSelection>
 						)}
 					</div>
@@ -593,7 +589,7 @@ export class SourceSelector extends React.Component<
 
 				{showURLSelector && (
 					<URLSelector
-						done={(imagePath: string) => {
+						done={async (imagePath: string) => {
 							// Avoid analytics and selection state changes
 							// if no file was resolved from the dialog.
 							if (!imagePath) {
@@ -609,7 +605,7 @@ export class SourceSelector extends React.Component<
 								return;
 							}
 
-							this.selectImageByPath({
+							await this.selectImageByPath({
 								imagePath,
 								SourceType: sourceDestination.Http,
 							});