aboutsummaryrefslogtreecommitdiff
path: root/packages/anastasis-webui/src/routes/profile/index.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/anastasis-webui/src/routes/profile/index.tsx')
-rw-r--r--packages/anastasis-webui/src/routes/profile/index.tsx44
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;