Merge pull request #91 from vtex-apps/chore/pr-actions

Chore/pr actions

Author: victorhmp

.eslintrc.json

@@ -0,0 +1,67 @@
+name: PR actions
+'on':
+  pull_request:
+    branches:
+      - master
+jobs:
+  danger-ci:
+    name: Danger CI
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@master
+      - uses: actions/setup-node@master
+        with:
+          node-version: 12.x
+        env:
+          RUNNER_TEMP: /tmp
+      - name: Danger CI
+        uses: vtex/danger@master
+        env:
+          GITHUB_TOKEN: '${{ secrets.GITHUB_TOKEN }}'
+          REQUIRE_CHANGELOG_VERSION: false
+  io-app-test:
+    name: IO app test
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@master
+      - uses: actions/setup-node@master
+        with:
+          node-version: 12.x
+        env:
+          RUNNER_TEMP: /tmp
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: 'echo "::set-output name=dir::$(yarn cache dir)"'
+      - uses: actions/cache@v1
+        id: yarn-cache
+        with:
+          path: '${{ steps.yarn-cache-dir-path.outputs.dir }}'
+          key: "${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}"
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+      - name: Run test on every builder directory
+        uses: vtex/action-io-app-test@master
+  lint:
+    name: Lint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@master
+      - uses: actions/setup-node@master
+        with:
+          node-version: 12.x
+        env:
+          RUNNER_TEMP: /tmp
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: 'echo "::set-output name=dir::$(yarn cache dir)"'
+      - uses: actions/cache@v1
+        id: yarn-cache
+        with:
+          path: '${{ steps.yarn-cache-dir-path.outputs.dir }}'
+          key: "${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}"
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+      - name: yarn install
+        run: yarn install --frozen-lockfile
+      - name: Lint project
+        uses: vtex/action-lint@master

.github/workflows/pull-request.yml

@@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+### Security
+- Bump multiple package versions.
 
 ## [2.0.4] - 2020-04-28
 ### Fixed

CHANGELOG.md

@@ -3,7 +3,7 @@
   "private": true,
   "license": "UNLICENSED",
   "scripts": {
-    "lint": "cd ./react && yarn lint",
+    "lint": "eslint --ext ts,tsx .",
     "format": "prettier --write \"**/*.{ts,js,json}\"",
     "test": "cd ./react && yarn test",
     "lint:locales": "intl-equalizer",
@@ -21,6 +21,9 @@
       "eslint --fix",
       "prettier --write"
     ],
+    "*.{json,graphql,gql}": [
+      "prettier --write"
+    ],
     "*.json": [
       "prettier --write"
     ]
@@ -31,7 +34,7 @@
     "@vtex/prettier-config": "^0.1.3",
     "eslint": "^6.8.0",
     "eslint-config-vtex": "^12.2.1",
-    "eslint-config-vtex-react": "^5.1.0",
+    "eslint-config-vtex-react": "^6.1.0",
     "husky": "^4.2.0",
     "lint-staged": "^10.0.2",
     "prettier": "^1.19.1",

package.json

@@ -1,5 +1,5 @@
 {
-  "extends": "vtex-react",
+  "extends": "vtex-react/io",
   "env": {
     "browser": true,
     "es6": true,

react/.eslintrc.json

@@ -1,5 +1,4 @@
 import React, { FC, Fragment } from 'react'
-import { prop } from 'ramda'
 import { useQuery } from 'react-apollo'
 
 import RightArrow from './components/icons/RightArrow'
@@ -12,31 +11,35 @@ interface Props {
   }
 }
 
+interface SearchQueryResult {
+  searchEngine: SearchResult[]
+}
+
 interface SearchResult {
   title: string
   snippet: string
   link: string
 }
 
-const isNotLastResult = (results: [SearchResult], index: number) =>
+const isNotLastResult = (results: SearchResult[], index: number) =>
   index !== results.length - 1
 
 const isFirstResult = (index: number) => index === 0
 
 const Search: FC<Props> = ({ query }) => {
   const queryString = query.q || ''
 
-  const { data, loading } = useQuery(searchEngine, {
+  const { data, loading } = useQuery<SearchQueryResult>(searchEngine, {
     variables: { searchQuery: queryString },
   })
 
-  const results: [SearchResult] = prop('searchEngine', data) || []
+  const results = data?.searchEngine ?? []
 
   return (
     <Fragment>
       {!loading ? (
         queryString && (
-          <div className={`w-100 flex flex-column`}>
+          <div className="w-100 flex flex-column">
             <h1 className="t-heading-3">
               {results.length > 0
                 ? `Results for "${queryString}"`

react/Search.tsx

@@ -109,7 +109,7 @@ function useAppVersionDispatch() {
 const EnhancedAppVersionProvider: FC = ({ children }) => {
   const { route, navigate } = useRuntime()
   const app = route?.params?.app || IO_DOCUMENTATION
-  const appName = app.split('@')[0]
+  const [appName] = app.split('@')
   const appVersionFromUrl = app?.split('@')[1]
 
   const { data, loading, error } = useQuery(publishedQuery, {
@@ -121,14 +121,15 @@ const EnhancedAppVersionProvider: FC = ({ children }) => {
   // Just a bit hacky: It always check if the url has a trailing slash, setting it if not.
   // It's useful for README's that link to other files
   useEffect(() => {
-    if (!appVersionFromUrl || route.path.endsWith('/')){
+    if (!appVersionFromUrl || route.path.endsWith('/')) {
       return
     }
     navigate({
-      to: route.path + '/',
+      to: `${route.path}/`,
       replace: true,
-      preventRemount: true
+      preventRemount: true,
     })
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [route.path])
 
   // Always set the app's version on the URL (except io-documentation)
@@ -145,8 +146,9 @@ const EnhancedAppVersionProvider: FC = ({ children }) => {
     navigate({
       page: route.id,
       params: { ...currentParams, app: updatedApp },
-      replace: true
+      replace: true,
     })
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [data])
 
   if (loading) {

react/components/AppVersionContext.tsx

@@ -10,7 +10,7 @@ const SearchBar: FC = () => {
 
   const [inputString, setInputString] = useState(queryString ?? '')
 
-  const handleSubmit = (e: any) => {
+  const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault()
     if (inputString !== '') {
       navigate({
@@ -22,8 +22,8 @@ const SearchBar: FC = () => {
   }
 
   return (
-    <div className={`flex items-center`}>
-      <form onSubmit={(e: any) => handleSubmit(e)}>
+    <div className="flex items-center">
+      <form onSubmit={(e: React.FormEvent) => handleSubmit(e)}>
         <InputSearch
           placeholder="Search IO Docs..."
           value={inputString}
@@ -32,7 +32,7 @@ const SearchBar: FC = () => {
           }) => {
             setInputString(e.target.value)
           }}
-          onSubmit={(e: any) => handleSubmit(e)}
+          onSubmit={(e: React.FormEvent) => handleSubmit(e)}
           size="small"
         />
       </form>