on 206bf5b help sign in
35 lines 830 B history raw
1import * as React from "react";
2import { HelloComponent } from "./hello";
3import { NameEditComponent } from "./nameEdit";
5export const App = () => {
6 const [name, setName] = React.useState("defaultUserName");
7 const [editingName, setEditingName] = React.useState("defaultUserName");
9 const loadUsername = () => {
10 setTimeout(() => {
11 setName("name from async call");
12 setEditingName("name from async call");
13 }, 500);
14 };
16 React.useEffect(() => {
17 loadUsername();
18 }, []);
20 const setUsernameState = () => {
21 setName(editingName);
22 };
24 return (
25 <>
26 <HelloComponent userName={name} />
27 <NameEditComponent
28 initialUserName={name}
29 editingName={editingName}
30 onNameUpdated={setUsernameState}
31 onEditingNameUpdated={setEditingName}
32 />
33 </>
34 );
35};