Skip to content

Commit

Permalink
v2.0.0-rc.5 (#87)
Browse files Browse the repository at this point in the history
* feat(sub-generators): tests question added to function sub-generator
* feat(sub-generators): function event type query added to function sub-generator
* feat(sub-generators): function trigger type can now be passed as a flag
* feat(sub-generators): sub-generators now accept basePath parameter to run generator from a nested path
* feat(generator): babel-plugin-module-resolver added to `functions` template
  • Loading branch information
prescottprue authored Mar 26, 2018
1 parent 9ca6ac3 commit c3d6ded
Show file tree
Hide file tree
Showing 30 changed files with 688 additions and 3,375 deletions.
60 changes: 55 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ Project will default to being named with the name of the folder that it is gener

1. Checkout and understand `src/config.js`. This was generated for you for your local development environment, but is is ignored from git tracking (within `.gitignore`). You can have different settings within this file based on environment or if multiple developers are running the same code.
1. Tryout the [Sub Generators](#sub-generators)
1. Tryout Firestore (you can generate a new project with `yes` as the answer to `Do you want to use Firestore`). Things work mostly the same, but it runs through [`redux-firestore`](https://github.com/prescottprue/redux-firestore)
1. Tryout Firestore (you can generate a new project with `yes` as the answer to `Do you want to use Firestore`). Things work mostly the same, but it runs through [`redux-firestore`](https://github.com/prescottprue/redux-firestore).

## Features
* Application Navbar (with Avatar)
Expand All @@ -44,7 +44,7 @@ Project will default to being named with the name of the folder that it is gener
## Uses
* [react](https://facebook.github.io/react/) - Rendering + Components
* [react-router](https://github.com/ReactTraining/react-router) - Routing (including async route loading)
* [material-ui](https://material-ui.com) - Google Material Styling React Components
* [material-ui](https://material-ui.com) - Google Material Styling React Components (with option for [Version 1](https://material-ui-next.com))
* [eslint](http://eslint.org/) - Linting (also implements [`prettier`](https://github.com/prettier/prettier-eslint))
* [webpack-dashboard](https://github.com/FormidableLabs/webpack-dashboard) - Improve CLI experience for Webpack

Expand Down Expand Up @@ -143,6 +143,9 @@ Sub generators are included to help speed up the application building process. Y

Example: To call the `component` sub-generator with "SomeThing" as the first parameter write: `yo react-firebase:component SomeThing`

##### Path Argument
Another argument can be passed to sub generators (unless otherwise noted) to provide the base path in which you would like to run the generator (starts from `src`). For example: `yo react-firebase:component Car routes/Project` runs the component generator within the Project route folder meaning that the component will be added to `routes/Project/components` instead of the top level `src/components` folder.

#### Function

Generates a Cloud Function allowing the user to specify trigger type (from HTTPS, Firestore, RTDB, Auth, or Storage)
Expand All @@ -166,6 +169,7 @@ A component is best for things that will be reused in multiple places. Our examp
```js
import * as functions from 'firebase-functions'
import * as admin from 'firebase-admin'
import { to } from 'utils/async'

/**
* @name uppercaser
Expand All @@ -184,12 +188,17 @@ async function uppercaserEvent(event) {
const eventData = event.data.val()
const params = event.params
const ref = admin.database().ref('responses')
await ref.push(eventData)
return data
const [writeErr, response] = await to(ref.push(eventData))
if (writeErr) {
console.error('Error writing response:', writeErr.message || writeErr)
throw writeErr
}
return response
}

```

Note: This sub-generator does not support the Path Argument (functions are already placed within a folder matching their name).

#### Component

Generates a React component along with a matching scss file and places it within `/components`
Expand Down Expand Up @@ -227,6 +236,45 @@ export const Project = ({ car }) => (
)
```

#### Form

Generates a Redux Form wrapped React component along with a matching scss file and places it within `/components`.

**command**

`yo react-firebase:form Car`

_or_

`yo react-firebase:form CarForm`

**result**

```
/app
--/components
----/CarForm
------index.js
------CarForm.enhancer.js
------CarForm.js
------CarForm.scss
```

*/app/components/CarForm.js:*

```jsx
import React from 'react'
import PropTypes from 'prop-types'
import classes from './Car.scss'

export const Project = ({ car }) => (
<div className={classes.container}>
<span>Project Component</span>
<pre>{JSON.stringify(car, null, 2)}</pre>
</div>
)
```

#### Enhancer

Generates an enhancer for a react component. Also includes an index file that wraps the component in the enhancer.
Expand Down Expand Up @@ -291,6 +339,8 @@ Generates a React component along with a matching component (which has an scss f
------reducer.js
```

Note: This sub-generator does not support the Path Argument (functions are already placed within a folder matching their name).

## Examples

Complete examples of generator output available in [Examples](https://github.com/prescottprue/generator-react-firebase/tree/master/examples)
Expand Down
1 change: 1 addition & 0 deletions examples/react-firebase-redux/functions/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-eslint": "^7.2.1",
"babel-plugin-module-resolver": "^3.1.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.0",
"chai": "^4.1.2",
Expand Down
4 changes: 1 addition & 3 deletions examples/react-firebase-redux/functions/src/utils/async.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,5 @@ import { size, pick } from 'lodash'
* }
*/
export function to(promise) {
return promise
.then(data => [null, data])
.catch(err => [err])
return promise.then(data => [null, data]).catch(err => [err])
}
70 changes: 70 additions & 0 deletions examples/react-firebase-redux/functions/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -604,6 +604,16 @@ babel-plugin-check-es2015-constants@^6.22.0:
dependencies:
babel-runtime "^6.22.0"

babel-plugin-module-resolver@^3.1.1:
version "3.1.1"
resolved "https://registry.yarnpkg.com/babel-plugin-module-resolver/-/babel-plugin-module-resolver-3.1.1.tgz#881cf67e3d4b8400d5eaaefc1be44d2dc1fe404f"
dependencies:
find-babel-config "^1.1.0"
glob "^7.1.2"
pkg-up "^2.0.0"
reselect "^3.0.1"
resolve "^1.4.0"

babel-plugin-syntax-async-functions@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
Expand Down Expand Up @@ -1655,6 +1665,19 @@ finalhandler@1.1.1:
statuses "~1.4.0"
unpipe "~1.0.0"

find-babel-config@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/find-babel-config/-/find-babel-config-1.1.0.tgz#acc01043a6749fec34429be6b64f542ebb5d6355"
dependencies:
json5 "^0.5.1"
path-exists "^3.0.0"

find-up@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
dependencies:
locate-path "^2.0.0"

firebase-admin@^5.10.0:
version "5.10.0"
resolved "https://registry.yarnpkg.com/firebase-admin/-/firebase-admin-5.10.0.tgz#76d8fce6bb1dbd2c05ec76cbfb59dc1ad3977e56"
Expand Down Expand Up @@ -2511,6 +2534,13 @@ lcid@^1.0.0:
dependencies:
invert-kv "^1.0.0"

locate-path@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
dependencies:
p-locate "^2.0.0"
path-exists "^3.0.0"

lodash.assign@^4.2.0:
version "4.2.0"
resolved "https://registry.yarnpkg.com/lodash.assign/-/lodash.assign-4.2.0.tgz#0d99f3ccd7a6d261d19bdaeb9245005d285808e7"
Expand Down Expand Up @@ -3021,6 +3051,22 @@ output-file-sync@^1.1.2:
mkdirp "^0.5.1"
object-assign "^4.1.0"

p-limit@^1.1.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.2.0.tgz#0e92b6bedcb59f022c13d0f1949dc82d15909f1c"
dependencies:
p-try "^1.0.0"

p-locate@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43"
dependencies:
p-limit "^1.1.0"

p-try@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/p-try/-/p-try-1.0.0.tgz#cbc79cdbaf8fd4228e13f621f2b1a237c1b207b3"

parse-glob@^3.0.4:
version "3.0.4"
resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"
Expand All @@ -3042,10 +3088,18 @@ path-dirname@^1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/path-dirname/-/path-dirname-1.0.2.tgz#cc33d24d525e099a5388c0336c6e32b9160609e0"

path-exists@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"

path-is-absolute@^1.0.0, path-is-absolute@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"

path-parse@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"

path-to-regexp@0.1.7:
version "0.1.7"
resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c"
Expand Down Expand Up @@ -3078,6 +3132,12 @@ pify@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176"

pkg-up@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f"
dependencies:
find-up "^2.1.0"

posix-character-classes@^0.1.0:
version "0.1.1"
resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
Expand Down Expand Up @@ -3429,10 +3489,20 @@ request@^2.79.0, request@^2.81.0, request@^2.83.0:
tunnel-agent "^0.6.0"
uuid "^3.1.0"

reselect@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/reselect/-/reselect-3.0.1.tgz#efdaa98ea7451324d092b2b2163a6a1d7a9a2147"

resolve-url@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"

resolve@^1.4.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.6.0.tgz#0fbd21278b27b4004481c395349e7aba60a9ff5c"
dependencies:
path-parse "^1.0.5"

ret@~0.1.10:
version "0.1.15"
resolved "https://registry.yarnpkg.com/ret/-/ret-0.1.15.tgz#b8a4825d5bdb1fc3f6f53c2bc33f81388681c7bc"
Expand Down
3 changes: 3 additions & 0 deletions generators/app/templates/functions/.babelrc
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,8 @@
],
"plugins": [
"transform-object-rest-spread",
["module-resolver", {
"root": ["./src"]
}]
]
}
1 change: 1 addition & 0 deletions generators/app/templates/functions/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-eslint": "^7.2.1",
"babel-plugin-module-resolver": "^3.1.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.0",
"chai": "^4.1.2",
Expand Down
6 changes: 1 addition & 5 deletions generators/app/templates/functions/src/utils/async.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
import { size, pick } from 'lodash'

/**
* Async await wrapper for easy error handling
* @param {Promise} promise - Promise to wrap responses of
Expand All @@ -18,7 +16,5 @@ import { size, pick } from 'lodash'
* }
*/
export function to(promise) {
return promise
.then(data => [null, data])
.catch(err => [err])
return promise.then(data => [null, data]).catch(err => [err])
}
8 changes: 7 additions & 1 deletion generators/component/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,11 @@ module.exports = class extends Generator {
type: String,
desc: 'The component name'
})
this.argument('basePath', {
type: String,
required: false,
desc: 'The base path of the components folder (starts at "src")'
})
}

prompting () {
Expand All @@ -47,7 +52,8 @@ module.exports = class extends Generator {
}

writing () {
const basePath = `src/components/${this.options.name}`
const basePathOption = this.options.basePath ? `${this.options.basePath}/` : ''
const basePath = `src/${basePathOption}components/${this.options.name}`
const filesArray = [
{ src: '_index.js', dest: `${basePath}/index.js` },
{ src: '_main.js', dest: `${basePath}/${this.options.name}.js` }
Expand Down
8 changes: 7 additions & 1 deletion generators/enhancer/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,11 @@ module.exports = class extends Generator {
type: String,
desc: 'The component name'
})
this.argument('basePath', {
type: String,
required: false,
desc: 'The base path of the components folder (starts at "src")'
})
}

prompting () {
Expand All @@ -34,7 +39,8 @@ module.exports = class extends Generator {
}

writing () {
const basePath = `src/components/${this.options.name}`
const basePathOption = this.options.basePath ? `${this.options.basePath}/` : ''
const basePath = `src/${basePathOption}components/${this.options.name}`
const filesArray = [
{ src: '_index.js', dest: `${basePath}/index.js` },
{ src: '_main.enhancer.js', dest: `${basePath}/${this.options.name}.enhancer.js` }
Expand Down
63 changes: 63 additions & 0 deletions generators/form/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
'use strict'
const Generator = require('yeoman-generator')
const chalk = require('chalk')
const camelCase = require('lodash/camelCase')
const capitalize = require('lodash/capitalize')

module.exports = class extends Generator {
constructor (args, opts) {
super(args, opts)

// Get first cli argument, and set it as this.options.name
this.argument('name', {
required: true,
type: String,
desc: 'The form name'
})
this.argument('basePath', {
type: String,
required: false,
desc: 'The base path of the components folder (starts at "src")'
})
}

prompting () {
this.log(
`${chalk.blue('Generating')} -> Redux-Form Form: ${chalk.green(this.options.name)}`
)

// return this.prompt(prompts).then((props) => {
// this.answers = props
// })
}

writing () {
const cleanedName = this.options.name.replace('Form', '').replace('form', '')
const name = `${capitalize(camelCase(cleanedName))}Form`
const basePathOption = this.options.basePath ? `${this.options.basePath}/` : ''
const basePath = `src/${basePathOption}components/${name}`
const filesArray = [
{ src: '_index.js', dest: `${basePath}/index.js` },
{ src: '_main.js', dest: `${basePath}/${name}.js` },
{
src: '_main.scss',
dest: `${basePath}/${name}.scss`
},
{
src: '_main.enhancer.js',
dest: `${basePath}/${name}.enhancer.js`
}
]

filesArray.forEach(file => {
this.fs.copyTpl(
this.templatePath(file.src),
this.destinationPath(file.dest),
Object.assign({}, {
name,
lowerName: name.toLowerCase()
})
)
})
}
}
Loading

0 comments on commit c3d6ded

Please sign in to comment.