diff --git a/.gitignore b/.gitignore
index bd0c24e..3d53628 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,6 +10,9 @@
/build
/functions-build
+# netlify
+.netlify
+
# misc
.DS_Store
.env.local
diff --git a/README.md b/README.md
index e924db6..6b00b51 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
Example of using FaunaDB with [netlify functions](https://www.netlify.com/docs/functions/)
-Try it out on your own account via this link:
+Deploy this app with one-click via this link:
[](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-faunadb-example)
diff --git a/public/index.html b/public/index.html
index 92028d8..4669fe4 100644
--- a/public/index.html
+++ b/public/index.html
@@ -28,6 +28,7 @@
+
diff --git a/scripts/bootstrap-fauna-database.js b/scripts/bootstrap-fauna-database.js
index b8a71d0..6652516 100644
--- a/scripts/bootstrap-fauna-database.js
+++ b/scripts/bootstrap-fauna-database.js
@@ -1,26 +1,47 @@
/* bootstrap database in your FaunaDB account */
-const readline = require('readline');
-const faunadb = require('faunadb');
-const q = faunadb.query;
+const readline = require('readline')
+const faunadb = require('faunadb')
+const chalk = require('chalk')
+const insideNetlify = insideNetlifyBuildContext()
+const q = faunadb.query
-ask('Enter your faunaDB server key', function(err, answer) {
- const key = answer || process.env.FAUNADB_SECRET
- if (!key) {
- console.log('Please set supply a faunaDB server key')
- process.exit()
+console.log(chalk.cyan('Creating your FaunaDB Database...\n'))
+
+// 1. Check for required enviroment variables
+if (!process.env.FAUNADB_SECRET) {
+ console.log(chalk.yellow('Required FAUNADB_SECRET enviroment variable not found.'))
+ if (insideNetlify) {
+ console.log(`Visit https://app.netlify.com/sites/YOUR_SITE_HERE/settings/deploys`)
+ console.log('and set a `FAUNADB_SECRET` value in the "Build environment variables" section')
+ process.exit(1)
}
+ // Local machine warning
+ if (!insideNetlify) {
+ console.log()
+ console.log('You can create fauna DB keys here: https://dashboard.fauna.com/db/keys')
+ console.log()
+ ask(chalk.bold('Enter your faunaDB server key'), (err, answer) => {
+ if (!answer) {
+ console.log('Please supply a faunaDB server key')
+ process.exit(1)
+ }
+ createFaunaDB(process.env.FAUNADB_SECRET).then(() => {
+ console.log('Database created')
+ })
+ });
+ }
+}
- const client = new faunadb.Client({
- secret: answer
- });
-
- createFaunaDB(key).then(() => {
+// Has var. Do the thing
+if (process.env.FAUNADB_SECRET) {
+ createFaunaDB(process.env.FAUNADB_SECRET).then(() => {
console.log('Database created')
})
-});
-
+}
+/* idempotent operation */
function createFaunaDB(key) {
+ console.log('Create the database!')
const client = new faunadb.Client({
secret: key
});
@@ -33,9 +54,20 @@ function createFaunaDB(key) {
name: "all_todos",
source: q.Ref("classes/todos")
}))
+ }).catch((e) => {
+ // Database already exists
+ if (e.requestResult.statusCode === 400 && e.message === 'instance not unique') {
+ console.log('DB already exists')
+ throw e
+ }
})
- .then(console.log.bind(console))
- .catch(console.error.bind(console))
+}
+
+function insideNetlifyBuildContext() {
+ if (process.env.DEPLOY_PRIME_URL) {
+ return true
+ }
+ return false
}
// Readline util
diff --git a/scripts/check-for-fauna-key.js b/scripts/check-for-fauna-key.js
index 0c4c00a..53191cd 100644
--- a/scripts/check-for-fauna-key.js
+++ b/scripts/check-for-fauna-key.js
@@ -1,14 +1,33 @@
const chalk = require('chalk')
-if (!process.env.FAUNADB_SECRET) {
- console.log('Please set supply a faunaDB server key')
- console.log(`
+var util = require('util');
+var exec = require('child_process').exec;
+
+function clear(){
+ exec('clear', function(error, stdout, stderr){
+ util.puts(stdout);
+ });
+}
+function checkForFaunaKey() {
+ if (!process.env.FAUNADB_SECRET) {
+ console.log(chalk.yellow('Required FAUNADB_SECRET enviroment variable not found.'))
+ console.log(`
=========================
In your terminal run the following command
-export FAUNADB_SECRET=abcYourKeyHere
+export FAUNADB_SECRET=YourFaunaDBKeyHere
=========================
`)
- process.exit(1)
+
+ process.exit(1)
+ process.stdout.write('\u001b[2J')
+ process.stdout.write('\u001b[1;1H')
+ }
}
+
+process.on('exit', (err) => {
+ console.log('errr')
+});
+
+checkForFaunaKey()
diff --git a/src/App.css b/src/App.css
index d97e24c..3104bea 100644
--- a/src/App.css
+++ b/src/App.css
@@ -3,9 +3,20 @@
padding-top: 10px;
width: 600px;
}
-
+.todo-settings-toggle {
+ fill: #b7b9bd;
+ width: 25px;
+ margin-left: 10px;
+ cursor: pointer;
+}
.todo-create-wrapper {
margin-bottom: 20px;
+ display: flex;
+ align-items: center;
+}
+.todo-actions {
+ display: flex;
+ align-items: center;
}
.todo-create-input {
font-size: 14px;
@@ -62,12 +73,17 @@
max-width: 80%;
margin-left: 40px;
}
+ .todo-create-wrapper {
+ flex-direction: column;
+ align-items: flex-start;
+ }
.todo-create-input {
appearance: none;
- margin-bottom: 15px;
border: 1px solid rgba(120, 130, 152, 0.25);
/* Disable Auto Zoom in Input “Text” tag - Safari on iPhone */
font-size: 16px;
+ margin-bottom: 15px;
+ min-width: 85%;
}
.todo-item button {
padding: 4px 12px;
diff --git a/src/App.js b/src/App.js
index 55a3bef..26b67da 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,21 +1,22 @@
import React, { Component } from 'react'
import ContentEditable from './components/ContentEditable'
import AppHeader from './components/AppHeader'
+import SettingsMenu from './components/SettingsMenu'
import api from './utils/api'
import sortByDate from './utils/sortByDate'
import './App.css'
export default class App extends Component {
state = {
- todos: []
+ todos: [],
+ showMenu: false
}
componentDidMount() {
// Fetch all todos
- api.readAll().then((response) => {
- console.log('all todos', response)
-
+ api.readAll().then((todos) => {
+ console.log('all todos', todos)
this.setState({
- todos: response
+ todos: todos
})
})
}
@@ -156,6 +157,17 @@ export default class App extends Component {
})
}
}
+ closeModal = (e) => {
+ this.setState({
+ showMenu: false
+ })
+ }
+ openModal = () => {
+ console.log('settings')
+ this.setState({
+ showMenu: true
+ })
+ }
renderTodos() {
const { todos } = this.state
@@ -228,12 +240,21 @@ export default class App extends Component {
autoComplete='off'
style={{marginRight: 20}}
/>
-