Merge pull request #1244 from artsy/staging

Deploy

.babelrc

@@ -1 +1,25 @@
-{}
+{
+  "presets": [
+    "es2015",
+    "react",
+    "stage-3"
+  ],
+  "plugins": [
+    "babel-plugin-rewire",
+    "inline-react-svg",
+    "transform-runtime",
+    ["module-resolver", {
+      "root": ["./"]
+    }],
+    "transform-class-properties"
+  ],
+  "env": {
+    "development": {
+      "plugins": [
+        ["styled-components", {
+          "ssr": true
+        }]
+      ]
+    }
+  }
+}

.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+npm-debug.log

.env.example

@@ -6,7 +6,12 @@ API_URL=http://localhost:3005/api
 FORCE_URL=https://staging.artsy.net
 ARTSY_URL=https://stagingapi.artsy.net
 SESSION_SECRET=p0s1tr0n
-MONGOHQ_URL=mongodb://localhost:27017/positron
+ELASTICSEARCH_PORT=9200
+
+# Local development only for the below; refers to the key in docker-compose.yml
+ELASTICSEARCH_URL=http://elasticsearch:9200
+MONGOHQ_URL=mongodb://mongodb:27017/positron
+
 TECH_SUPPORT=craig@artsymail.com
 DEBUG=api,client,app
 SALT=$2a$10$PJrPMBadu1NPdmnshBgFbe
@@ -34,4 +39,4 @@ INSTANT_ARTICLE_ACCESS_TOKEN=REPLACE
 FB_PAGE_ID=REPLACE
 DEFAULT_PARTNER_ID=REPLACE
 SENTRY_PUBLIC_DSN=REPLACE
-SENTRY_PRIVATE_DSN=REPLACE
+SENTRY_PRIVATE_DSN=REPLACE

.env.test

@@ -7,6 +7,7 @@ ARTSY_URL=http://localhost:5000/__gravity
 SESSION_SECRET=p0s1tr0n
 MONGOHQ_URL=mongodb://localhost:27017/positron-test
 ELASTICSEARCH_URL=http://localhost:9200
+ELASTICSEARCH_PORT=9200
 SALT=$2a$10$PJrPMBadu1NPdmnshBgFbe
 API_MAX=100
 API_PAGE_SIZE=10

.eslintrc

@@ -0,0 +1,21 @@
+{
+  "parser": "babel-eslint",
+  "extends": [
+    "standard",
+    "standard-react"
+  ],
+  "globals": {
+    __dirname: true
+  },
+  "env": {
+    "browser": true,
+    "mocha": true,
+    "node": true
+  },
+  "rules": {
+    "camelcase": 0,
+    "no-mixed-operators": 0,
+    "no-new": 0,
+    "react/jsx-indent": 0
+  }
+}

.gitignore

@@ -17,3 +17,4 @@ dump.rdb
 .env.ignore
 node_modules
 .vscode
+data

Dockerfile

@@ -0,0 +1,6 @@
+FROM node:7
+RUN mkdir -p /usr/src/app
+WORKDIR /usr/src/app
+COPY package.json .
+RUN yarn install
+COPY . .

Makefile

@@ -10,21 +10,16 @@ BIN = node_modules/.bin
 
 # Start the server
 s:
-	$(BIN)/coffee index.coffee
+	DEBUG=app,client,api node ./index.js
 
 # Start the server using forever
 sf:
-	$(BIN)/forever $(BIN)/coffee --nodejs --max-old-space-size=512 index.coffee
+	$(BIN)/forever ./index.js --max-old-space-size=512
 
 # Run all of the project-level tests, followed by app-level tests
 test: assets
-	$(BIN)/mocha $(shell find api/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find api/apps/*/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find client/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find client/apps/*/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find client/apps/*/**/*/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find client/apps/*/**/*/**/test -name '*.coffee' -not -path 'test/helpers/*')
-	$(BIN)/mocha $(shell find client/apps/*/**/*/**/*/test -name '*.coffee' -not -path 'test/helpers/*')
+	$(BIN)/mocha $(shell find api -name '*.test.coffee')
+	$(BIN)/mocha $(shell find client -name '*.test.coffee')
 
 # Run app in test mode
 test-s:

README.md

@@ -20,6 +20,23 @@ Meta
 Set-Up
 ---
 
