Added language component

app/components/Lang/Lang.stories.jsx

@@ -0,0 +1,31 @@
+import styles from './page.module.css';
+
+function Lang(props) {
+  return (
+    <div className={styles.language}>
+      <label>
+        <select name="selectedLang" onChange={e => props.onSelectLanguage(e.target.value)}>
+          <option value="pt-br">Portuguese</option>
+          <option value="en">English</option>
+        </select>
+      </label>
+    </div>
+  );
+}
+
+export default {
+  component: Lang
+};
+
+/*
+ *👇 Render functions are a framework specific feature to allow you control on how the component renders.
+ * See https://storybook.js.org/docs/api/csf
+ * to learn how to use render functions.
+ */
+export const Desktop = {
+  render: () => <Lang onSelectLanguage={(value)=>{console.log(value);}}/>
+};
+
+export const Mobile = {
+  render: () => <Lang onSelectLanguage={(value)=>{console.log(value);}}/>
+};

app/components/Lang/page.module.css

@@ -0,0 +1,6 @@
+.language {
+  position: absolute;
+  top: 1rem;
+  right: 1rem;
+  color: red;
+}

app/page.js

@@ -1,11 +1,33 @@
-import Presentation from './components/Presentation/Presentation.stories'
+'use client'
+
 import Page from './components/Page/Page.stories'
+import Lang from './components/Lang/Lang.stories'
+import language from './language.json'
+import { useEffect, useState } from "react";
 
 export default function Home() {
+
+  const [language, setLanguage] = useState('pt-br');
+
+  // useEffect(() => {    
+  //   // Atualiza o título do documento usando a API do browser    
+  //   document.title = `Você clicou ${count} vezes`;  
+  // });
+
+  const handleLanguage = (langValue) => {
+    setLanguage(langValue);
+  }
+
   return (
     <main>
       <Page.component>
-        <Presentation.component primary />
+        AQUI: {language}
+        <Lang.component onSelectLanguage={handleLanguage} />
+        {/* <Menu /> */}
+        {/* <Content> */}
+          {/* <Post></Post> */}
+          {/* <Post></Post> */}
+        {/* </Content> */}
       </Page.component>
     </main>
   )