Convert React component to functional component - generated by AIPR #1057

frontend/src/components/profile/skill.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react'
+import React from 'react'
 import { withRouter } from 'react-router-dom'
 import { injectIntl } from 'react-intl'
 import PropTypes from 'prop-types'
@@ -12,31 +12,29 @@ import {
 } from '@material-ui/core'
 import FolderIcon from '@material-ui/icons/Folder'
 
-class Skill extends Component {
-  render () {
-    const { classes, title } = this.props
+function Skill(props) {
+  const { classes, title } = props;
 
-    return (
-      <Grid container direction='row' alignItems='center' xs={ 6 }>
-        <Grid item xs={ 2 }>
-          <Avatar className={ classNames(classes.avatar, classes.bigAvatar) }>
+  return (
+    <Grid container direction='row' alignItems='center' xs={6}>
+        <Grid item xs={2}>
+          <Avatar className={classNames(classes.avatar, classes.bigAvatar)}>
             <FolderIcon />
           </Avatar>
         </Grid>
-        <Grid item xs={ 6 }>
+        <Grid item xs={6}>
           <Typography variant='body1' color='default'>
-            { title }
+            {title}
           </Typography>
         </Grid>
-        <Grid item xs={ 4 } alignItems='flex-end'>
-          <Checkbox onClick={ this.props.onClick } checked={ this.props.isSelected ? 'checked' : '' } />
+        <Grid item xs={4} alignItems='flex-end'>
+          <Checkbox onClick={props.onClick} checked={props.isSelected ? 'checked' : ''} />
         </Grid>
       </Grid>
-    )
-  }
+  );
 }
 
-Skill.PropTypes = {
+Skill.propTypes = {
   classes: PropTypes.object.isRequired,
   preferences: PropTypes.string,
   language: PropTypes.string,