better types

client/src/components/atoms/Form/Input.tsx

@@ -1,5 +1,5 @@
 import cx from 'classnames'
-import React, { PureComponent } from 'react'
+import React, { PureComponent, FormEvent, ChangeEvent } from 'react'
 import slugify from 'slugify'
 import DatePicker from 'react-datepicker'
 import { ReactComponent as SearchIcon } from '../../../img/search.svg'
@@ -21,7 +21,13 @@ interface InputProps {
     options?: string[]
     additionalComponent?: any
     value?: string
-    onChange?: any
+    onChange?(
+        event:
+            | FormEvent<HTMLInputElement>
+            | ChangeEvent<HTMLInputElement>
+            | ChangeEvent<HTMLSelectElement>
+            | ChangeEvent<HTMLTextAreaElement>
+    ): void
     rows?: number
     group?: any
     multiple?: boolean
@@ -29,11 +35,14 @@ interface InputProps {
 
 interface InputState {
     isFocused: boolean
-    startDate?: any
+    startDate?: Date
 }
 
 export default class Input extends PureComponent<InputProps, InputState> {
-    public state: InputState = { isFocused: false, startDate: new Date() }
+    public state: InputState = {
+        isFocused: false,
+        startDate: new Date()
+    }
 
     public inputWrapClasses() {
         if (this.props.type === 'search') {
@@ -51,7 +60,7 @@ export default class Input extends PureComponent<InputProps, InputState> {
         this.setState({ isFocused: !this.state.isFocused })
     }
 
-    public handleDateChange = (date: any) => {
+    public handleDateChange = (date: Date) => {
         this.setState({
             startDate: date
         })

client/src/data/form-publish.json

@@ -26,7 +26,7 @@
       "fields": {
         "description": {
           "label": "Description",
-          "description": "Add a thorough description with as much detail as possible.",
+          "help": "Add a thorough description with as much detail as possible.",
           "placeholder": "i.e. Almond sales data ",
           "type": "textarea",
           "required": true,
@@ -34,7 +34,7 @@
         },
         "categories": {
           "label": "Categories",
-          "description": "Pick a category which best fits your data set.",
+          "help": "Pick a category which best fits your data set.",
           "type": "select",
           "required": true,
           "options": [
@@ -73,7 +73,7 @@
         },
         "dateCreated": {
           "label": "Creation Date",
-          "description": "Select the date the asset was created, or was updated for the last time.",
+          "help": "Select the date the asset was created, or was updated for the last time.",
           "type": "date",
           "required": true
         }

client/src/routes/Publish/Files/Item.tsx

@@ -2,7 +2,13 @@ import React from 'react'
 import styles from './Item.module.scss'
 import filesize from 'filesize'
 
-const Item = ({ item, removeItem }: { item: any; removeItem: any }) => (
+const Item = ({
+    item,
+    removeItem
+}: {
+    item: { url: string; found: boolean; type: string; size: number }
+    removeItem(): void
+}) => (
     <li>
         <a href={item.url}>{item.url}</a>
         <div className={styles.details}>

client/src/routes/Publish/Files/ItemForm.tsx

@@ -5,7 +5,7 @@ import Button from '../../../components/atoms/Button'
 import styles from './ItemForm.module.scss'
 
 interface ItemFormProps {
-    addItem: any
+    addItem(url: string): void
     placeholder: string
 }
 

client/src/routes/Publish/Files/index.tsx

@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react'
+import React, { FormEvent, PureComponent, ChangeEvent } from 'react'
 import { CSSTransition, TransitionGroup } from 'react-transition-group'
 import Button from '../../../components/atoms/Button'
 import Help from '../../../components/atoms/Form/Help'
@@ -8,12 +8,25 @@ import styles from './index.module.scss'
 
 import { serviceHost, servicePort, serviceScheme } from '../../../config'
 
+interface File {
+    url: string
+    found: boolean
+    size: number
+    type: string
+}
+
 interface FilesProps {
-    files: any[]
+    files: [File]
     placeholder: string
     help?: string
     name: string
-    onChange: any
+    onChange(
+        event:
+            | ChangeEvent<HTMLInputElement>
+            | FormEvent<HTMLInputElement>
+            | ChangeEvent<HTMLSelectElement>
+            | ChangeEvent<HTMLTextAreaElement>
+    ): void
 }
 
 interface FilesStates {
@@ -33,7 +46,8 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
 
     public addItem = async (value: string) => {
         let res: any
-        let file: any = { url: value, found: false }
+        let file: File = { url: value, found: false, size: 0, type: '' }
+
         try {
             const response = await fetch(
                 `${serviceScheme}://${serviceHost}:${servicePort}/api/v1/urlcheck`,

client/src/routes/Publish/Step.tsx

@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react'
+import React, { PureComponent, FormEvent, ChangeEvent } from 'react'
 import Input from '../../components/atoms/Form/Input'
 import Label from '../../components/atoms/Form/Label'
 import Row from '../../components/atoms/Form/Row'
@@ -8,20 +8,38 @@ import Files from './Files/'
 import StepRegisterContent from './StepRegisterContent'
 import styles from './Step.module.scss'
 
+interface Fields {
+    label: string
+    placeholder?: string
+    help?: string
+    type: string
+    required?: boolean
+    options?: string
+    rows?: number
+}
+
 interface StepProps {
     currentStep: number
     index: number
-    inputChange: any
+    inputChange(
-    inputToArrayChange: any
+        event:
-    fields?: any[]
+            | FormEvent<HTMLInputElement>
+            | ChangeEvent<HTMLInputElement>
+            | ChangeEvent<HTMLSelectElement>
+            | ChangeEvent<HTMLTextAreaElement>
+    ): void
+    inputToArrayChange(
+        event: ChangeEvent<HTMLSelectElement> | ChangeEvent<HTMLInputElement>
+    ): void
+    fields?: Fields
     state: any
     title: string
     description: string
-    next: any
+    next(): void
-    prev: any
+    prev(): void
     totalSteps: number
-    tryAgain: any
+    tryAgain(): void
-    toStart: any
+    toStart(): void
     publishedDid?: string
     content?: string
 }
@@ -66,7 +84,6 @@ export default class Step extends PureComponent<StepProps, {}> {
             description,
             fields,
             inputChange,
-            inputToArrayChange,
             state,
             totalSteps,
             tryAgain,
@@ -89,7 +106,6 @@ export default class Step extends PureComponent<StepProps, {}> {
 
                 {fields &&
                     Object.entries(fields).map(([key, value]) => {
-
                         if (key === 'files') {
                             return (
                                 <Row key={key}>

client/src/routes/Publish/StepRegisterContent.tsx

@@ -4,8 +4,8 @@ import Spinner from '../../components/atoms/Spinner'
 import styles from './StepRegisterContent.module.scss'
 
 interface StepRegisterContentProps {
-    tryAgain: any
+    tryAgain(): void
-    toStart: any
+    toStart(): void
     state: any
     content?: string
 }