diff --git a/packages/gatsby-cli/package.json b/packages/gatsby-cli/package.json index 43afa9f883d7f..b1a36dfe14ed4 100644 --- a/packages/gatsby-cli/package.json +++ b/packages/gatsby-cli/package.json @@ -33,7 +33,6 @@ "object.entries": "^1.1.0", "opentracing": "^0.14.3", "pretty-error": "^2.1.1", - "progress": "^2.0.3", "prompts": "^2.1.0", "react": "^16.8.4", "resolve-cwd": "^2.0.0", diff --git a/packages/gatsby-cli/src/reporter/index.js b/packages/gatsby-cli/src/reporter/index.js index 37d2581092869..d0d4c4e71bd6b 100644 --- a/packages/gatsby-cli/src/reporter/index.js +++ b/packages/gatsby-cli/src/reporter/index.js @@ -93,88 +93,13 @@ const reporter: Reporter = { const spanArgs = parentSpan ? { childOf: parentSpan } : {} const span = tracer.startSpan(name, spanArgs) - const activity = reporterInstance.createActivity({ - type: `spinner`, - id: name, - status: ``, - }) + const activity = reporterInstance.createActivity(name) return { - start() { - activity.update({ - startTime: process.hrtime(), - }) - }, - setStatus(status) { - activity.update({ - status: status, - }) - }, + ...activity, end() { span.finish() - activity.done() - }, - span, - } - }, - - /** - * Create a progress bar for an activity - * @param {string} name - Name of activity. - * @param {number} total - Total items to be processed. - * @param {number} start - Start count to show. - * @param {ActivityArgs} activityArgs - optional object with tracer parentSpan - * @returns {ActivityTracker} The activity tracker. - */ - createProgress( - name: string, - total, - start = 0, - activityArgs: ActivityArgs = {} - ): ActivityTracker { - const { parentSpan } = activityArgs - const spanArgs = parentSpan ? { childOf: parentSpan } : {} - const span = tracer.startSpan(name, spanArgs) - - let hasStarted = false - let current = start - const activity = reporterInstance.createActivity({ - type: `progress`, - id: name, - current, - total, - }) - - return { - start() { - if (hasStarted) { - return - } - - hasStarted = true - activity.update({ - startTime: process.hrtime(), - }) - }, - setStatus(status) { - activity.update({ - status: status, - }) - }, - tick() { - activity.update({ - current: ++current, - }) - }, - done() { - span.finish() - activity.done() - }, - set total(value) { - total = value - activity.update({ - total: value, - }) + activity.end() }, span, } diff --git a/packages/gatsby-cli/src/reporter/reporters/ink/components/spinner.js b/packages/gatsby-cli/src/reporter/reporters/ink/components/activity.js similarity index 61% rename from packages/gatsby-cli/src/reporter/reporters/ink/components/spinner.js rename to packages/gatsby-cli/src/reporter/reporters/ink/components/activity.js index 10f8a8033e57f..1dcb28fae507b 100644 --- a/packages/gatsby-cli/src/reporter/reporters/ink/components/spinner.js +++ b/packages/gatsby-cli/src/reporter/reporters/ink/components/activity.js @@ -1,7 +1,14 @@ import React from "react" +import convertHrtime from "convert-hrtime" import { Box } from "ink" import Spinner from "ink-spinner" +export const calcElapsedTime = startTime => { + const elapsed = process.hrtime(startTime) + + return convertHrtime(elapsed)[`seconds`].toFixed(3) +} + export default function Activity({ name, status }) { let statusText = name if (status) { diff --git a/packages/gatsby-cli/src/reporter/reporters/ink/components/progress-bar.js b/packages/gatsby-cli/src/reporter/reporters/ink/components/progress-bar.js deleted file mode 100644 index 6edc4253cbf1c..0000000000000 --- a/packages/gatsby-cli/src/reporter/reporters/ink/components/progress-bar.js +++ /dev/null @@ -1,43 +0,0 @@ -import React from "react" -import { Box } from "ink" -import calcElapsedTime from "../../../../util/calc-elapsed-time" - -const maxWidth = 30 -const minWidth = 10 - -const getLength = prop => String(prop).length - -export default function ProgressBar({ message, current, total, startTime }) { - const percentage = total ? Math.round((current / total) * 100) : 0 - const terminalWidth = process.stdout.columns || 80 - const availableWidth = - terminalWidth - - getLength(message) - - getLength(current) - - getLength(total) - - getLength(percentage) - - 11 // margins + extra characters - - const progressBarWidth = Math.max( - minWidth, - Math.min(maxWidth, availableWidth) - ) - - return ( - - - [ - - {`=`.repeat(((progressBarWidth - 2) * percentage) / 100)} - - ] - - {calcElapsedTime(startTime)} s - - {current}/{total} - - {`` + percentage}% - {message} - - ) -} diff --git a/packages/gatsby-cli/src/reporter/reporters/ink/reporter.js b/packages/gatsby-cli/src/reporter/reporters/ink/reporter.js index 0c26af36de5dc..f5e220638e742 100644 --- a/packages/gatsby-cli/src/reporter/reporters/ink/reporter.js +++ b/packages/gatsby-cli/src/reporter/reporters/ink/reporter.js @@ -1,29 +1,19 @@ import React from "react" import { Static, Box } from "ink" +import { isCI } from "ci-info" import chalk from "chalk" -import Spinner from "./components/spinner" -import ProgressBar from "./components/progress-bar" +import Activity, { calcElapsedTime } from "./components/activity" import { Message } from "./components/messages" -import isTTY from "../../../util/is-tty" -import calcElapsedTime from "../../../util/calc-elapsed-time" - -const showProgress = isTTY - -const successTextGenerator = { - spinner: activity => { - let successText = `${activity.id} - ${calcElapsedTime( - activity.startTime - )} s` - if (activity.status) { - successText += ` — ${activity.status}` - } - return successText - }, - progress: activity => - `${activity.id} — ${activity.current}/${activity.total} - ${calcElapsedTime( - activity.startTime - )} s`, +const showProgress = process.stdout.isTTY && !isCI + +const generateActivityFinishedText = (name, activity) => { + let successText = `${name} - ${calcElapsedTime(activity.startTime)} s` + if (activity.status) { + successText += ` — ${activity.status}` + } + + return successText } export default class GatsbyReporter extends React.Component { @@ -36,40 +26,44 @@ export default class GatsbyReporter extends React.Component { format = chalk - createActivity = ({ id, ...options }) => { - this.setState(state => { - return { - activities: { - ...state.activities, - [id]: { - id, - ...options, - }, - }, - } - }) - + createActivity = name => { return { - update: newState => { + start: () => { + this.setState(state => { + return { + activities: { + ...state.activities, + [name]: { + status: ``, + startTime: process.hrtime(), + }, + }, + } + }) + }, + setStatus: status => { this.setState(state => { + const activity = state.activities[name] + return { activities: { ...state.activities, - [id]: { - ...state.activities[id], - ...newState, + [name]: { + ...activity, + status: status, }, }, } }) }, - done: () => { - const activity = this.state.activities[id] - this.success(successTextGenerator[activity.type]({ id, ...activity })) + end: () => { + const activity = this.state.activities[name] + + this.success(generateActivityFinishedText(name, activity)) this.setState(state => { const activities = { ...state.activities } - delete activities[id] + delete activities[name] return { activities, @@ -122,48 +116,27 @@ export default class GatsbyReporter extends React.Component { } render() { - const { activities, messages, disableColors } = this.state - - const spinners = [] - const progressBars = [] - if (showProgress) { - Object.keys(activities).forEach(activityName => { - const activity = activities[activityName] - if (activity.type === `spinner`) { - spinners.push(activity) - } - if (activity.type === `progress` && activity.startTime) { - progressBars.push(activity) - } - }) - } - return ( - {messages.map((msg, index) => ( + {this.state.messages.map((msg, index) => ( - + {msg.text} ))} - {spinners.map(activity => ( - - ))} - - {progressBars.map(activity => ( - - ))} + {showProgress && + Object.keys(this.state.activities).map(activityName => ( + + ))} ) diff --git a/packages/gatsby-cli/src/reporter/reporters/yurnalist/index.js b/packages/gatsby-cli/src/reporter/reporters/yurnalist/index.js index 537e25eb018a5..45e3954d5a4fb 100644 --- a/packages/gatsby-cli/src/reporter/reporters/yurnalist/index.js +++ b/packages/gatsby-cli/src/reporter/reporters/yurnalist/index.js @@ -1,8 +1,7 @@ // @flow const { createReporter } = require(`yurnalist`) -const ProgressBar = require(`progress`) -const calcElapsedTime = require(`../../../util/calc-elapsed-time`) +const convertHrtime = require(`convert-hrtime`) const VERBOSE = process.env.gatsby_log_level === `verbose` const reporter = createReporter({ emoji: true, verbose: VERBOSE }) @@ -30,69 +29,36 @@ module.exports = { info: reporter.info.bind(reporter), warn: reporter.warn.bind(reporter), log: reporter.log.bind(reporter), + /** + * Time an activity. + * @param {string} name - Name of activity. + * @returns {string} The elapsed time of activity. + */ + createActivity(name) { + const spinner = reporter.activity() + const start = process.hrtime() + let status - createActivity: activity => { - let start - - if (activity.type === `spinner`) { - const spinner = reporter.activity() - let status - - return { - update: newState => { - if (newState.startTime) { - start = newState.startTime - spinner.tick(activity.id) - } - if (newState.status) { - status = newState.status - spinner.tick(`${activity.id} — ${newState.status}`) - } - }, - done: () => { - const str = status - ? `${activity.id} — ${calcElapsedTime(start)} — ${status}` - : `${activity.id} — ${calcElapsedTime(start)}` - reporter.success(str) - spinner.end() - }, - } - } - - if (activity.type === `progress`) { - const bar = new ProgressBar( - ` [:bar] :current/:total :elapsed s :percent ${activity.id}`, - { - total: 0, - width: 30, - clear: true, - } - ) - return { - update: newState => { - if (newState.startTime) { - start = newState.startTime - } - if (newState.total) { - bar.total = newState.total - } - if (newState.current) { - bar.tick() - } - }, - done: () => { - reporter.success( - `${activity.id} — ${bar.curr}/${bar.total} - ${calcElapsedTime( - start - )} s` - ) - }, - } + const elapsedTime = () => { + var elapsed = process.hrtime(start) + return `${convertHrtime(elapsed)[`seconds`].toFixed(3)} s` } return { - update: () => {}, - done: () => {}, + start: () => { + spinner.tick(name) + }, + setStatus: s => { + status = s + spinner.tick(`${name} — ${status}`) + }, + end: () => { + const str = status + ? `${name} — ${elapsedTime()} — ${status}` + : `${name} — ${elapsedTime()}` + reporter.success(str) + spinner.end() + }, } }, } diff --git a/packages/gatsby-cli/src/util/calc-elapsed-time.js b/packages/gatsby-cli/src/util/calc-elapsed-time.js deleted file mode 100644 index 336ed74eee561..0000000000000 --- a/packages/gatsby-cli/src/util/calc-elapsed-time.js +++ /dev/null @@ -1,7 +0,0 @@ -const convertHrtime = require(`convert-hrtime`) - -module.exports = startTime => { - const elapsed = process.hrtime(startTime) - - return convertHrtime(elapsed)[`seconds`].toFixed(3) -} diff --git a/packages/gatsby-plugin-sharp/package.json b/packages/gatsby-plugin-sharp/package.json index ed31f1cb3e9ae..26c0eca5b1d7c 100644 --- a/packages/gatsby-plugin-sharp/package.json +++ b/packages/gatsby-plugin-sharp/package.json @@ -19,7 +19,7 @@ "mini-svg-data-uri": "^1.0.0", "potrace": "^2.1.1", "probe-image-size": "^4.0.0", - "progress": "^2.0.3", + "progress": "^1.1.8", "semver": "^5.6.0", "sharp": "^0.22.1", "svgo": "^1.2.0" diff --git a/packages/gatsby-plugin-sharp/src/__tests__/utils.js b/packages/gatsby-plugin-sharp/src/__tests__/utils.js deleted file mode 100644 index fbf9a10c32338..0000000000000 --- a/packages/gatsby-plugin-sharp/src/__tests__/utils.js +++ /dev/null @@ -1,23 +0,0 @@ -jest.mock(`gatsby-cli/lib/reporter`) -jest.mock(`progress`) -const { createProgress } = require(`../utils`) -const reporter = require(`gatsby-cli/lib/reporter`) -const progress = require(`progress`) - -describe(`createProgress`, () => { - it(`should use createProgress from gatsby-cli when available`, () => { - createProgress(`test`) - expect(reporter.createProgress).toBeCalled() - expect(progress).not.toBeCalled() - }) - - it(`should fallback to a local implementation`, () => { - reporter.createProgress = null - const bar = createProgress(`test`) - expect(progress).toHaveBeenCalledTimes(1) - expect(bar).toHaveProperty(`start`, expect.any(Function)) - expect(bar).toHaveProperty(`tick`, expect.any(Function)) - expect(bar).toHaveProperty(`done`, expect.any(Function)) - expect(bar).toHaveProperty(`total`) - }) -}) diff --git a/packages/gatsby-plugin-sharp/src/scheduler.js b/packages/gatsby-plugin-sharp/src/scheduler.js index b91b9c489c0df..21cd7fa223dc4 100644 --- a/packages/gatsby-plugin-sharp/src/scheduler.js +++ b/packages/gatsby-plugin-sharp/src/scheduler.js @@ -1,8 +1,8 @@ const _ = require(`lodash`) +const ProgressBar = require(`progress`) const { existsSync } = require(`fs`) const queue = require(`async/queue`) const { processFile } = require(`./process-file`) -const { createProgress } = require(`./utils`) const toProcess = {} let totalJobs = 0 @@ -10,14 +10,13 @@ const q = queue((task, callback) => { task(callback) }, 1) -let bar -// when the queue is empty we stop the progressbar -q.drain = () => { - if (bar) { - bar.done() +const bar = new ProgressBar( + `Generating image thumbnails [:bar] :current/:total :elapsed secs :percent`, + { + total: 0, + width: 30, } - totalJobs = 0 -} +) exports.scheduleJob = async ( job, @@ -51,10 +50,6 @@ exports.scheduleJob = async ( deferred.resolve = resolve deferred.reject = reject }) - if (totalJobs === 0) { - bar = createProgress(`Generating image thumbnails`) - bar.start() - } totalJobs += 1 @@ -112,7 +107,6 @@ function runJobs( // We're now processing the file's jobs. let imagesFinished = 0 - bar.total = totalJobs try { diff --git a/packages/gatsby-plugin-sharp/src/utils.js b/packages/gatsby-plugin-sharp/src/utils.js deleted file mode 100644 index 542be70d8c19a..0000000000000 --- a/packages/gatsby-plugin-sharp/src/utils.js +++ /dev/null @@ -1,29 +0,0 @@ -const ProgressBar = require(`progress`) -const reporter = require(`gatsby-cli/lib/reporter`) - -// TODO remove in V3 -export function createProgress(message) { - if (reporter.createProgress) { - return reporter.createProgress(message) - } - - const bar = new ProgressBar( - ` [:bar] :current/:total :elapsed s :percent ${message}`, - { - total: 0, - width: 30, - clear: true, - } - ) - - return { - start() {}, - tick() { - bar.tick() - }, - done() {}, - set total(value) { - bar.total = value - }, - } -} diff --git a/packages/gatsby-source-filesystem/package.json b/packages/gatsby-source-filesystem/package.json index 1e892f58f7180..55d9421966b42 100644 --- a/packages/gatsby-source-filesystem/package.json +++ b/packages/gatsby-source-filesystem/package.json @@ -17,7 +17,7 @@ "md5-file": "^3.1.1", "mime": "^2.2.0", "pretty-bytes": "^4.0.2", - "progress": "^2.0.3", + "progress": "^1.1.8", "read-chunk": "^3.0.0", "valid-url": "^1.0.9", "xstate": "^3.1.0" diff --git a/packages/gatsby-source-filesystem/src/__tests__/create-remote-file-node.js b/packages/gatsby-source-filesystem/src/__tests__/create-remote-file-node.js index 899c2074b61d3..44aa34d2cae53 100644 --- a/packages/gatsby-source-filesystem/src/__tests__/create-remote-file-node.js +++ b/packages/gatsby-source-filesystem/src/__tests__/create-remote-file-node.js @@ -19,31 +19,30 @@ jest.mock(`got`, () => { stream: jest.fn(), } }) - -jest.mock(`gatsby-cli/lib/reporter`, () => { - return { - createProgress: jest.fn(), - } -}) +jest.mock( + `progress`, + () => + class ProgressBar { + static total = 0 + static tick = jest.fn(() => (ProgressBar.total -= 1)) + + total = ProgressBar.total + tick = ProgressBar.tick + } +) jest.mock(`../create-file-node`, () => { return { createFileNode: jest.fn(), } }) -const { createProgress } = require(`gatsby-cli/lib/reporter`) -const progressBar = { - start: jest.fn(), - total: 0, - tick: jest.fn(), -} -createProgress.mockImplementation(() => progressBar) - const got = require(`got`) +const ProgressBar = require(`progress`) const createRemoteFileNode = require(`../create-remote-file-node`) const { createFileNode } = require(`../create-file-node`) beforeEach(() => { - progressBar.tick.mockClear() + ProgressBar.total = 0 + ProgressBar.tick.mockClear() }) describe(`create-remote-file-node`, () => { @@ -74,8 +73,8 @@ describe(`create-remote-file-node`, () => { expect(value).rejects.toMatch(`wrong url: `) - expect(progressBar.total).toBe(0) - expect(progressBar.tick).not.toHaveBeenCalled() + expect(ProgressBar.total).toBe(0) + expect(ProgressBar.tick).not.toHaveBeenCalled() }) }) }) @@ -142,8 +141,7 @@ describe(`create-remote-file-node`, () => { it(`invokes ProgressBar tick`, async () => { await setup() - expect(progressBar.total).toBe(1) - expect(progressBar.tick).toHaveBeenCalledTimes(1) + expect(ProgressBar.tick).toHaveBeenCalledTimes(1) }) describe(`requesting remote image`, () => { diff --git a/packages/gatsby-source-filesystem/src/__tests__/utils.js b/packages/gatsby-source-filesystem/src/__tests__/utils.js index f19121f8c05b3..298a7fe8f982a 100644 --- a/packages/gatsby-source-filesystem/src/__tests__/utils.js +++ b/packages/gatsby-source-filesystem/src/__tests__/utils.js @@ -1,13 +1,4 @@ -jest.mock(`gatsby-cli/lib/reporter`) -jest.mock(`progress`) -const { - getRemoteFileExtension, - getRemoteFileName, - createProgress, - slash, -} = require(`../utils`) -const reporter = require(`gatsby-cli/lib/reporter`) -const progress = require(`progress`) +const { getRemoteFileExtension, getRemoteFileName, slash } = require(`../utils`) describe(`create remote file node`, () => { it(`can correctly retrieve file name and extensions`, () => { @@ -32,24 +23,6 @@ describe(`create remote file node`, () => { }) }) -describe(`createProgress`, () => { - it(`should use createProgress from gatsby-cli when available`, () => { - createProgress(`test`) - expect(reporter.createProgress).toBeCalled() - expect(progress).not.toBeCalled() - }) - - it(`should fallback to a local implementation`, () => { - reporter.createProgress = null - const bar = createProgress(`test`) - expect(progress).toHaveBeenCalledTimes(1) - expect(bar).toHaveProperty(`start`, expect.any(Function)) - expect(bar).toHaveProperty(`tick`, expect.any(Function)) - expect(bar).toHaveProperty(`done`, expect.any(Function)) - expect(bar).toHaveProperty(`total`) - }) -}) - describe(`slash path`, () => { it(`can correctly slash path`, () => { ;[ @@ -61,7 +34,6 @@ describe(`slash path`, () => { expect(slash(path)).toBe(expectRes) }) }) - it(`does not modify extended length paths`, () => { const extended = `\\\\?\\some\\path` expect(slash(extended)).toBe(extended) diff --git a/packages/gatsby-source-filesystem/src/create-remote-file-node.js b/packages/gatsby-source-filesystem/src/create-remote-file-node.js index a764a5384d565..8471d1dbf4e1c 100644 --- a/packages/gatsby-source-filesystem/src/create-remote-file-node.js +++ b/packages/gatsby-source-filesystem/src/create-remote-file-node.js @@ -6,15 +6,19 @@ const { isWebUri } = require(`valid-url`) const Queue = require(`better-queue`) const readChunk = require(`read-chunk`) const fileType = require(`file-type`) -const { createProgress } = require(`./utils`) +const ProgressBar = require(`progress`) const { createFileNode } = require(`./create-file-node`) const { getRemoteFileExtension, getRemoteFileName } = require(`./utils`) const cacheId = url => `create-remote-file-node-${url}` -let bar -// Keep track of the total number of jobs we push in the queue -let totalJobs = 0 +const bar = new ProgressBar( + `Downloading remote files [:bar] :current/:total :elapsed secs :percent`, + { + total: 0, + width: 30, + } +) /******************** * Type Definitions * @@ -80,14 +84,6 @@ const queue = new Queue(pushToQueue, { concurrent: process.env.GATSBY_CONCURRENT_DOWNLOAD || 200, }) -// when the queue is empty we stop the progressbar -queue.on(`drain`, () => { - if (bar) { - bar.done() - } - totalJobs = 0 -}) - /** * @callback {Queue~queueCallback} * @param {*} error @@ -275,6 +271,9 @@ const pushTask = task => }) }) +// Keep track of the total number of jobs we push in the queue +let totalJobs = 0 + /*************** * Entry Point * ***************/ @@ -330,11 +329,6 @@ module.exports = ({ return Promise.reject(`wrong url: ${url}`) } - if (totalJobs === 0) { - bar = createProgress(`Downloading remote files`) - bar.start() - } - totalJobs += 1 bar.total = totalJobs diff --git a/packages/gatsby-source-filesystem/src/utils.js b/packages/gatsby-source-filesystem/src/utils.js index 2d68cd317faf3..24e03f31e525d 100644 --- a/packages/gatsby-source-filesystem/src/utils.js +++ b/packages/gatsby-source-filesystem/src/utils.js @@ -1,7 +1,5 @@ const path = require(`path`) const Url = require(`url`) -const ProgressBar = require(`progress`) -const reporter = require(`gatsby-cli/lib/reporter`) /** * getParsedPath @@ -42,33 +40,6 @@ export function getRemoteFileName(url) { return getParsedPath(url).name } -// TODO remove in V3 -export function createProgress(message) { - if (reporter.createProgress) { - return reporter.createProgress(message) - } - - const bar = new ProgressBar( - ` [:bar] :current/:total :elapsed s :percent ${message}`, - { - total: 0, - width: 30, - clear: true, - } - ) - - return { - start() {}, - tick() { - bar.tick() - }, - done() {}, - set total(value) { - bar.total = value - }, - } -} - /** * slash * -- diff --git a/yarn.lock b/yarn.lock index a2e93a5ba0155..4f0d7ddecf269 100644 --- a/yarn.lock +++ b/yarn.lock @@ -17472,16 +17472,16 @@ process@~0.5.1: resolved "https://registry.yarnpkg.com/process/-/process-0.5.2.tgz#1638d8a8e34c2f440a91db95ab9aeb677fc185cf" integrity sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8= +progress@^1.1.8: + version "1.1.8" + resolved "https://registry.yarnpkg.com/progress/-/progress-1.1.8.tgz#e260c78f6161cdd9b0e56cc3e0a85de17c7a57be" + integrity sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74= + progress@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.0.tgz#8a1be366bf8fc23db2bd23f10c6fe920b4389d1f" integrity sha1-ihvjZr+Pwj2yvSPxDG/pILQ4nR8= -progress@^2.0.3: - version "2.0.3" - resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8" - integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA== - promise-inflight@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"