Fix page refresh on desktop

src/auth/useAuth.ts

@@ -6,7 +6,7 @@ import { read_cookie } from 'sfcookies';
 function useAuth() {
 	let auth = React.useContext(AuthContext);
 
-	if(read_cookie('user').length !== 0)
+	if(!auth.user && read_cookie('user').length !== 0)
 		auth.user = read_cookie('user');
 
 	return auth;

src/components/core/navbar.tsx

@@ -120,9 +120,9 @@ const Navbar = ({ sidebarOpen, setSidebarOpen, path }) => {
             <div className="flex-1 flex flex-col overflow-y-auto">
               <nav className="flex-1 px-2 py-4 bg-gray-800 space-y-1">
                 {navigation.map((item) => (
-                  <a
-                    key={item.name}
-                    href={item.href}
+                  <Link
+                    key={`desktop_${item.name}`}
+                    to={item.href}
                     className={classNames(
                       item.href === path ? 'bg-gray-900 text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
                       'group flex items-center px-2 py-2 text-sm font-medium rounded-md'
@@ -136,7 +136,7 @@ const Navbar = ({ sidebarOpen, setSidebarOpen, path }) => {
                       aria-hidden="true"
                     />
                     {item.name}
-                  </a>
+                  </Link>
                 ))}
               </nav>
             </div>

src/pages/sell.tsx

@@ -82,33 +82,35 @@ const Sell = () => {
 			<div className="pb-5">
 				<label htmlFor="search" className="block text-sm font-medium text-gray-700">Recherche</label>
 				<div className="mt-1 relative flex items-center">
-					<input type="text" name="search" id="search" value={search} onChange={(e) => {setSearch(e.target.value)}} className="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full pr-12 sm:text-sm border-gray-300 rounded-md" />
+					<input type="text" name="search" id="search" value={search} onChange={(e) => { setSearch(e.target.value) }} className="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full pr-12 sm:text-sm border-gray-300 rounded-md" />
 				</div>
 			</div>
-			{productsList.length > 0 && [...Array.from((new Set(productsList.map(item => item.category))))].map((category) => (<div>
-				<h1 className="text-lg font-medium py-2 pt-4">{category}</h1>
-				<ul className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-5">
-					{productsList.filter((p) => p.category === category).map((product) => (
-						<SellListItem product={product} key={product.name} />
-					))}
-				</ul>
-			</div>))}
-			{productsList.length === 0 && 
-			<div className="text-center w-full mt-10">
-			<EmojiSadIcon className="mx-auto h-12 w-12 text-gray-400"/>
-			<h3 className="mt-2 text-sm font-medium text-gray-900">Aucun produit trouvé !</h3>
-			<p className="mt-1 text-sm text-gray-500">Essayez de réduire vos critères de recherche.</p>
-			<div className="mt-6">
-			  <button
-				type="button"
-				onClick={() => setSearch("")}
-				className="inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
-			  >
-				<CollectionIcon className="-ml-1 mr-2 h-5 w-5" aria-hidden="true" />
-				Afficher tout
-			  </button>
-			</div>
-		  </div>}
+			{productsList.length > 0
+				? [...Array.from(new Set(productsList.map(item => item.category)))].map((category) => (
+					<div key={category}>
+						<h1 className="text-lg font-medium py-2 pt-4">{category}</h1>
+						<ul className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-5">
+							{productsList.filter((p) => p.category === category).map((product) => (
+								<SellListItem product={product} key={product.name} />
+							))}
+						</ul>
+					</div>))
+				: <div className="text-center w-full mt-10">
+					<EmojiSadIcon className="mx-auto h-12 w-12 text-gray-400" />
+					<h3 className="mt-2 text-sm font-medium text-gray-900">Aucun produit trouvé !</h3>
+					<p className="mt-1 text-sm text-gray-500">Essayez de réduire vos critères de recherche.</p>
+					<div className="mt-6">
+						<button
+							type="button"
+							onClick={() => setSearch("")}
+							className="inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+						>
+							<CollectionIcon className="-ml-1 mr-2 h-5 w-5" aria-hidden="true" />
+							Afficher tout
+						</button>
+					</div>
+				</div>
+			}
 		</div>
 	);
 };