diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx
index d9e12b4..a89a1d0 100644
--- a/app/dashboard/page.tsx
+++ b/app/dashboard/page.tsx
@@ -3,8 +3,9 @@
import { useEffect, useState } from "react"
import Link from "next/link"
import TunnelConfig, { type TunnelConfig as TunnelConfigType, type Server } from "@/components/tunnel-config"
-import UserMenu from "@/components/user-menu"
import { authClient } from "@/lib/auth-client"
+import SiteHeader from "@/components/site-header"
+import SiteFooter from "@/components/site-footer"
const defaultConfig: TunnelConfigType = {
type: "http",
@@ -77,15 +78,6 @@ export default function DashboardPage() {
fetchSession()
}, [])
- const handleSignOut = async () => {
- try {
- await authClient.signOut()
- setSession(null)
- } catch (error) {
- console.error("Error signing out", error)
- }
- }
-
const stopConnection = (id: string) => {
setActiveConnections((prev) => prev.filter((conn) => conn.id !== id))
setStatusMessage("Connection stopped")
@@ -93,202 +85,7 @@ export default function DashboardPage() {
return (
-
-
-
-
-
-
- tunnl.live
-
-
-
-
- {session?.user ? (
-
- ) : (
- <>
-
-
- Sign In
-
-
-
-
-
Sign in to save configurations & view history
-
- >
- )}
-
-
-
-
+
@@ -406,152 +203,7 @@ export default function DashboardPage() {
-
+
)
}
diff --git a/app/page.tsx b/app/page.tsx
index 17cccb4..6784352 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,11 +1,11 @@
"use client"
-import { useEffect, useState } from "react"
+import { useState } from "react"
import TunnelConfig, { type TunnelConfig as TunnelConfigType, type Server } from "@/components/tunnel-config"
-import Link from "next/link"
-import { authClient } from "@/lib/auth-client";
-import UserMenu from "@/components/user-menu"
-import { redirect, RedirectType } from 'next/navigation'
+import SiteHeader from "@/components/site-header"
+import SiteFooter from "@/components/site-footer"
+import { authClient } from "@/lib/auth-client"
+import { useEffect } from "react"
const defaultConfig: TunnelConfigType = {
type: "http",
@@ -33,595 +33,9 @@ export default function Home() {
fetchData();
}, []);
-
- const logout = async() => {
- await authClient.signOut({
- fetchOptions: {
- onSuccess: () => {
- redirect('/login', RedirectType.replace)
- }
- }
- })
- }
-
return (
-
-
-
-
-
-
- tunnl.live
-
-
-
-
- {logedin != null ? (
-
- ) : (
- <>
-
-
- Sign In
-
-
-
-
-
Sign in to save configurations & view history
-
- >
- )}
-
-
-
-
+
@@ -725,540 +139,7 @@ export default function Home() {
-
+
)
}
diff --git a/app/settings/page.tsx b/app/settings/page.tsx
index 58039ff..98c2754 100644
--- a/app/settings/page.tsx
+++ b/app/settings/page.tsx
@@ -1,9 +1,9 @@
"use client"
import { useEffect, useState } from "react"
-import Link from "next/link"
-import UserMenu from "@/components/user-menu"
import { authClient } from "@/lib/auth-client"
+import SiteHeader from "@/components/site-header"
+import SiteFooter from "@/components/site-footer"
export default function SettingsPage() {
type SessionResponse = Awaited>
@@ -34,434 +34,7 @@ export default function SettingsPage() {
return (
-
-
-
-
-
-
- tunnl.live
-
-
-
-
- {session?.user ? (
-
{
- try {
- await authClient.signOut()
- setSession(null)
- } catch (error) {
- console.error("Error signing out", error)
- }
- }}
- />
- ) : (
- <>
-
-
- Sign In
-
-
-
-
-
Sign in to save configurations & view history
-
- >
- )}
-
-
-
-
+
@@ -505,378 +78,7 @@ export default function SettingsPage() {
-
+
)
}
diff --git a/components/site-footer.tsx b/components/site-footer.tsx
new file mode 100644
index 0000000..87c71d8
--- /dev/null
+++ b/components/site-footer.tsx
@@ -0,0 +1,35 @@
+"use client"
+
+import TunnlLogo from "./tunnl-logo"
+import Link from "next/link"
+
+export default function SiteFooter() {
+ return (
+
+ )
+}
diff --git a/components/site-header.tsx b/components/site-header.tsx
new file mode 100644
index 0000000..b7dd32b
--- /dev/null
+++ b/components/site-header.tsx
@@ -0,0 +1,109 @@
+"use client"
+
+import Link from "next/link"
+import TunnlLogo from "./tunnl-logo"
+import UserMenu from "./user-menu"
+import { useEffect, useState } from "react"
+import { authClient } from "@/lib/auth-client";
+import { redirect, RedirectType } from 'next/navigation'
+
+export default function SiteHeader() {
+ type SessionData = Awaited>;
+ const [logedin, setLogedin] = useState(null)
+
+ useEffect(() => {
+ const fetchData = async () => {
+ try {
+ const result = await authClient.getSession()
+ if (result.data != null) {
+ setLogedin(result.data.user);
+ }
+ } catch (error) {
+ console.error('Error fetching data:', error);
+ }
+ };
+
+ fetchData();
+ }, []);
+
+ const logout = async () => {
+ await authClient.signOut({
+ fetchOptions: {
+ onSuccess: () => {
+ redirect('/login', RedirectType.replace)
+ }
+ }
+ })
+ }
+ return (
+
+
+
+
+
+
+ tunnl.live
+
+
+
+
+ {logedin ? (
+
+ ) : (
+ <>
+
+
+ Sign In
+
+
+
+
+
Sign in to save configurations & view history
+
+ >
+ )}
+
+
+
+
+ )
+}
diff --git a/components/tunnl-logo.tsx b/components/tunnl-logo.tsx
new file mode 100644
index 0000000..ae39b77
--- /dev/null
+++ b/components/tunnl-logo.tsx
@@ -0,0 +1,521 @@
+"use client"
+
+export default function TunnlLogo() {
+ return (
+
+ )
+}