ok

Author: jk1497

components/CsvReader.js

@@ -0,0 +1,27 @@
+import { useState } from "react"
+
+export default function CsvReader(){
+ // const [csvFile, setCsvFile] = useState();
+
+ const myList = ['Peter', 'Sachin', 'Kevin', 'Dhoni', 'Alisa']; 
+ const listItems = myList.map((myList)=>{ 
+ return <li>{myList}</li>; 
+ }); 
+
+ // const submit = () => {
+ // const file = csvFile;
+ // const reader = new FileReader();
+
+ // reader.onload = function(e) {
+ // const text = e.target.result;
+ // }
+
+ // reader.readAsText(file);
+ // }
+
+ return(
+ <form id = "csv-form">
+ {listItems}
+ </form>
+ );
+}

components/Dropdown.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { Dropdown } from "@nextui-org/react";
+
+export default function Drop() {
+ const [selected, setSelected] = React.useState(new Set(["Select Genre.."]));
+
+ const selectedValue = React.useMemo(
+ () => Array.from(selected).join(", ").replaceAll("_", " "),
+ [selected]
+ );
+
+
+ return (
+ <Dropdown>
+ <Dropdown.Button flat color="secondary" css={{ tt: "capitalize" }}>
+ {selectedValue}
+ </Dropdown.Button>
+ <Dropdown.Menu
+ aria-label="Single selection actions"
+ color="secondary"
+ disallowEmptySelection
+ selectionMode="single"
+ selectedKeys={selected}
+ onSelectionChange={setSelected}
+ >
+ <Dropdown.Item key="action">Action</Dropdown.Item>
+ <Dropdown.Item key="horror">Horror</Dropdown.Item>
+ <Dropdown.Item key="animation">Animation</Dropdown.Item>
+ </Dropdown.Menu>
+ </Dropdown>
+ );
+}

components/Wordlist.js

@@ -0,0 +1,12 @@
+import React from 'react'; 
+import ReactDOM from 'react-dom'; 
+ 
+const myList = ['Peter', 'Sachin', 'Kevin', 'Dhoni', 'Alisa']; 
+const listItems = myList.map((myList)=>{ 
+ return <li>{myList}</li>; 
+}); 
+ReactDOM.render( 
+ <ul> {listItems} </ul>, 
+ document.getElementById('app') 
+); 
+export default App;