feat(Tests): updated example application structure

src/App.tsx

@@ -1,5 +1,11 @@
 import React from 'react';
 
+import { Rocket } from '~/components/rocket-launcher/Rocket';
+
 export const App: React.FC = () => {
-  return <div className='container'>🚀</div>;
+  return (
+    <div className='container'>
+      <Rocket />
+    </div>
+  );
 };

src/components/rocket-launcher/Rocket.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { useRocket } from './useRocket';
+
+export const Rocket: React.FC = () => {
+  const { fire, isFired } = useRocket();
+
+  return (
+    <div
+      className='rocket'
+      onClick={fire}
+    >
+      {isFired ? '🔥' : '🚀'}
+    </div>
+  );
+};

src/components/rocket-launcher/useRocket.tsx

@@ -0,0 +1,13 @@
+import {
+  useCallback, useState,
+} from 'react';
+
+export const useRocket = () => {
+  const [isFired, setIsFired] = useState(false);
+
+  const fire = useCallback(() => {
+    setIsFired(true);
+  }, []);
+
+  return { fire, isFired };
+};

src/style.scss

@@ -17,6 +17,11 @@ $color: black;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  font-size: 5em;
   background-color: $color;
 }
+
+.rocket {
+  cursor: pointer;
+  font-size: 6em;
+  user-select: none;
+}