Merge pull request #1233 from vtex/fix/statement-lint

#trivial Fix VerbAtom & SubjectAtom lint issues
vtex · Jun 10, 2020 · a09ded2 · a09ded2
2 parents b362dd5 + 597816d
commit a09ded2
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 19 deletions.
diff --git a/react/components/Statement/Atoms/SubjectAtom.tsx b/react/components/Statement/Atoms/SubjectAtom.tsx
@@ -1,8 +1,14 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import React from 'react'
 
 import Select from '../../EXPERIMENTAL_Select/index'
 import { VerbOption } from './VerbAtom'
-import { GroupedOptions, SelectOptionGroup, SelectedOption } from '../typings'
+import {
+  GroupedOptions,
+  SelectOptionGroup,
+  SelectedOption,
+  SelectOption,
+} from '../typings'
 
 const ATOM_COMPONENT_MIN_WIDTH = '20%'
 
@@ -17,13 +23,13 @@ export type SubjectOptions = {
 
 type Props = {
   subject?: string
-  onChange: (string) => void
+  onChange: (e: string) => void
   options: SubjectOptions
   placeholder: string
   isFullWidth: boolean
 }
 
-const groupOptions = options => {
+const groupOptions = (options: Record<string, any>) => {
   const groupedOptions = Object.keys(options).reduce<GroupedOptions>(
     (optionsGroup, subject) => {
       const option = options[subject]
@@ -63,19 +69,27 @@ const SubjectAtom: React.FC<Props> = ({
       ? optionsGroup[0].options
       : optionsGroup
 
-  const selected = optionsGroup.reduce<SelectedOption>((selected, group) => {
-    if (selected) {
-      return selected
-    }
+  const selected = optionsGroup.reduce<SelectedOption | undefined>(
+    (selectedOption: any, group: any) => {
+      if (selectedOption) {
+        return selectedOption
+      }
 
-    const option = group.options.find(option => option.value === subject)
-    if (option) {
-      return {
-        group: group.label !== 'undefined' ? group.label : undefined,
-        option,
+      const option = group.options.find(
+        (groupOption: SelectOption<string>) => groupOption.value === subject
+      )
+
+      if (option) {
+        return {
+          group: group.label !== 'undefined' ? group.label : undefined,
+          option,
+        }
       }
-    }
-  }, undefined)
+
+      return undefined
+    },
+    undefined
+  )
 
   return (
     <div
@@ -85,7 +99,7 @@ const SubjectAtom: React.FC<Props> = ({
       <Select
         clearable={false}
         multi={false}
-        onChange={option => onChange(option?.value)}
+        onChange={(option: SelectOption<string>) => onChange(option.value)}
         options={subjectOptions}
         placeholder={placeholder}
         value={selected?.option}

diff --git a/react/components/Statement/Atoms/VerbAtom.tsx b/react/components/Statement/Atoms/VerbAtom.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 
 import Select from '../../EXPERIMENTAL_Select/index'
 import { ObjectOption } from './ObjectAtom'
+import { SelectOption } from '../typings'
 
 export type VerbOption = {
   label: string
@@ -14,7 +15,7 @@ type Props = {
   isFullWidth?: boolean
   verb?: string
   verbOptions: VerbOption[]
-  onChange: (string) => void
+  onChange: (e: string) => void
 }
 
 const VerbAtom: React.FC<Props> = ({
@@ -37,14 +38,14 @@ const VerbAtom: React.FC<Props> = ({
             clearable={false}
             disabled={disabled}
             multi={false}
-            onChange={option => onChange(option?.value)}
+            onChange={(option: SelectOption<string>) => onChange(option.value)}
             options={verbOptions}
             placeholder=""
             value={value}
           />
         </div>
       ) : (
-        <span>{value.label}</span>
+        <span>{value?.label ?? ''}</span>
       )}
     </div>
   )

diff --git a/react/components/Statement/typings.d.ts b/react/components/Statement/typings.d.ts
@@ -22,4 +22,4 @@ export interface StatementProp {
   verb: string
   object?: unknown
   error?: string
-}
+}