From 2886989835d84222c6621e02e61a1deb6d210c13 Mon Sep 17 00:00:00 2001
From: Adrian Rumpold <a.rumpold@gmail.com>
Date: Wed, 30 Apr 2025 12:15:44 +0200
Subject: [PATCH] Fix history state manipulation

---
 frontend/src/components/CelexSelector/CelexSelector.tsx | 3 +++
 frontend/src/hooks/urlSync.ts                           | 2 +-
 frontend/src/pages/MainView.tsx                         | 2 +-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/CelexSelector/CelexSelector.tsx b/frontend/src/components/CelexSelector/CelexSelector.tsx
index e2bbad2..08c5356 100644
--- a/frontend/src/components/CelexSelector/CelexSelector.tsx
+++ b/frontend/src/components/CelexSelector/CelexSelector.tsx
@@ -17,6 +17,9 @@ function CelexSelector() {
           setArticleId(1);
         }}
       >
+        <option value="" disabled>
+          Select an example
+        </option>
         {examples.map((example) => (
           <option key={example.id} value={example.id}>
             {example.name}
diff --git a/frontend/src/hooks/urlSync.ts b/frontend/src/hooks/urlSync.ts
index 8050c94..1796081 100644
--- a/frontend/src/hooks/urlSync.ts
+++ b/frontend/src/hooks/urlSync.ts
@@ -30,7 +30,7 @@ export const useUrlSync = () => {
 
   // Update the URL when Zustand changes
   useEffect(() => {
-    if (celexId === null) {
+    if (!celexId) {
       return;
     }
     let targetUrl = `/${celexId}`;
diff --git a/frontend/src/pages/MainView.tsx b/frontend/src/pages/MainView.tsx
index 4b77448..b914501 100644
--- a/frontend/src/pages/MainView.tsx
+++ b/frontend/src/pages/MainView.tsx
@@ -4,7 +4,7 @@ import useNavStore from "../store/navStore";
 
 function MainView() {
   useUrlSync();
-  const celexId = useNavStore((state) => state.celexId);
+  const celexId = useNavStore.use.celexId();
 
   if (!celexId) {
     return <div>Error: No CELEX ID provided</div>;