src/App.tsx

@@ -1,10 +1,15 @@
-import Alert from "./components/Alert";
-
+import ListGroup from "./components/ListGroup";
 
 function App() {
+    let items = ["New York", "San Francisco", "Tokyo", "London"];
+
+    const handleSelectItem = (item: string) => {
+      console.log(item)
+    }
+
   return (
     <div>
-      <Alert>Hello Marx</Alert>
+      <ListGroup items={items} heading="Cities" onSelectItem={handleSelectItem}/>
     </div>
   );
 }

src/components/Alert.tsx

@@ -1,11 +0,0 @@
-interface Props{
-    children: string;
-}
-
-function Alert({children} : Props) {
-  return (
-    <div className="alert alert-primary">{children}</div>
-  )
-}
-
-export default Alert