diff options
Diffstat (limited to 'packages/anastasis-webui/src/routes/profile/index.tsx')
-rw-r--r-- | packages/anastasis-webui/src/routes/profile/index.tsx | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/packages/anastasis-webui/src/routes/profile/index.tsx b/packages/anastasis-webui/src/routes/profile/index.tsx new file mode 100644 index 000000000..023b56c9d --- /dev/null +++ b/packages/anastasis-webui/src/routes/profile/index.tsx @@ -0,0 +1,44 @@ +import { FunctionalComponent, h } from 'preact'; +import { useEffect, useState } from 'preact/hooks'; +import style from './style.css'; + +interface Props { + user: string; +} + +const Profile: FunctionalComponent<Props> = (props: Props) => { + const { user } = props; + const [time, setTime] = useState<number>(Date.now()); + const [count, setCount] = useState<number>(0); + + // gets called when this route is navigated to + useEffect(() => { + const timer = window.setInterval(() => setTime(Date.now()), 1000); + + // gets called just before navigating away from the route + return (): void => { + clearInterval(timer); + }; + }, []); + + // update the current time + const increment = (): void => { + setCount(count + 1); + }; + + return ( + <div class={style.profile}> + <h1>Profile: {user}</h1> + <p>This is the user profile for a user named {user}.</p> + + <div>Current time: {new Date(time).toLocaleString()}</div> + + <p> + <button onClick={increment}>Click Me</button> Clicked {count}{' '} + times. + </p> + </div> + ); +}; + +export default Profile; |