split keystore and chat pages

src/app/components/Header.tsx

@@ -1,20 +1,25 @@
 import { Block, BlockTypes } from "@/components/Block";
 import { Title } from "@/components/Title";
 import { Status } from "@/components/Status";
-import { useStore, useWallet } from "@/hooks";
+import { useStore } from "@/hooks";
 import { Button } from "@/components/Button";
 
-export const Header: React.FunctionComponent<{}> = () => {
+type HeaderProps = {
+  onWalletConnect?: () => void;
+}
+
+export const Header: React.FunctionComponent<HeaderProps> = (props) => {
   const { appStatus, wallet } = useStore();
-  const { onWalletConnect } = useWallet();
 
   return (
     <>
       <Block className="mb-5" type={BlockTypes.FlexHorizontal}>
         <Title>Waku RLN</Title>
-        <Button onClick={onWalletConnect}>
+        {props.onWalletConnect && (
-          Connect Wallet
+          <Button onClick={props.onWalletConnect}>
-        </Button>
+            Connect Wallet
+          </Button>
+        )}
       </Block>
       <Status text="Application status" mark={appStatus} />
       {wallet && <p className="mt-3 text-sm">Wallet connected: {wallet}</p> }

src/app/home/page.tsx

@@ -1,15 +1,11 @@
 "use client";
-import { Header } from "./components/Header";
+import { Header } from "@/app/components/Header";
-import { Waku } from "./components/Waku";
+import { Waku } from "@/app/components/Waku";
-import { Keystore } from "./components/Keystore";
-import { KeystoreDetails } from "./components/KeystoreDetails";
 
 export default function Home() {
   return (
     <main className="flex min-h-screen flex-col p-24 font-mono max-w-screen-lg m-auto">
       <Header />
-      <Keystore />
-      <KeystoreDetails />
       <Waku />
     </main>
   );

src/app/keystore/page.tsx

@@ -0,0 +1,16 @@
+"use client";
+import { Header } from "@/app/components/Header";
+import { Keystore } from "@/app/components/Keystore";
+import { KeystoreDetails } from "@/app/components/KeystoreDetails";
+import { useWallet } from "@/hooks";
+
+export default function KeystorePage() {
+    const { onWalletConnect } = useWallet();
+  return (
+    <main className="flex min-h-screen flex-col p-24 font-mono max-w-screen-lg m-auto">
+      <Header onWalletConnect={onWalletConnect} />
+      <Keystore />
+      <KeystoreDetails />
+    </main>
+  );
+}

src/services/waku.ts

@@ -52,7 +52,7 @@ class Relay {
 
       this.subscriptionRoutine = window.setInterval(async () => {
         await this.fetchMessages();
-      },  SECOND);
+      },  5 * SECOND);
 
       this.contentTopicListeners.set(contentTopic, 1);
     } catch (error) {