feat: extract component

src/app/page.tsx

@@ -1,12 +1,25 @@
 import { Center, Container, Input, Text, VStack } from "@chakra-ui/react";
 
+interface QuestionBoxProps {
+  question: string;
+}
+
+const QuestionBox = (props: QuestionBoxProps) => {
+  const { question } = props;
+  return (
+    <>
+      <Text>{question}</Text>
+      <Input placeholder="Subtle" variant="subtle" />
+    </>
+  );
+};
+
 export default function Home() {
   return (
     <Container h="100vh" w="100vw">
       <Center h="100%">
         <VStack>
-          <Text>Quanto è lunga una patatina chips?</Text>
+          <QuestionBox question="Quanto è lunga una patatina chips?" />
-          <Input placeholder="Subtle" variant="subtle" />
         </VStack>
       </Center>
     </Container>