From 3282e6f3259529bcb5d31bbcb5c3d392d54c4fb9 Mon Sep 17 00:00:00 2001
From: kajkal <essp33og@anonaddy.me>
Date: Sun, 26 Mar 2023 14:10:33 +0200
Subject: [PATCH] simplify opening a new viewer tab

---
 app/src/App.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/app/src/App.tsx b/app/src/App.tsx
index 3e0f5c3..f72bd8f 100644
--- a/app/src/App.tsx
+++ b/app/src/App.tsx
@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import { styled, globalStyles } from "./stitches.config";
 import { PMTiles } from "../../js/index";
 import { GitHubLogoIcon } from "@radix-ui/react-icons";
@@ -14,9 +14,10 @@ const Header = styled("div", {
   padding: "0 $2 0 $2",
 });
 
-const Title = styled("span", {
+const Title = styled("a", {
   fontWeight: 500,
-  cursor: "pointer",
+  color: "unset",
+  textDecoration: "none",
 });
 
 const GithubA = styled("a", {
@@ -88,7 +89,8 @@ function App() {
     }
   }, [file]);
 
-  let clear = () => {
+  let clear = (event: React.MouseEvent<HTMLAnchorElement>) => {
+    event.preventDefault();
     setFile(undefined);
   };
 
@@ -99,7 +101,7 @@ function App() {
   return (
     <div>
       <Header>
-        <Title onClick={clear}>PMTiles Viewer</Title>
+        <Title href="/" onClick={clear}>PMTiles Viewer</Title>
         <GithubLink>
           <GithubA href="https://github.com/protomaps/PMTiles" target="_blank">
             <GitHubLogoIcon /> {GIT_SHA}