+- Copy `.env.example` to `.env` in the root of the project and edit all `REPLACE` values with sensitive configuration obtained from `positron-staging`. This should help.
+
+```
+heroku config --app=positron-staging | grep -E `cat .env.example | grep REPLACE | cut -f1 -d= | xargs | tr ' ' \|` | sed -e 's/:\ /=/g' | sed -e 's/ //g'
+```
+
+### Via Docker Compose
+- Install [Docker for Mac](https://docs.docker.com/docker-for-mac/install/)
+- `git clone git@github.com:<your username>/positron.git && cd positron`
+- `docker-compose up`
+
+This starts a new self-contained Docker instance that boots MongoDB, ElasticSearch and Node. Changes made to source-code located in `api` and `client` is [automatically reloaded](https://github.com/artsy/positron/blob/master/boot.js#L34) on browser-refresh; no need to restart the process.
+
+To shut down the process, press `ctrl+c` or execute `docker-compose down`.
+
+### Manually
+
 - Install [NVM](https://github.com/creationix/nvm)
 - Install Node 6
 
@@ -41,12 +58,6 @@ git clone git@github.com:craigspaeth/positron.git && cd positron
 yarn install
 ```
 
-- Copy `.env.example` to `.env` in the root of the project and edit all `REPLACE` values with sensitive configuration obtained from `positron-staging`. This should help.
-
-```
-heroku config --app=positron-staging | grep -E `cat .env.example | grep REPLACE | cut -f1 -d= | xargs | tr ' ' \|` | sed -e 's/:\ /=/g' | sed -e 's/ //g'
-```
-
 - Positron uses MongoDB as a database. To install MongoDB using homebrew do the following, if you would prefer to install manually check the documentation at [MongoDB](http://docs.mongodb.org/manual/tutorial/install-mongodb-on-os-x/)
 
 ```

api/apps/articles/model/schema.coffee

@@ -111,6 +111,7 @@ denormalizedArtwork = (->
     @object().meta(name: 'Text').keys
       type: @string().valid('text')
       body: @string().allow('', null)
+      layout: @string().allow('blockquote', null)
     @object().meta(name: 'Artworks').keys
       type: @string().valid('artworks')
       ids: @array().items(@string().objectid())

api/apps/articles/test/model/save.coffee → api/apps/articles/test/model/save.test.coffee

@@ -158,6 +158,22 @@ describe 'Save', ->
         ]
       })
 
+    it 'can save layouts on text sections', (done) ->
+      Save.sanitizeAndSave( ->
+        Article.find '5086df098523e60002000011', (err, article) =>
+          article.sections[0].layout.should.eql 'blockquote'
+          done()
+      )(null, {
+        _id: ObjectId '5086df098523e60002000011'
+        sections: [
+          {
+            type: 'text'
+            body: '<blockquote>Viva Art</blockquote>'
+            layout: 'blockquote'
+          }
+        ]
+      })
+
     it 'indexes articles that are indexable', (done) ->
       Save.sanitizeAndSave( =>
         Article.find '5086df098523e60002000011', (err, article) =>

api/index.coffee

@@ -47,4 +47,4 @@ app.use notFound
 app.use errorHandler
 
 # Start the test server if run directly
-app.listen(5000, -> debug "Listening on 5000") if module is require.main
+app.listen(5000, -> debug "Listening on 5000") if module is require.main

boot.js

@@ -0,0 +1,70 @@
+/**
+ * Main server that combines API & client
+ */
+
+import artsyXapp from 'artsy-xapp'
+import express from 'express'
+import newrelic from 'artsy-newrelic'
+import path from 'path'
+import { IpFilter } from 'express-ipfilter'
+import { createReloadable, isDevelopment } from '@artsy/express-reloadable'
+
+const debug = require('debug')('app')
+const app = module.exports = express()
+
+// Blacklist ips
+app.use(
+  IpFilter([process.env.IP_BLACKLIST.split(',')], { log: false, mode: 'deny' })
+)
+
+// Get an xapp token
+const xappConfig = {
+  url: process.env.ARTSY_URL,
+  id: process.env.ARTSY_ID,
+  secret: process.env.ARTSY_SECRET
+}
+
+artsyXapp.init(xappConfig, () => {
+  app.use(newrelic)
+
+  if (isDevelopment) {
+    const reloadAndMount = createReloadable(app, require)
+
+    // Enable server-side code hot-swapping on change
+    app.use('/api', reloadAndMount(path.resolve(__dirname, 'api'), {
+      mountPoint: '/api'
+    }))
+
+    invalidateUserMiddleware(app)
+    reloadAndMount(path.resolve(__dirname, 'client'))
+
+    // Staging, Prod
+  } else {
+    app.use('/api', require('./api'))
+    invalidateUserMiddleware(app)
+    app.use(require('./client'))
+  }
+
+  // Start the server and send a message to IPC for the integration test
+  // helper to hook into.
+  app.listen(process.env.PORT, () => {
+    debug(`Listening on port ${process.env.PORT}`)
+
+    if (typeof process.send === 'function') {
+      process.send('listening')
+    }
+  })
+})
+
+// Crash if we can't get/refresh an xapp token
+artsyXapp.on('error', (error) => {
+  console.warn(error)
+  process.exit(1)
+})
+
+const invalidateUserMiddleware = (app) => {
+  app.use((req, rest, next) => {
+    req.user = null
+    next()
+  })
+}

client/apps/articles_list/routes.coffee

@@ -34,4 +34,4 @@ renderArticles = (res, req, result, published) ->
   res.locals.sd.HAS_PUBLISHED = published
   res.render 'index',
     articles: result.articles || []
-    current_channel: req.user?.get('current_channel')
+    current_channel: req.user?.get('current_channel')

client/apps/edit/components/content/sections/image_collection/index.coffee

@@ -12,7 +12,7 @@ DragContainer = React.createFactory require '../../../../../../components/drag_d
 { div, section, ul, li } = React.DOM
 
 components = require('@artsy/reaction-force/dist/components/publishing/index').default
-ImageSetPreview = React.createFactory components.ImagesetPreviewClassic
+ImageSetPreview = React.createFactory components.ImageSetPreviewClassic
 
 module.exports = React.createClass
   displayName: 'SectionImageCollection'

client/apps/edit/components/content2/section_container/index.coffee

@@ -6,14 +6,13 @@
 
 React = require 'react'
 _ = require 'underscore'
-SectionText = React.createFactory require '../sections/text/index.coffee'
-SectionVideo = React.createFactory require '../../content/sections/video/index.coffee'
-SectionSlideshow = React.createFactory require '../../content/sections/slideshow/index.coffee'
-SectionEmbed = React.createFactory require '../../content/sections/embed/index.coffee'
-SectionFullscreen = React.createFactory require '../../content/sections/fullscreen/index.coffee'
-SectionCallout = React.createFactory require '../../content/sections/callout/index.coffee'
-SectionImageCollection = React.createFactory require '../sections/image_collection/index.coffee'
-SectionImage = React.createFactory require '../../content/sections/image/index.coffee'
+Text = React.createFactory require '../sections/text/index.coffee'
+Video = React.createFactory require '../../content/sections/video/index.coffee'
+Slideshow = React.createFactory require '../../content/sections/slideshow/index.coffee'
+Embed = React.createFactory require '../../content/sections/embed/index.coffee'
+Fullscreen = React.createFactory require '../../content/sections/fullscreen/index.coffee'
+ImageCollection = React.createFactory require '../sections/image_collection/index.coffee'
+Image = React.createFactory require '../../content/sections/image/index.coffee'
 { div, nav, button } = React.DOM
 icons = -> require('../../icons.jade') arguments...
 
@@ -46,7 +45,7 @@ module.exports = React.createClass
       className: 'edit-section__container'
       'data-editing': @props.editing
       'data-type': @props.section.get('type')
-      'data-layout': @props.section.getLayout(@props.article.get('layout'))
+      'data-layout': @props.section.get('layout') or 'column_width'
     },
       unless @props.section.get('type') is 'fullscreen'
         div {
@@ -64,15 +63,14 @@ module.exports = React.createClass
             dangerouslySetInnerHTML: __html: $(icons()).filter('.remove').html()
           }
       (switch @props.section.get('type')
-        when 'text' then SectionText
-        when 'video' then SectionVideo
-        when 'slideshow' then SectionSlideshow
-        when 'embed' then SectionEmbed
-        when 'fullscreen' then SectionFullscreen
-        when 'callout' then SectionCallout
-        when 'image_set' then SectionImageCollection
-        when 'image_collection' then SectionImageCollection
-        when 'image' then SectionImage
+        when 'text' then Text
+        when 'video' then Video
+        when 'slideshow' then Slideshow
+        when 'embed' then Embed
+        when 'fullscreen' then Fullscreen
+        when 'image_set' then ImageCollection
+        when 'image_collection' then ImageCollection
+        when 'image' then Image
       )(
         section: @props.section
         sections: @props.sections

client/apps/edit/components/content2/section_container/index.styl

@@ -71,7 +71,7 @@
       border-radius 50%
 
 .classic
-  [data-layout='column_width']
+  [data-layout='column_width'], [data-layout='blockquote']
     max-width classic-body-w-margin
     margin 0 auto
   [data-layout='overflow_fillwidth']
@@ -82,7 +82,7 @@
   [data-layout='column_width']
     max-width standard-body-w-margin
     margin 0 auto
-  [data-layout='overflow_fillwidth']
+  [data-layout='overflow_fillwidth'], [data-layout='blockquote']
     max-width standard-overflow-w-margin
 
 .feature

client/apps/edit/components/content2/section_container/test/index.coffee

@@ -38,7 +38,7 @@ describe 'SectionContainer', ->
         dragOver: 4
         article: new Article
       }
-      @SectionContainer.__set__ 'SectionText', ->
+      @SectionContainer.__set__ 'Text', ->
       @component = ReactDOM.render React.createElement(@SectionContainer, @props
       ), $("<div></div>")[0], => setTimeout =>
         @component.setState = sinon.stub()