From dffe2301d9510bfd74876e701e4f3d990100a235 Mon Sep 17 00:00:00 2001
From: piecanoe <karenkaydu@gmail.com>
Date: Wed, 3 Apr 2024 11:55:21 -0700
Subject: [PATCH 1/4] Create Emoji component

---
 src/components/Emoji.jsx | 7 +++++++
 1 file changed, 7 insertions(+)
 create mode 100644 src/components/Emoji.jsx

diff --git a/src/components/Emoji.jsx b/src/components/Emoji.jsx
new file mode 100644
index 0000000..9a6065f
--- /dev/null
+++ b/src/components/Emoji.jsx
@@ -0,0 +1,7 @@
+export function Emoji({ children, label }) {
+	return (
+		<span role="img" aria-label={label}>
+			{children}
+		</span>
+	);
+}

From efecbe4ac21abdc37a91c814f695464d72c2b1a8 Mon Sep 17 00:00:00 2001
From: piecanoe <karenkaydu@gmail.com>
Date: Wed, 3 Apr 2024 11:56:13 -0700
Subject: [PATCH 2/4] Import Emoji component into About page

---
 src/views/About.jsx | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/src/views/About.jsx b/src/views/About.jsx
index cbedf17..aef13dc 100644
--- a/src/views/About.jsx
+++ b/src/views/About.jsx
@@ -1,14 +1,7 @@
+import { Emoji } from '../components';
 import './About.css';
 
 export function About() {
-	function Emoji({ children, label }) {
-		return (
-			<span role="img" aria-label={label}>
-				{children}
-			</span>
-		);
-	}
-
 	return (
 		<>
 			<main className="About-main">

From a098c2de53953a3dd42a533f270b0bde85f7e699 Mon Sep 17 00:00:00 2001
From: piecanoe <karenkaydu@gmail.com>
Date: Wed, 3 Apr 2024 11:57:36 -0700
Subject: [PATCH 3/4] Import Emoji component into Layout.jsx and replace
 previous span containing emoji with Emoji component

---
 src/components/index.js | 1 +
 src/views/Layout.jsx    | 7 ++-----
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/components/index.js b/src/components/index.js
index f2a2d77..6944384 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -3,3 +3,4 @@ export * from './SingleList';
 export * from './Dialog';
 export * from './AddItem';
 export * from './SortedItemsMap';
+export * from './Emoji';
diff --git a/src/views/Layout.jsx b/src/views/Layout.jsx
index 0d8e25c..2023cac 100644
--- a/src/views/Layout.jsx
+++ b/src/views/Layout.jsx
@@ -1,6 +1,6 @@
 import { Outlet, NavLink } from 'react-router-dom';
 import { useAuth, SignInButton, SignOutButton } from '../api/useAuth.jsx';
-
+import { Emoji } from '../components';
 import './Layout.css';
 import { auth } from '../api/config.js';
 
@@ -39,10 +39,7 @@ export function Layout() {
 				</main>
 				<footer className="Layout-footer">
 					<p className="Layout-footer-attribution">
-						Crafted with care{' '}
-						<span role="img" aria-label="purple-heart">
-							💜{' '}
-						</span>
+						Crafted with care <Emoji label="purple-heart">💜</Emoji>
 						by{' '}
 						<a
 							className="Layout-footer-link"

From fb05aa177f0de1e55ef1e493938e863291a112e8 Mon Sep 17 00:00:00 2001
From: Karen Du <122697843+piecanoe@users.noreply.github.com>
Date: Wed, 3 Apr 2024 13:49:45 -0700
Subject: [PATCH 4/4] Add space after heart emoji

Co-authored-by: Jessica Hsiang <64502078+hsiangj@users.noreply.github.com>
---
 src/views/Layout.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Layout.jsx b/src/views/Layout.jsx
index 2023cac..5271dae 100644
--- a/src/views/Layout.jsx
+++ b/src/views/Layout.jsx
@@ -40,7 +40,7 @@ export function Layout() {
 				<footer className="Layout-footer">
 					<p className="Layout-footer-attribution">
 						Crafted with care <Emoji label="purple-heart">💜</Emoji>
-						by{' '}
+						{' '}by{' '}
 						<a
 							className="Layout-footer-link"
 							href="https://github.com/amalyam"