From d4c7092f8bd1d1ceb7936d1c86d90590d85a8455 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 17 Apr 2018 14:39:19 +0100 Subject: [PATCH 01/13] =?UTF-8?q?doh.=20it's=20a=20dependency=20matt=20=20?= =?UTF-8?q?=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/x-docs/package.json | 3 --- packages/x-docs/static/storybook | 2 +- packages/x-workbench/package.json | 3 ++- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/x-docs/package.json b/packages/x-docs/package.json index d63412a50..d2738c332 100644 --- a/packages/x-docs/package.json +++ b/packages/x-docs/package.json @@ -45,9 +45,6 @@ "license": "MIT", "scripts": { "build": "gatsby build --prefix-paths", - "build-storybook": "cd ../x-workbench && npm run build && cd ../x-docs", - "prestart": "npm run build-storybook", - "prebuild": "npm run build-storybook", "start": "nodemon -x 'gatsby develop' -w \"gatsby-*.js\"", "postinstall": "bower install" }, diff --git a/packages/x-docs/static/storybook b/packages/x-docs/static/storybook index 45d100cf3..09cc02df4 120000 --- a/packages/x-docs/static/storybook +++ b/packages/x-docs/static/storybook @@ -1 +1 @@ -../../x-workbench/dist/storybook/ \ No newline at end of file +../node_modules/@financial-times/x-workbench/dist/storybook/ \ No newline at end of file diff --git a/packages/x-workbench/package.json b/packages/x-workbench/package.json index c3afb7530..f74a32725 100644 --- a/packages/x-workbench/package.json +++ b/packages/x-workbench/package.json @@ -6,7 +6,8 @@ "main": "stories.js", "scripts": { "storybook": "start-storybook -p 9001 -c .storybook", - "build": "build-storybook -c .storybook -o dist/storybook" + "build": "build-storybook -c .storybook -o dist/storybook", + "prepare": "npm run build" }, "keywords": [], "author": "", From f7466da5e7a66b45cee54ea7d9493cec3b2a1829 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 17 Apr 2018 14:42:53 +0100 Subject: [PATCH 02/13] =?UTF-8?q?streaming=20=20=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 8058a174f..ed76e9bfd 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,8 @@ "postinstall": "lerna bootstrap", "rebootstrap": "lerna clean --yes && lerna bootstrap", "add-package": "addpackage() { mkdir packages/$1 ; pushd packages/$1 ; npm init -y --scope=financial-times ; popd ; } ; addpackage", - "pretest": "lerna run build", + "build": "lerna run build --stream", + "pretest": "npm run build", "test": "jest -c jest.config.js", "precommit": "secret-squirrel", "commitmsg": "secret-squirrel-commitmsg" From 28d39f500b16d42f1d8bd0551192e7388dcd5e9e Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 17 Apr 2018 14:47:08 +0100 Subject: [PATCH 03/13] =?UTF-8?q?start=20scripts=20=20=F0=9F=90=BF=20v2.8.?= =?UTF-8?q?0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + packages/x-teaser/package.json | 3 ++- packages/x-workbench/package.json | 2 +- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index ed76e9bfd..cead7b2c4 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "build": "lerna run build --stream", "pretest": "npm run build", "test": "jest -c jest.config.js", + "start": "lerna run start --parallel", "precommit": "secret-squirrel", "commitmsg": "secret-squirrel-commitmsg" }, diff --git a/packages/x-teaser/package.json b/packages/x-teaser/package.json index fb03f7872..52f4e4d97 100644 --- a/packages/x-teaser/package.json +++ b/packages/x-teaser/package.json @@ -8,7 +8,8 @@ "types": "Props.d.ts", "scripts": { "prepare": "npm run build", - "build": "rollup -c rollup.config.js" + "build": "rollup -c rollup.config.js", + "start": "rollup --watch -c rollup.config.js" }, "keywords": [], "author": "", diff --git a/packages/x-workbench/package.json b/packages/x-workbench/package.json index f74a32725..ad07a0742 100644 --- a/packages/x-workbench/package.json +++ b/packages/x-workbench/package.json @@ -5,7 +5,7 @@ "description": "", "main": "stories.js", "scripts": { - "storybook": "start-storybook -p 9001 -c .storybook", + "start": "start-storybook -p 9001 -c .storybook & sleep 3 ; open http://localhost:9001", "build": "build-storybook -c .storybook -o dist/storybook", "prepare": "npm run build" }, From c96a20ca3bf17a9678d584c8eb59993599580e0d Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 17 Apr 2018 14:53:38 +0100 Subject: [PATCH 04/13] =?UTF-8?q?actually=20don't=20open=20storybook=20=20?= =?UTF-8?q?=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/x-workbench/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/x-workbench/package.json b/packages/x-workbench/package.json index ad07a0742..a476e02af 100644 --- a/packages/x-workbench/package.json +++ b/packages/x-workbench/package.json @@ -5,7 +5,7 @@ "description": "", "main": "stories.js", "scripts": { - "start": "start-storybook -p 9001 -c .storybook & sleep 3 ; open http://localhost:9001", + "start": "start-storybook -p 9001 -c .storybook", "build": "build-storybook -c .storybook -o dist/storybook", "prepare": "npm run build" }, From 1222b4510552ea4a0d9db186dc0fffb12c1436dc Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 17 Apr 2018 14:54:57 +0100 Subject: [PATCH 05/13] =?UTF-8?q?force=20colour=20in=20subcommands=20=20?= =?UTF-8?q?=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index cead7b2c4..8ddea0093 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "build": "lerna run build --stream", "pretest": "npm run build", "test": "jest -c jest.config.js", - "start": "lerna run start --parallel", + "start": "FORCE_COLOR=1 lerna run start --parallel", "precommit": "secret-squirrel", "commitmsg": "secret-squirrel-commitmsg" }, From 14de9a8dce0e62523f484f23ef51f69ddf70b69e Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Wed, 18 Apr 2018 14:26:17 +0100 Subject: [PATCH 06/13] =?UTF-8?q?private=20doesn't=20contain=20packages=20?= =?UTF-8?q?=20=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lerna.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/lerna.json b/lerna.json index db3e5bc2d..111465c53 100644 --- a/lerna.json +++ b/lerna.json @@ -1,7 +1,6 @@ { "packages": [ - "packages/*", - "private/*" + "packages/*" ], "version": "1.0.0-1" } From 136f50dd2e36a096c628a6696a39de0ad9840ecd Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Mon, 23 Apr 2018 12:43:36 +0100 Subject: [PATCH 07/13] =?UTF-8?q?add=20athloi=20script=20as=20start,=20ann?= =?UTF-8?q?oying=20makefile=20=20=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- makefile | 9 +++++++++ package.json | 5 ++++- secret-squirrel.js | 1 + 3 files changed, 14 insertions(+), 1 deletion(-) create mode 100644 makefile diff --git a/makefile b/makefile new file mode 100644 index 000000000..c4c380179 --- /dev/null +++ b/makefile @@ -0,0 +1,9 @@ +install: + @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm install\e[0m\n\n" + @sleep 3 + npm install + +run: + @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm start\e[0m\n\n" + @sleep 3 + npm start diff --git a/package.json b/package.json index 8ddea0093..2b3ade936 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "build": "lerna run build --stream", "pretest": "npm run build", "test": "jest -c jest.config.js", - "start": "FORCE_COLOR=1 lerna run start --parallel", + "start": "athloi", "precommit": "secret-squirrel", "commitmsg": "secret-squirrel-commitmsg" }, @@ -26,5 +26,8 @@ "factory": "createElement" } } + }, + "dependencies": { + "athloi": "^1.0.0" } } diff --git a/secret-squirrel.js b/secret-squirrel.js index bfa7c48de..12d4d0fc3 100644 --- a/secret-squirrel.js +++ b/secret-squirrel.js @@ -1,6 +1,7 @@ module.exports = { files: { allow: [ + 'makefile', 'packages/x-docs/.bowerrc', 'packages/x-docs/LICENSE', 'packages/x-docs/static/storybook', From 1eb375f47ae5b1ce37cb8493b3c18144507f101f Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Mon, 23 Apr 2018 12:44:24 +0100 Subject: [PATCH 08/13] =?UTF-8?q?athloi=20for=20build=20script=20=20?= =?UTF-8?q?=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 2b3ade936..3981f4f7c 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "postinstall": "lerna bootstrap", "rebootstrap": "lerna clean --yes && lerna bootstrap", "add-package": "addpackage() { mkdir packages/$1 ; pushd packages/$1 ; npm init -y --scope=financial-times ; popd ; } ; addpackage", - "build": "lerna run build --stream", + "build": "athloi build", "pretest": "npm run build", "test": "jest -c jest.config.js", "start": "athloi", From c76bd9e92264afd0d49d502518fe2cf4718009c8 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Mon, 23 Apr 2018 13:20:33 +0100 Subject: [PATCH 09/13] =?UTF-8?q?move=20dev=20guide=20to=20top=20and=20add?= =?UTF-8?q?=20more=20details=20=20=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- readme.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/readme.md b/readme.md index bae86fc31..9439adf76 100644 --- a/readme.md +++ b/readme.md @@ -6,6 +6,12 @@ +## Developer guide + +This is a [Lerna](https://github.com/lerna/lerna) monorepo. To get started hacking on x-dash, clone it and `npm install` as usual, and Lerna will install and link together all the individual packages. + +Run `npm start` to open the developer interface, which shows a list of tasks. Choose one to run it and it'll tell you a shortcut to run that task in the future. + ## What is this? x-dash is an experiment in building new shared frontend components for FT.com and the FT Apps. A detailed introduction is available in [Google Slides][slides]. @@ -17,9 +23,3 @@ x-dash is an experiment in building new shared frontend components for FT.com an Origami components are designed to work across the whole of FT and our sub-brands, making as few assumptions as possible about the tech stack that will be consuming them. Origami components don't contain templating, only styles and behaviour. It's up to each individual app to produce markup for components. x-dash aims to complement Origami by providing easily reusable and composable templates, flexibly enough to work across Next and Apps apps. - -## Developer guide - -This is a [Lerna](https://github.com/lerna/lerna) monorepo. To get started hacking on x-dash, clone it and `npm install` as usual, and Lerna will install and link together all the individual packages. - -To add a new package, run `npm run add-package -- package-name`. From 2fac796661dbb94ac038d0f3a18b00064df00609 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Mon, 23 Apr 2018 14:48:00 +0100 Subject: [PATCH 10/13] =?UTF-8?q?build=20makefile=20task=20=20=F0=9F=90=BF?= =?UTF-8?q?=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- makefile | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/makefile b/makefile index c4c380179..496ed348d 100644 --- a/makefile +++ b/makefile @@ -7,3 +7,8 @@ run: @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm start\e[0m\n\n" @sleep 3 npm start + +build: + @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm run build\e[0m\n\n" + @sleep 3 + npm run build From d54ee89c43a40fabad1ed4f96dc7e6ca3fded726 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Mon, 23 Apr 2018 17:23:16 +0100 Subject: [PATCH 11/13] =?UTF-8?q?scary=20makefile=20warning=20=20?= =?UTF-8?q?=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- makefile | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/makefile b/makefile index 496ed348d..2384ef7e8 100644 --- a/makefile +++ b/makefile @@ -1,3 +1,7 @@ +# DO NOT ADD TASKS TO THIS MAKEFILE +# these tasks exist for principle-of-least-surprise purposes for people coming +# here from next-land. this makefile should not be used for anything else + install: @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm install\e[0m\n\n" @sleep 3 From 12a6fe73f1456f6435934aeabbe4274324585f5f Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 24 Apr 2018 09:34:16 +0100 Subject: [PATCH 12/13] =?UTF-8?q?slightly=20more=20friendly=20warning=20?= =?UTF-8?q?=20=F0=9F=90=BF=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- makefile | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/makefile b/makefile index 2384ef7e8..8fdc9a7ae 100644 --- a/makefile +++ b/makefile @@ -1,6 +1,7 @@ # DO NOT ADD TASKS TO THIS MAKEFILE # these tasks exist for principle-of-least-surprise purposes for people coming -# here from next-land. this makefile should not be used for anything else +# here from next-land. this makefile should not be used for anything else. +# instead, use per-package npm scripts install: @printf "\n \e[1;34m☞\e[0m this is the same as running \e[3;36mnpm install\e[0m\n\n" From 006cd52bd9aad9bd3ac9d54ba51d7ad4ddbd6ab8 Mon Sep 17 00:00:00 2001 From: Matt Brennan Date: Tue, 24 Apr 2018 10:47:29 +0100 Subject: [PATCH 13/13] =?UTF-8?q?athloi=20custom=20tasks=20=20=F0=9F=90=BF?= =?UTF-8?q?=20v2.8.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- athloi.js | 42 ++++++++++++++++++++++++++++++++++++++++++ package.json | 8 ++++---- 2 files changed, 46 insertions(+), 4 deletions(-) create mode 100644 athloi.js diff --git a/athloi.js b/athloi.js new file mode 100644 index 000000000..f898257b4 --- /dev/null +++ b/athloi.js @@ -0,0 +1,42 @@ +const open = require('opn'); +const tcpPortUsed = require('tcp-port-used'); +const url = require('url'); + +const openUrls = { + docs: 'http://localhost:8000', + storybook: 'http://localhost:9001', +}; + +module.exports = ({tasks, prompt, addPrompt}) => ({ + start: Object.assign({}, tasks.start, { + requiredArgs: ['open'], + + choice: addPrompt( + tasks.start.choice, + () => prompt([{ + type: 'list', + name: 'open', + message: 'What do you want to open in the browser?', + choices: [ + {value: 'docs', short: 'Docs', name: 'The documentation website'}, + {value: 'storybook', short: 'Storybook', name: 'The component explorer'}, + ] + }]) + ), + + run(options) { + const openUrl = openUrls[options.open]; + const port = parseInt(url.parse(openUrl).port, 10); + + if(port) { + // wait for whatever (storybook/gatsby) to be listening on the port + // try every 500ms and give up after 30s + tcpPortUsed.waitUntilUsed(port, 500, 30000) + .then(() => open(openUrl)) + .catch(e => console.error(e.stack)); + } + + return tasks.start.run(options); + }, + }), +}); diff --git a/package.json b/package.json index 3981f4f7c..501d29d93 100644 --- a/package.json +++ b/package.json @@ -13,11 +13,14 @@ }, "devDependencies": { "@financial-times/secret-squirrel": "^2.8.0", + "athloi": "^1.2.0", "husky": "^0.14.3", "jest": "^22.4.3", "lerna": "^3.0.0-beta.16", + "opn": "^5.3.0", "react": "^16.3.1", - "react-test-renderer": "^16.3.1" + "react-test-renderer": "^16.3.1", + "tcp-port-used": "^0.1.2" }, "x-dash": { "engine": { @@ -26,8 +29,5 @@ "factory": "createElement" } } - }, - "dependencies": { - "athloi": "^1.0.0" } }