use functional component when you have stateless component

[tawfiknasser]

https://medium.com/@Zwenza/functional-vs-class-components-in-react-231e3fbd7108

ReactyFeedback/src/components/Data/Data.js

Lines 1 to 20 in cac64b8

	import React from "react";
	import './Data.css'
	export default class Data extends React.Component {
	render() {
	const { categoryData, chosenCat } = this.props;
	let currentCategory = "";
	if( chosenCat == "Social Medias") currentCategory = "SocialMedia";
	else if( chosenCat == "News") currentCategory = "News";
	else if( chosenCat == "Search Engines") currentCategory = "SearchEngines"
	else currentCategory = "Static";
	return (
	<div className="data--container">
	<h3>{categoryData[currentCategory].name}</h3>
	<p>{categoryData[currentCategory].desc}</p>
	</div>
	);
	}
	}

[tawfiknasser]

same

ReactyFeedback/src/components/Icons/Icons.js

Lines 4 to 41 in cac64b8

	export default class Icons extends React.Component {
	render() {
	const { display, categoryData, chosenCat, displayFeedbackForm } = this.props;
	let iconsArray = [];
	let name = "";
	let currentCategory = "";
	if (chosenCat == "Social Medias") currentCategory = "SocialMedia";
	else if (chosenCat == "News") currentCategory = "News";
	else if (chosenCat == "Search Engines") currentCategory = "SearchEngines";
	else currentCategory = "Static";
	if (categoryData[currentCategory])
	iconsArray = categoryData[currentCategory].icons;
	return (
	<div className="icons--container" style={{ display: display }}>
	{
	iconsArray != undefined &&
	(
	<>
	<Icon displayFeedbackForm={displayFeedbackForm} name={iconsArray[0].name} imgSrc={iconsArray[0].url} />
	<Icon displayFeedbackForm={displayFeedbackForm} name={iconsArray[1].name} imgSrc={iconsArray[1].url} />
	<Icon displayFeedbackForm={displayFeedbackForm} name={iconsArray[2].name} imgSrc={iconsArray[2].url} />
	<Icon displayFeedbackForm={displayFeedbackForm} name={iconsArray[3].name} imgSrc={iconsArray[3].url} />
	</>
	)
	}
	</div>
	);
	}
	}