Update prettier to 2.0.x (#1143)

* Update prettier devDependency to 2.0.x

* Format with prettier 2.0.5

* Update yarn.lock

cypress/integration/auth.js

@@ -8,13 +8,9 @@ describe('Auth', () => {
         cy.get('[data-attr=user-options-dropdown]').trigger('mouseover')
         cy.get('[data-attr=user-options-logout]').click()
 
-        cy.get('#inputEmail')
-            .type('fake@posthog.com')
-            .should('have.value', 'fake@posthog.com')
+        cy.get('#inputEmail').type('fake@posthog.com').should('have.value', 'fake@posthog.com')
 
-        cy.get('#inputPassword')
-            .type('password')
-            .should('have.value', 'password')
+        cy.get('#inputPassword').type('password').should('have.value', 'password')
 
         cy.get('.btn').click()
     })
@@ -23,13 +19,9 @@ describe('Auth', () => {
         cy.get('[data-attr=user-options-dropdown]').trigger('mouseover')
         cy.get('[data-attr=user-options-logout]').click()
 
-        cy.get('#inputEmail')
-            .type('fake@posthog.com')
-            .should('have.value', 'fake@posthog.com')
+        cy.get('#inputEmail').type('fake@posthog.com').should('have.value', 'fake@posthog.com')
 
-        cy.get('#inputPassword')
-            .type('wrong password')
-            .should('have.value', 'wrong password')
+        cy.get('#inputPassword').type('wrong password').should('have.value', 'wrong password')
 
         cy.get('.btn').click()
 
@@ -40,7 +32,7 @@ describe('Auth', () => {
         cy.get('[data-attr=menu-item-setup]').click()
         cy.get('[data-attr=copy-invite-to-clipboard-input]')
             .invoke('val')
-            .then(link => {
+            .then((link) => {
                 cy.get('[data-attr=user-options-dropdown]').trigger('mouseover')
                 cy.get('[data-attr=user-options-logout]').click()
                 cy.visit(link)
@@ -49,9 +41,7 @@ describe('Auth', () => {
 
                 cy.get('#inputEmail').type(Cypress._.random(0, 1e6) + '@posthog.com')
 
-                cy.get('#inputPassword')
-                    .type('password')
-                    .should('have.value', 'password')
+                cy.get('#inputPassword').type('password').should('have.value', 'password')
 
                 cy.get('.btn').click()
 
@@ -63,7 +53,7 @@ describe('Auth', () => {
         cy.get('[data-attr=menu-item-setup]').click()
         cy.get('[data-attr=copy-invite-to-clipboard-input]')
             .invoke('val')
-            .then(link => {
+            .then((link) => {
                 cy.get('[data-attr=user-options-dropdown]').trigger('mouseover')
                 cy.get('[data-attr=user-options-logout]').click()
                 cy.visit(link)
@@ -72,9 +62,7 @@ describe('Auth', () => {
 
                 cy.get('#inputEmail').type(Cypress._.random(0, 1e6) + '@posthog.com')
 
-                cy.get('#inputPassword')
-                    .type('password')
-                    .should('have.value', 'password')
+                cy.get('#inputPassword').type('password').should('have.value', 'password')
 
                 cy.get('[data-attr=updates-checkbox').check()
 

cypress/integration/feature_flags.js

@@ -6,18 +6,14 @@ describe('Feature Flags', () => {
     it('Create feature flag', () => {
         cy.get('h1').should('contain', 'Feature Flags')
         cy.get('[data-attr=new-feature-flag]').click()
-        cy.get('[data-attr=feature-flag-name')
-            .type('beta feature')
-            .should('have.value', 'beta feature')
+        cy.get('[data-attr=feature-flag-name').type('beta feature').should('have.value', 'beta feature')
         cy.get('[data-attr=feature-flag-key').should('have.value', 'beta-feature')
         cy.get('[data-attr=feature-flag-switch').click()
         cy.get('[data-attr=feature-flag-submit').click()
         cy.get('[data-attr=feature-flag-table').should('contain', 'beta feature')
 
         cy.get('[data-attr=feature-flag-table] tr:first-child td:first-child').click()
-        cy.get('[data-attr=feature-flag-name')
-            .type(' updated')
-            .should('have.value', 'beta feature updated')
+        cy.get('[data-attr=feature-flag-name').type(' updated').should('have.value', 'beta feature updated')
         cy.get('[data-attr=feature-flag-submit').click()
         cy.get('[data-attr=feature-flag-table').should('contain', 'beta feature updated')
     })

cypress/integration/setup.js

@@ -5,15 +5,15 @@ describe('Setup', () => {
     })
 
     it('See suggestion and save', () => {
-        cy.getCookie('csrftoken')
-        .then((csrftoken) => {
+        cy.getCookie('csrftoken').then((csrftoken) => {
             cy.request({
                 url: '/api/user/',
-                body: {team: {app_urls: []}},
+                body: { team: { app_urls: [] } },
                 method: 'PATCH',
                 headers: {
-                'X-CSRFToken': csrftoken.value,
-            }})
+                    'X-CSRFToken': csrftoken.value,
+                },
+            })
         })
         cy.reload(true)
         cy.get('[data-attr=menu-item-setup]').click()

cypress/plugins/index.js

@@ -16,6 +16,6 @@
  * @type {Cypress.PluginConfig}
  */
 module.exports = (on, config) => {
-  // `on` is used to hook into various events Cypress emits
-  // `config` is the resolved Cypress config
+    // `on` is used to hook into various events Cypress emits
+    // `config` is the resolved Cypress config
 }

cypress/support/index.js

@@ -3,41 +3,29 @@ import './commands'
 beforeEach(() => {
     cy.visit('/')
 
-    cy.url().then(url => {
+    cy.url().then((url) => {
         if (url.includes('setup_admin')) {
-            cy.get('#inputCompany')
-                .type('company')
-                .should('have.value', 'company')
+            cy.get('#inputCompany').type('company').should('have.value', 'company')
 
-            cy.get('#inputName')
-                .type('name')
-                .should('have.value', 'name')
+            cy.get('#inputName').type('name').should('have.value', 'name')
 
-            cy.get('#inputEmail')
-                .type('fake@posthog.com')
-                .should('have.value', 'fake@posthog.com')
+            cy.get('#inputEmail').type('fake@posthog.com').should('have.value', 'fake@posthog.com')
 
-            cy.get('#inputPassword')
-                .type('password')
-                .should('have.value', 'password')
+            cy.get('#inputPassword').type('password').should('have.value', 'password')
 
             cy.get('.btn').click()
 
             cy.visit('/demo')
             cy.visit('/')
         } else if (url.includes('login')) {
-            cy.get('#inputEmail')
-                .type('fake@posthog.com')
-                .should('have.value', 'fake@posthog.com')
+            cy.get('#inputEmail').type('fake@posthog.com').should('have.value', 'fake@posthog.com')
 
-            cy.get('#inputPassword')
-                .type('password')
-                .should('have.value', 'password')
+            cy.get('#inputPassword').type('password').should('have.value', 'password')
 
             cy.get('.btn').click()
         }
         cy.wait(2000)
-        cy.get('body').then($body => {
+        cy.get('body').then(($body) => {
             if ($body.find('[data-attr=select-platform-Web]').length) {
                 cy.get('[data-attr=select-platform-Web]').click()
                 cy.get('[data-attr=wizard-step-counter]').should('contain', 'Step 2')

frontend/src/editor/index.js

@@ -86,17 +86,17 @@ class _App extends Component {
             this.state.actions = [{ id: props.actionId }]
             this.state.openActionId = props.actionId
         } else {
-            if (this.state.actions.filter(action => action.id === false).length == 0)
+            if (this.state.actions.filter((action) => action.id === false).length == 0)
                 this.state.actions.push({ id: false })
         }
     }
     onActionSave = (action, isNew, createNew) => {
         let { actions, openActionId } = this.state
         if (isNew) {
-            actions = actions.map(a => (!a.id ? action : a))
+            actions = actions.map((a) => (!a.id ? action : a))
             openActionId = action.id
         } else {
-            actions = actions.map(a => (a.id == action.id ? action : a))
+            actions = actions.map((a) => (a.id == action.id ? action : a))
         }
         if (createNew) {
             actions.push({ id: false })
@@ -129,7 +129,7 @@ class _App extends Component {
                                         {!action.id && 'New Action'}
                                         {action.id && (
                                             <a
-                                                onClick={e => {
+                                                onClick={(e) => {
                                                     e.preventDefault()
                                                     this.setState({
                                                         openActionId: false,
@@ -156,7 +156,7 @@ class _App extends Component {
                                 <div className="action">
                                     {action.id ? action.name : 'New Action'}
                                     <a
-                                        onClick={e => {
+                                        onClick={(e) => {
                                             e.preventDefault()
                                             this.setState({
                                                 openActionId: action.id,
@@ -189,7 +189,7 @@ class _App extends Component {
 
 const App = hot(_App)
 
-window.ph_load_editor = function(editorParams) {
+window.ph_load_editor = function (editorParams) {
     let container = document.createElement('div')
     document.body.appendChild(container)
 

frontend/src/layout/LatestVersion.js

@@ -14,7 +14,7 @@ export function LatestVersion() {
     const isApp = window.location.href.indexOf('app.posthog.com') > -1
 
     useEffect(() => {
-        api.get('https://update.posthog.com/versions').then(versions => {
+        api.get('https://update.posthog.com/versions').then((versions) => {
             setLatestVersion(versions[0]['version'])
         })
     }, [user.posthog_version])

frontend/src/layout/Sidebar.js

@@ -79,7 +79,7 @@ export function Sidebar({ user, sidebarCollapsed, setSidebarCollapsed }) {
 
     if (activeScene === 'dashboards') {
         const dashboardId = parseInt(location.pathname.split('/dashboard/')[1])
-        const dashboard = dashboardId && dashboards.find(d => d.id === dashboardId)
+        const dashboard = dashboardId && dashboards.find((d) => d.id === dashboardId)
         if (dashboard && dashboard.pinned) {
             activeScene = `dashboard-${dashboardId}`
         }
@@ -96,7 +96,7 @@ export function Sidebar({ user, sidebarCollapsed, setSidebarCollapsed }) {
                 collapsedWidth="0"
                 className="bg-dark"
                 collapsed={sidebarCollapsed}
-                onCollapse={sidebarCollapsed => {
+                onCollapse={(sidebarCollapsed) => {
                     setSidebarCollapsed(sidebarCollapsed)
                     triggerResizeAfterADelay()
                 }}

frontend/src/lib/api.js

@@ -19,9 +19,9 @@ class Api {
         if (url.indexOf('http') !== 0) {
             url = '/' + url + (url.indexOf('?') == -1 && url[url.length - 1] != '/' ? '/' : '')
         }
-        return fetch(url).then(response => {
+        return fetch(url).then((response) => {
             if (!response.ok) {
-                return response.json().then(data => {
+                return response.json().then((data) => {
                     throw { status: response.status, ...data }
                 })
             }
@@ -39,9 +39,9 @@ class Api {
                 'X-CSRFToken': getCookie('csrftoken'),
             },
             body: JSON.stringify(data),
-        }).then(response => {
+        }).then((response) => {
             if (!response.ok) {
-                return response.json().then(data => {
+                return response.json().then((data) => {
                     if (Array.isArray(data)) {
                         throw data
                     }
@@ -62,9 +62,9 @@ class Api {
                 'X-CSRFToken': getCookie('csrftoken'),
             },
             body: JSON.stringify(data),
-        }).then(response => {
+        }).then((response) => {
             if (!response.ok) {
-                return response.json().then(data => {
+                return response.json().then((data) => {
                     if (Array.isArray(data)) {
                         throw data
                     }
@@ -84,9 +84,9 @@ class Api {
                 'Content-Type': 'application/x-www-form-urlencoded',
                 'X-CSRFToken': getCookie('csrftoken'),
             },
-        }).then(response => {
+        }).then((response) => {
             if (!response.ok) {
-                return response.json().then(data => {
+                return response.json().then((data) => {
                     throw { status: response.status, ...data }
                 })
             }

frontend/src/lib/colors.js

@@ -12,7 +12,7 @@ const lightColors = [
     'cyan',
     'gray-dark',
 ]
-const getColorVar = variable => getComputedStyle(document.body).getPropertyValue('--' + variable)
+const getColorVar = (variable) => getComputedStyle(document.body).getPropertyValue('--' + variable)
 
 export const darkWhites = [
     'rgba(255,255,255,0.6)',
@@ -71,7 +71,7 @@ Object.entries(dashboardColorHSL).forEach(([key, [h, s, l]]) => {
     dashboardColors[key] = cssHSL(h, s, l)
 })
 
-export const getChartColors = backgroundColor => {
+export const getChartColors = (backgroundColor) => {
     if (backgroundColor === 'black') {
         const colors = []
         for (let i = 0; i < 20; i++) {
@@ -84,7 +84,7 @@ export const getChartColors = backgroundColor => {
     }
 
     if (backgroundColor === 'white' || !backgroundColor) {
-        return lightColors.map(color => getColorVar(color))
+        return lightColors.map((color) => getColorVar(color))
     }
 
     return dashboardColorHSL[backgroundColor] ? colorsForBackground(...dashboardColorHSL[backgroundColor]) : darkWhites

frontend/src/lib/components/ActionSelectBox.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
 import { ActionSelectTab } from './ActionSelectTab'
 import { Select } from 'antd'
 
-const determineActiveTab = props => {
+const determineActiveTab = (props) => {
     if (props.selected) {
         return props.selected
     } else {
@@ -15,7 +15,7 @@ const determineActiveTab = props => {
 function ActionSelectTabs(props) {
     let [activeTab, setActiveTab] = useState(determineActiveTab(props))
     let [labels] = useState(
-        Array.isArray(props.children) ? props.children.map(child => child.props.title) : [props.children.props.title]
+        Array.isArray(props.children) ? props.children.map((child) => child.props.title) : [props.children.props.title]
     )
     return (
         <div className="select-box" style={{ padding: 0 }}>
@@ -27,7 +27,7 @@ function ActionSelectTabs(props) {
                 ></ActionSelectTab>
             )}
             {Array.isArray(props.children)
-                ? props.children.map(child => {
+                ? props.children.map((child) => {
                       if (child.props.title !== activeTab) return undefined
                       return child
                   })
@@ -57,7 +57,7 @@ function ActionSelectPanel({ title, redirect, onHover, onSelect, active, options
                 getPopupContainer={() => document.getElementById('action-select-popup')}
                 showSearch
                 defaultOpen
-                onChange={option => {
+                onChange={(option) => {
                     onSelect(option.value, option.label.props.children)
                 }}
                 style={{ width: '100%' }}
@@ -67,14 +67,14 @@ function ActionSelectPanel({ title, redirect, onHover, onSelect, active, options
                 value={{ value: determineValue(active) }}
                 listHeight={300}
             >
-                {options.map(typeGroup => {
+                {options.map((typeGroup) => {
                     if (typeGroup['options'].length > 0) {
                         return (
                             <Select.OptGroup key={typeGroup['label']} label={typeGroup['label']}>
-                                {typeGroup['options'].map(item => (
+                                {typeGroup['options'].map((item) => (
                                     <Select.Option key={item.value} value={item.value}>
                                         <div
-                                            onMouseOver={e => {
+                                            onMouseOver={(e) => {
                                                 setInfoOpen(true)
                                                 setInfoBoundingRect(e.target.getBoundingClientRect())
                                                 setInfoActionId(item.value)

frontend/src/lib/components/AppEditorLink/AppEditorLink.js

@@ -17,7 +17,7 @@ export function AppEditorLink({ actionId, style, className, children }) {
                 href={appEditorUrl(actionId, appUrls && appUrls[0])}
                 style={style}
                 className={className}
-                onClick={e => {
+                onClick={(e) => {
                     e.preventDefault()
                     setModalOpen(true)
                 }}