Minor updates

Author: svwoodhouse

.gitignore

@@ -22,3 +22,4 @@ node_modules
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+.eslintcache

Sections/Section 3/01-starting-setup/src/App.js

@@ -1,6 +1,6 @@
-import Expenses from "./components/Expenses";
+import Expenses from "./components/Expenses/Expenses";
 
-function App() {
+const App = () => {
   const expenses = [
     {
       id: 'e1',

Sections/Section 3/01-starting-setup/src/components/ExpenseDate.css renamed to Sections/Section 3/01-starting-setup/src/components/Expenses/ExpenseDate.css

@@ -1,5 +1,5 @@
 import './ExpenseDate.css'
-function ExpenseDate(props) {
+const ExpenseDate = (props) => {
     const month = props.date.toLocaleString('en-US', {month: 'long'});
     const day = props.date.toLocaleString('en-US', {day: '2-digit'});
     const year = props.date.getFullYear();

Sections/Section 3/01-starting-setup/src/components/ExpenseDate.js renamed to Sections/Section 3/01-starting-setup/src/components/Expenses/ExpenseDate.js

@@ -1,15 +1,16 @@
 import './ExpenseItem.css'
 import ExpenseDate from './ExpenseDate'
-import Card from './Card'
+import Card from '../UI/Card'
 
-function ExpenseItem (props) {
+const ExpenseItem = (props) => {
     return (
         <Card className="expense-item">
             <ExpenseDate date={props.date}/>
             <div className="expense-item__description">
                 <h2>{props.title}</h2>
                 <div className="expense-item__price">${props.amount}</div>
             </div>
+            <button>Change Title</button>
         </Card>
     )
 }

Sections/Section 3/01-starting-setup/src/components/ExpenseItem.css renamed to Sections/Section 3/01-starting-setup/src/components/Expenses/ExpenseItem.css

@@ -1,13 +1,13 @@
 import './Expenses.css'
 import ExpenseItem from './ExpenseItem'
-import Card from './Card'
+import Card from '../UI/Card'
 
-function Expenses (props) {
+const Expenses =  (props) => {
 
     return(
         <Card className='expenses'>
-            <ExpenseItem title={props[0].title} amount={props[0].amount} date={props[0].date}></ExpenseItem>
             <ExpenseItem title={props[1].title} amount={props[1].amount} date={props[1].date}></ExpenseItem>
+            <ExpenseItem title={props[0].title} amount={props[0].amount} date={props[0].date}></ExpenseItem>
             <ExpenseItem title={props[2].title} amount={props[2].amount} date={props[2].date}></ExpenseItem>
             <ExpenseItem title={props[3].title} amount={props[3].amount} date={props[3].date}></ExpenseItem>
         </Card>

Sections/Section 3/01-starting-setup/src/components/ExpenseItem.js renamed to Sections/Section 3/01-starting-setup/src/components/Expenses/ExpenseItem.js

@@ -1,5 +1,5 @@
 import './Card.css'
-function Card(props) {
+const Card = (props) => {
     const classes = 'card ' + props.className
 
     return <div className={classes}>{props.children}</div>