Merge pull request #3457 from NativeScript/fatme/components-spinner

Add spinner when checking for NativeScript components versions

Author: Fatme

lib/common

@@ -698,23 +698,17 @@ interface IVersionsService {
 	 */
 	getRuntimesVersions(): Promise<IVersionInformation[]>;
 
-	/**
-	 * Checks version information about the nativescript components and prints available updates if any.
-	 */
-	checkComponentsForUpdate(): Promise<void>;
-
 	/**
 	 * Gets versions information about all nativescript components.
 	 * @return {Promise<IVersionInformation[]>} The version information.
 	 */
 	getAllComponentsVersions(): Promise<IVersionInformation[]>;
 
 	/**
-	 * Creates table with versions information.
-	 * @param {IVersionInformation[]} The versions information to push in the table.
-	 * @return {any} The created table.
+	 * Checks version information about the nativescript components and prints versions information.
+	 * @return {Promise<void>}
 	 */
-	createTableWithVersionsInformation(versionsInformation: IVersionInformation[]): any;
+	printVersionsInformation(): Promise<void>;
 }
 
 /**

lib/declarations.d.ts

@@ -47,7 +47,7 @@ class DoctorService implements IDoctorService {
 		}
 
 		try {
-			await this.$versionsService.checkComponentsForUpdate();
+			await this.$versionsService.printVersionsInformation();
 		} catch (err) {
 			this.$logger.error("Cannot get the latest versions information from npm. Please try again later.");
 		}

lib/services/doctor-service.ts

@@ -1,14 +1,8 @@
 export class InfoService implements IInfoService {
-	constructor(private $versionsService: IVersionsService,
-		private $logger: ILogger) { }
+	constructor(private $versionsService: IVersionsService) { }
 
-	public async printComponentsInfo(): Promise<void> {
-		const allComponentsInfo = await this.$versionsService.getAllComponentsVersions();
-
-		const table: any = this.$versionsService.createTableWithVersionsInformation(allComponentsInfo);
-
-		this.$logger.out("All NativeScript components versions information");
-		this.$logger.out(table.toString());
+	public printComponentsInfo(): Promise<void> {
+		return this.$versionsService.printVersionsInformation();
 	}
 }
 

lib/services/info-service.ts

@@ -1,22 +1,28 @@
-import { EOL } from "os";
 import * as constants from "../constants";
+import * as helpers from "../common/helpers";
 import * as semver from "semver";
 import * as path from "path";
-import { createTable } from "../common/helpers";
+
+export enum VersionInformationType {
+	UpToDate = "UpToDate",
+	UpdateAvailable = "UpdateAvailable",
+	NotInstalled = "NotInstalled"
+}
 
 class VersionsService implements IVersionsService {
-	private static UP_TO_DATE_MESSAGE = "Up to date".green.toString();
-	private static UPDATE_AVAILABLE_MESSAGE = "Update available".yellow.toString();
-	private static NOT_INSTALLED_MESSAGE = "Not installed".grey.toString();
+	private static UP_TO_DATE_MESSAGE = "up to date";
+	private static UPDATE_AVAILABLE_MESSAGE = "Update available";
+	private static NOT_INSTALLED_MESSAGE = "not installed";
 
 	private projectData: IProjectData;
 
 	constructor(private $fs: IFileSystem,
 		private $npmInstallationManager: INpmInstallationManager,
 		private $injector: IInjector,
+		private $logger: ILogger,
 		private $staticConfig: Config.IStaticConfig,
 		private $pluginsService: IPluginsService,
-		private $logger: ILogger) {
+		private $terminalSpinnerService: ITerminalSpinnerService) {
 		this.projectData = this.getProjectData();
 	}
 
@@ -86,30 +92,6 @@ class VersionsService implements IVersionsService {
 		return runtimesVersions;
 	}
 
-	public async checkComponentsForUpdate(): Promise<void> {
-		const allComponents: IVersionInformation[] = await this.getAllComponentsVersions();
-		const componentsForUpdate: IVersionInformation[] = [];
-
-		_.forEach(allComponents, (component: IVersionInformation) => {
-			if (component.currentVersion && this.hasUpdate(component)) {
-				componentsForUpdate.push(component);
-			}
-		});
-
-		this.printVersionsInformation(componentsForUpdate, allComponents);
-	}
-
-	private printVersionsInformation(versionsInformation: IVersionInformation[], allComponents: IVersionInformation[]): void {
-		if (versionsInformation && versionsInformation.length) {
-			const table: any = this.createTableWithVersionsInformation(versionsInformation);
-
-			this.$logger.warn("Updates available");
-			this.$logger.out(table.toString() + EOL);
-		} else {
-			this.$logger.out(`Your components are up-to-date: ${EOL}${allComponents.map(component => component.componentName)}${EOL}`);
-		}
-	}
-
 	public async getAllComponentsVersions(): Promise<IVersionInformation[]> {
 		let allComponents: IVersionInformation[] = [];
 
@@ -127,30 +109,50 @@ class VersionsService implements IVersionsService {
 
 		allComponents = allComponents.concat(runtimesVersions);
 
-		return allComponents;
+		return allComponents
+			.map(componentInformation => {
+				if (componentInformation.currentVersion) {
+					if (this.hasUpdate(componentInformation)) {
+						componentInformation.type = VersionInformationType.UpdateAvailable;
+						componentInformation.message = `${VersionsService.UPDATE_AVAILABLE_MESSAGE} for component ${componentInformation.componentName}. Your current version is ${componentInformation.currentVersion} and the latest available version is ${componentInformation.latestVersion}.`;
+					} else {
+						componentInformation.type = VersionInformationType.UpToDate;
+						componentInformation.message = `Component ${componentInformation.componentName} has ${componentInformation.currentVersion} version and is ${VersionsService.UP_TO_DATE_MESSAGE}.`;
+					}
+				} else {
+					componentInformation.type = VersionInformationType.NotInstalled;
+					componentInformation.message = `Component ${componentInformation.componentName} is ${VersionsService.NOT_INSTALLED_MESSAGE}.`;
+				}
+
+				return componentInformation;
+			});
 	}
 
-	public createTableWithVersionsInformation(versionsInformation: IVersionInformation[]): any {
-		const headers = ["Component", "Current version", "Latest version", "Information"];
-		const data: string[][] = [];
-
-		_.forEach(versionsInformation, (componentInformation: IVersionInformation) => {
-			const row: string[] = [
-				componentInformation.componentName,
-				componentInformation.currentVersion,
-				componentInformation.latestVersion
-			];
-
-			if (componentInformation.currentVersion) {
-				semver.lt(componentInformation.currentVersion, componentInformation.latestVersion) ? row.push(VersionsService.UPDATE_AVAILABLE_MESSAGE) : row.push(VersionsService.UP_TO_DATE_MESSAGE);
-			} else {
-				row.push(VersionsService.NOT_INSTALLED_MESSAGE);
-			}
+	public async printVersionsInformation(): Promise<void> {
+		const versionsInformation = await this.$terminalSpinnerService.execute<IVersionInformation[]>({
+			text: `Getting NativeScript components versions information...`
+		}, () => this.getAllComponentsVersions());
 
-			data.push(row);
-		});
+		if (!helpers.isInteractive()) {
+			versionsInformation.map(componentInformation => this.$logger.out(componentInformation.message));
+		}
 
-		return createTable(headers, data);
+		_.forEach(versionsInformation, componentInformation => {
+			const spinner = this.$terminalSpinnerService.createSpinner();
+			spinner.text = componentInformation.message;
+
+			switch (componentInformation.type) {
+				case VersionInformationType.UpToDate:
+					spinner.succeed();
+					break;
+				case VersionInformationType.UpdateAvailable:
+					spinner.warn();
+					break;
+				case VersionInformationType.NotInstalled:
+					spinner.fail();
+					break;
+			}
+		});
 	}
 
 	private getProjectData(): IProjectData {