mountain-ui 1.0.80 → 1.0.82

package/src/routes/exemple/+layout.svelte

@@ -1,44 +1,93 @@
 <script>
 	import { page } from '$app/stores';
+	import UserDropdown from '$lib/components/User/UserDropdown.svelte';
 	import { entityRegistry } from '$lib/registry/entityRegistry/registry.svelte';
-	import ProjectDropdown from '$lib/registry/projectRegistry/components/ProjectDropdown.svelte';
 	import { projectRegistry } from '$lib/registry/projectRegistry/registry.svelte';
+	import { navigationRegistry } from '$lib/registry/navigationRegistry/registry.svelte';
+	import { IconButton } from 'hamzus-ui';
 
-    let {children} = $props()
+	let { children } = $props();
 
-    
-
-    function getHref(project) {
-        return "/exemple/" + project.normalized_name + "/home"
-    }
-    function isActive(project) {
-        return project.normalized_name === $page.params.project_normalized_name
-    }
+	function getHref(project) {
+		return '/exemple/' + project.normalized_name + '/home';
+	}
+	function isActive(project) {
+		return project.normalized_name === $page.params.project_normalized_name;
+	}
 
+	const navigation = navigationRegistry.selectNavbarState();
 </script>
 
-<nav class="top-bar">
-    <h3>Mountain UI</h3>
-	<div class="project-selector">
-		<ProjectDropdown projectId={projectRegistry.getFromNormalizedName($page.params.project_normalized_name)?.id ?? null} hubHref="/exemple" {getHref} {isActive}></ProjectDropdown>
-	</div>
-    
-</nav>
-{@render children()}
+<div class="content" style="--padding-left:{$navigation.width}px;">
+	<nav class="top-bar">
+		<div class="nav-btn">
+			<IconButton
+				onClick={() => {
+					navigationRegistry.toggleNavbar();
+				}}
+				variant="ghost"
+			>
+				<svg
+					width="24"
+					height="24"
+					viewBox="0 0 24 24"
+					fill="none"
+					xmlns="http://www.w3.org/2000/svg"
+				>
+					<path
+						d="M21 7.75H3C2.59 7.75 2.25 7.41 2.25 7C2.25 6.59 2.59 6.25 3 6.25H21C21.41 6.25 21.75 6.59 21.75 7C21.75 7.41 21.41 7.75 21 7.75Z"
+						fill="#292D32"
+					/>
+					<path
+						d="M21 12.75H3C2.59 12.75 2.25 12.41 2.25 12C2.25 11.59 2.59 11.25 3 11.25H21C21.41 11.25 21.75 11.59 21.75 12C21.75 12.41 21.41 12.75 21 12.75Z"
+						fill="#292D32"
+					/>
+					<path
+						d="M21 17.75H3C2.59 17.75 2.25 17.41 2.25 17C2.25 16.59 2.59 16.25 3 16.25H21C21.41 16.25 21.75 16.59 21.75 17C21.75 17.41 21.41 17.75 21 17.75Z"
+						fill="#292D32"
+					/>
+				</svg>
+			</IconButton>
+		</div>
+		<h3></h3>
+		<div class="project-selector">
+			<UserDropdown></UserDropdown>
+		</div>
+	</nav>
+	{@render children()}
+</div>
 
 <style>
 	.top-bar {
 		position: sticky;
 		top: 0px;
 		width: 100%;
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        flex-shrink: 0;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		flex-shrink: 0;
 		padding: var(--pad-s);
 		border-bottom: 1px solid var(--stroke);
+		background-color: var(--bg-1);
+		z-index: 15;
+	}
+
+	.content {
+		transition: padding-left 0.2s ease-out;
+		padding-left: var(--padding-left);
 	}
-	.project-selector {
-		width: min(100%, 300px);
+
+    .nav-btn {
+			display: none;
+		}
+
+	@media (max-width: 500px) {
+		.content {
+			padding-left: 0px;
+		}
+
+		.nav-btn {
+			display: block;
+		}
 	}
 </style>

package/src/routes/exemple/[project_normalized_name]/+layout.svelte

@@ -1,11 +1,15 @@
 <script>
 	import { afterNavigate, beforeNavigate } from '$app/navigation';
 	import { page } from '$app/stores';
+	import Navbar from '$lib/registry/navigationRegistry/components/Navbar.svelte';
+	import NavbarBtn from '$lib/registry/navigationRegistry/components/NavbarBtn.svelte';
 	import EntityButton from '$lib/registry/entityRegistry/components/EntityButton.svelte';
 	import { createEntity } from '$lib/registry/entityRegistry/createEntity';
 	import { entityRegistry } from '$lib/registry/entityRegistry/registry.svelte';
+	import { projectRegistry } from '$lib/registry/projectRegistry/registry.svelte';
 	import { IconButton, init, RotativeLoader, sendRequest } from 'hamzus-ui';
 	import { onMount } from 'svelte';
+	import { navigationRegistry } from '$lib/registry/navigationRegistry/registry.svelte';
 
 	let { children } = $props();
 
@@ -14,9 +18,9 @@
 	const entities = entityRegistry.getAll();
 
 	beforeNavigate((test) => {
-        if (!test.to) return
-        if (test.from.params.project_normalized_name === test.to.params.project_normalized_name) return
-        
+		if (!test.to) return;
+		if (test.from.params.project_normalized_name === test.to.params.project_normalized_name) return;
+
 		loading = true;
 	});
 
@@ -25,9 +29,8 @@
 	onMount(getData);
 
 	async function getData() {
-        console.log(loading);
-        
-        if (loading === false) return
+		if (loading === false) return;
+
 		// set le projet
 		init({
 			requestWithCredentials: true,
@@ -51,43 +54,106 @@
 			}
 		});
 
-		entityRegistry.unregisterAll();
+		const project = projectRegistry.getFromNormalizedName($page.params.project_normalized_name);
 
-		// recuperer les entités du projet
-		const requestStructures = await sendRequest({
-			path: '/get-all-entities'
-		});
+		await project.init(`/exemple/${$page.params.project_normalized_name}`);
 
-		for (const entity of requestStructures.data) {
-			entityRegistry.register(createEntity(entity));
-		}
+        navigationRegistry.enableNavbar()
 
 		loading = false;
+
+        ()=>{
+            navigationRegistry.desableNavbar()
+        }
 	}
+
+    const targetProjectHref = projectRegistry.selectTargetProjectHref()
 </script>
+<Navbar>
+    <div slot="settings">
+        <NavbarBtn text="Administrateur">
+            <svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M21.0802 8.58003V15.42C21.0802 16.54 20.4802 17.58 19.5102 18.15L13.5702 21.58C12.6002 22.14 11.4002 22.14 10.4202 21.58L4.48016 18.15C3.51016 17.59 2.91016 16.55 2.91016 15.42V8.58003C2.91016 7.46003 3.51016 6.41999 4.48016 5.84999L10.4202 2.42C11.3902 1.86 12.5902 1.86 13.5702 2.42L19.5102 5.84999C20.4802 6.41999 21.0802 7.45003 21.0802 8.58003Z" fill="#292D32"/>
+<path d="M11.9999 12.0001C13.2867 12.0001 14.3299 10.9569 14.3299 9.67004C14.3299 8.38322 13.2867 7.34009 11.9999 7.34009C10.7131 7.34009 9.66992 8.38322 9.66992 9.67004C9.66992 10.9569 10.7131 12.0001 11.9999 12.0001Z" fill="#292D32"/>
+<path d="M14.6792 16.6601C15.4892 16.6601 15.9592 15.7601 15.5092 15.0901C14.8292 14.0801 13.5092 13.4001 11.9992 13.4001C10.4892 13.4001 9.16919 14.0801 8.48919 15.0901C8.03919 15.7601 8.50919 16.6601 9.31919 16.6601H14.6792Z" fill="#292D32"/>
+</svg>
 
-<div class="entities">
-    <IconButton href="/exemple/{$page.params.project_normalized_name}/entities" variant="secondary">
-    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.9994 22.75C11.9394 22.75 11.8794 22.74 11.8294 22.73C11.7694 22.72 11.7094 22.69 11.6494 22.66L9.43938 21.56C9.06938 21.37 8.91937 20.92 9.09937 20.55C9.28937 20.18 9.73938 20.03 10.1094 20.21L11.2494 20.78V19.22C11.2494 18.81 11.5894 18.47 11.9994 18.47C12.4094 18.47 12.7494 18.81 12.7494 19.22V20.78L13.8894 20.21C14.2594 20.03 14.7094 20.18 14.8994 20.55C15.0894 20.92 14.9394 21.37 14.5594 21.56L12.3494 22.66C12.2894 22.69 12.2294 22.71 12.1694 22.73C12.1094 22.74 12.0594 22.75 11.9994 22.75ZM18.6694 19.42C18.3994 19.42 18.1294 19.27 17.9994 19.01C17.8094 18.64 17.9594 18.19 18.3394 18L20.1494 17.1V14.79C20.1494 14.38 20.4894 14.04 20.8994 14.04C21.3094 14.04 21.6494 14.38 21.6494 14.79V17.57C21.6494 17.85 21.4894 18.11 21.2394 18.24L19.0194 19.35C18.8894 19.39 18.7794 19.42 18.6694 19.42ZM5.32938 19.42C5.21938 19.42 5.09937 19.39 4.99937 19.34L2.77937 18.23C2.52937 18.1 2.36938 17.84 2.36938 17.56V14.78C2.36938 14.37 2.70938 14.03 3.11938 14.03C3.52938 14.03 3.86938 14.37 3.86938 14.78V17.09L5.67937 17.99C6.04937 18.18 6.19937 18.63 6.01937 19C5.86937 19.26 5.60938 19.42 5.32938 19.42ZM11.9994 14.42C11.5894 14.42 11.2494 14.08 11.2494 13.67V11.36L9.43938 10.46C9.06938 10.27 8.91937 9.82004 9.09937 9.45004C9.28937 9.08004 9.73938 8.93004 10.1094 9.11004L11.9994 10.05L13.8894 9.11004C14.2594 8.93004 14.7094 9.07004 14.8994 9.45004C15.0894 9.83004 14.9394 10.27 14.5594 10.46L12.7494 11.36V13.67C12.7494 14.08 12.4094 14.42 11.9994 14.42ZM20.8894 9.97004C20.4794 9.97004 20.1394 9.63004 20.1394 9.22004V7.66005L18.9994 8.23004C18.6294 8.42004 18.1794 8.27004 17.9894 7.89004C17.7994 7.52004 17.9494 7.07005 18.3294 6.88005L19.2094 6.44004L18.3294 6.00004C17.9594 5.81004 17.8094 5.36005 17.9894 4.99005C18.1794 4.62005 18.6294 4.47004 18.9994 4.65004L21.2094 5.75004C21.2294 5.76004 21.2594 5.77003 21.2794 5.79003C21.3394 5.82003 21.3894 5.87004 21.4394 5.92004C21.4694 5.96004 21.4994 6.00003 21.5294 6.04003C21.5694 6.11003 21.5994 6.18004 21.6194 6.26004C21.6294 6.32004 21.6394 6.38003 21.6394 6.43003V6.44004V9.20004C21.6394 9.64004 21.2994 9.97004 20.8894 9.97004ZM3.10938 9.97004C2.69938 9.97004 2.35938 9.63004 2.35938 9.22004V6.46005V6.45004C2.35938 6.39004 2.36937 6.33004 2.37937 6.28004C2.39937 6.20004 2.42938 6.13004 2.46938 6.06004C2.49938 6.01004 2.52937 5.97003 2.56937 5.93003C2.60937 5.89003 2.65937 5.85005 2.70937 5.82005C2.72937 5.81005 2.75937 5.79004 2.77937 5.78004L4.98937 4.68003C5.35937 4.50003 5.80937 4.64005 5.99937 5.02005C6.18937 5.40005 6.03938 5.84004 5.65938 6.03004L4.77937 6.47004L5.65938 6.91005C6.02938 7.10005 6.17937 7.55004 5.99937 7.92004C5.80937 8.29004 5.36937 8.44004 4.98937 8.26004L3.84937 7.69004V9.25004C3.85937 9.64004 3.52937 9.97004 3.10938 9.97004ZM14.2194 3.86004C14.1094 3.86004 13.9894 3.83004 13.8894 3.78004L11.9994 2.84004L10.1094 3.78004C9.73938 3.97004 9.28937 3.82004 9.09937 3.44004C8.90937 3.07004 9.05938 2.62003 9.43938 2.43003L11.6594 1.32005C11.8694 1.21005 12.1194 1.21005 12.3294 1.32005L14.5494 2.43003C14.9194 2.62003 15.0694 3.07004 14.8894 3.44004C14.7594 3.71004 14.4994 3.86004 14.2194 3.86004Z" fill="#292D32"/>
+        </NavbarBtn>
+        <NavbarBtn text="Modules">
+            <svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M5.32914 19.42C5.21914 19.42 5.09914 19.39 4.99914 19.34L2.77914 18.23C2.52914 18.1 2.36914 17.84 2.36914 17.56V14.78C2.36914 14.37 2.70914 14.03 3.11914 14.03C3.52914 14.03 3.86914 14.37 3.86914 14.78V17.09L5.67914 17.99C6.04914 18.18 6.19913 18.63 6.01913 19C5.86913 19.26 5.60914 19.42 5.32914 19.42Z" fill="#292D32"/>
+<path d="M11.9995 22.75C11.9395 22.75 11.8795 22.74 11.8295 22.73C11.7695 22.72 11.7095 22.69 11.6495 22.66L9.43948 21.56C9.06948 21.37 8.91947 20.92 9.09947 20.55C9.28947 20.18 9.73947 20.03 10.1095 20.21L11.2495 20.78V19.22C11.2495 18.81 11.5895 18.47 11.9995 18.47C12.4095 18.47 12.7495 18.81 12.7495 19.22V20.78L13.8895 20.21C14.2595 20.03 14.7095 20.18 14.8995 20.55C15.0895 20.92 14.9395 21.37 14.5595 21.56L12.3495 22.66C12.2895 22.69 12.2295 22.71 12.1695 22.73C12.1095 22.74 12.0595 22.75 11.9995 22.75Z" fill="#292D32"/>
+<path opacity="0.4" d="M18.6702 19.42C18.4002 19.42 18.1302 19.27 18.0002 19.01C17.8102 18.64 17.9602 18.19 18.3402 18L20.1502 17.1001V14.79C20.1502 14.38 20.4902 14.04 20.9002 14.04C21.3102 14.04 21.6502 14.38 21.6502 14.79V17.5701C21.6502 17.8501 21.4902 18.1101 21.2402 18.2401L19.0202 19.3501C18.8902 19.3901 18.7802 19.42 18.6702 19.42Z" fill="#292D32"/>
+<path d="M11.9995 14.42C11.5895 14.42 11.2495 14.08 11.2495 13.67V11.36L9.43948 10.4601C9.06948 10.2701 8.91947 9.82004 9.09947 9.45004C9.28947 9.08004 9.73947 8.93005 10.1095 9.11005L11.9995 10.05L13.8895 9.11005C14.2595 8.93005 14.7095 9.07004 14.8995 9.45004C15.0895 9.82004 14.9395 10.2701 14.5595 10.4601L12.7495 11.36V13.67C12.7495 14.08 12.4095 14.42 11.9995 14.42Z" fill="#292D32"/>
+<path opacity="0.4" d="M3.10938 9.96988C2.69938 9.96988 2.35938 9.62988 2.35938 9.21988V6.45988V6.44987C2.35938 6.38987 2.36937 6.32987 2.37937 6.27987C2.39937 6.19987 2.42938 6.12987 2.46938 6.05987C2.49938 6.00987 2.52937 5.96987 2.56937 5.92987C2.60937 5.88987 2.65937 5.84988 2.70937 5.81988C2.72937 5.80988 2.75937 5.78987 2.77937 5.77987L4.98937 4.67987C5.35937 4.49987 5.80937 4.63988 5.99937 5.01988C6.18937 5.38988 6.03938 5.83987 5.65938 6.02987L4.77937 6.46988L5.65938 6.90988C6.02938 7.09988 6.17937 7.54987 5.99937 7.91987C5.81937 8.28987 5.35937 8.43987 4.98937 8.25987L3.84937 7.68988V9.24987C3.85937 9.63987 3.52937 9.96988 3.10938 9.96988Z" fill="#292D32"/>
+<path d="M14.2198 3.86004C14.1098 3.86004 13.9898 3.83004 13.8898 3.78004L11.9998 2.84004L10.1098 3.78004C9.73979 3.97004 9.28979 3.82004 9.09979 3.44004C8.90979 3.07004 9.05979 2.62003 9.43979 2.43003L11.6598 1.32005C11.8698 1.21005 12.1198 1.21005 12.3298 1.32005L14.5498 2.43003C14.9198 2.62003 15.0698 3.07004 14.8898 3.44004C14.7598 3.71004 14.4998 3.86004 14.2198 3.86004Z" fill="#292D32"/>
+<path opacity="0.4" d="M20.8904 9.97002C20.4804 9.97002 20.1404 9.63001 20.1404 9.22002V7.66002L19.0004 8.23001C18.6304 8.42001 18.1804 8.27001 17.9904 7.89001C17.8004 7.52001 17.9504 7.07002 18.3304 6.88002L19.2104 6.44002L18.3304 6.00001C17.9604 5.81001 17.8104 5.36002 17.9904 4.99002C18.1704 4.62002 18.6304 4.47001 19.0004 4.65001L21.2104 5.75001C21.2304 5.76001 21.2604 5.77001 21.2804 5.79001C21.3404 5.82001 21.3904 5.87001 21.4404 5.92001C21.4704 5.96001 21.5004 6.00001 21.5304 6.04001C21.5704 6.11001 21.6004 6.18001 21.6204 6.26001C21.6304 6.32001 21.6404 6.38001 21.6404 6.43001V6.44002V9.20001C21.6404 9.64001 21.3004 9.97002 20.8904 9.97002Z" fill="#292D32"/>
 </svg>
 
-    </IconButton>
-    <IconButton href="/exemple/{$page.params.project_normalized_name}/actions" variant="secondary">
-    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.99057 22.7499C9.79057 22.7499 9.63057 22.7099 9.51057 22.6599C9.11057 22.5099 8.43057 22.0199 8.43057 20.4699V14.0199H6.09057C4.75057 14.0199 4.27057 13.3899 4.10057 13.0199C3.93057 12.6399 3.78057 11.8699 4.66057 10.8599L12.2306 2.25988C13.2506 1.09988 14.0806 1.17988 14.4806 1.32988C14.8806 1.47988 15.5606 1.96988 15.5606 3.51988V9.96988H17.9006C19.2406 9.96988 19.7206 10.5999 19.8906 10.9699C20.0606 11.3499 20.2106 12.1199 19.3306 13.1299L11.7606 21.7299C11.0506 22.5399 10.4306 22.7499 9.99057 22.7499ZM13.9306 2.73988C13.9006 2.77988 13.6906 2.87988 13.3606 3.25988L5.79057 11.8599C5.51057 12.1799 5.47057 12.3799 5.47057 12.4199C5.49057 12.4299 5.67057 12.5299 6.09057 12.5299H9.18057C9.59057 12.5299 9.93057 12.8699 9.93057 13.2799V20.4799C9.93057 20.9799 10.0206 21.1999 10.0606 21.2599C10.0906 21.2199 10.3006 21.1199 10.6306 20.7399L18.2006 12.1399C18.4806 11.8199 18.5206 11.6199 18.5206 11.5799C18.5006 11.5699 18.3206 11.4699 17.9006 11.4699H14.8106C14.4006 11.4699 14.0606 11.1299 14.0606 10.7199V3.51988C14.0706 3.01988 13.9706 2.80988 13.9306 2.73988Z" fill="#292D32"/>
+        </NavbarBtn>
+        <NavbarBtn text="Entités" href="{$targetProjectHref}/entities">
+            <svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 8H4C2.9 8 2 7.1 2 6V4C2 2.9 2.9 2 4 2H7C8.1 2 9 2.9 9 4V6C9 7.1 8.1 8 7 8Z" fill="#292D32"/>
+<path d="M20.8 7H17.2C16.54 7 16 6.45999 16 5.79999V4.20001C16 3.54001 16.54 3 17.2 3H20.8C21.46 3 22 3.54001 22 4.20001V5.79999C22 6.45999 21.46 7 20.8 7Z" fill="#292D32"/>
+<path d="M20.8 14.5H17.2C16.54 14.5 16 13.96 16 13.3V11.7C16 11.04 16.54 10.5 17.2 10.5H20.8C21.46 10.5 22 11.04 22 11.7V13.3C22 13.96 21.46 14.5 20.8 14.5Z" fill="#292D32"/>
+<path opacity="0.37" d="M16 13.25C16.41 13.25 16.75 12.91 16.75 12.5C16.75 12.09 16.41 11.75 16 11.75H13.25V5.75H16C16.41 5.75 16.75 5.41 16.75 5C16.75 4.59 16.41 4.25 16 4.25H9C8.59 4.25 8.25 4.59 8.25 5C8.25 5.41 8.59 5.75 9 5.75H11.75V18C11.75 19.52 12.98 20.75 14.5 20.75H16C16.41 20.75 16.75 20.41 16.75 20C16.75 19.59 16.41 19.25 16 19.25H14.5C13.81 19.25 13.25 18.69 13.25 18V13.25H16Z" fill="#292D32"/>
+<path d="M20.8 22H17.2C16.54 22 16 21.46 16 20.8V19.2C16 18.54 16.54 18 17.2 18H20.8C21.46 18 22 18.54 22 19.2V20.8C22 21.46 21.46 22 20.8 22Z" fill="#292D32"/>
 </svg>
 
+        </NavbarBtn>
+        <NavbarBtn href="{$targetProjectHref}/navigation" text="Navigation">
+            <svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M22 7.81V16.19C22 19.83 19.83 22 16.19 22H9V2H16.19C19.83 2 22 4.17 22 7.81Z" fill="#292D32"/>
+<path d="M9 2V22H7.81C4.17 22 2 19.83 2 16.19V7.81C2 4.17 4.17 2 7.81 2H9Z" fill="#292D32"/>
+</svg>
 
-    </IconButton>
-	{#each $entities as entity}
-		<EntityButton
-			id={entity.id}
-			href="/exemple/{$page.params.project_normalized_name}/{entity.slug}"
-			variant={entity.slug === $page.params.entity_slug ? 'secondary' : 'ghost'}
-		></EntityButton>
-	{/each}
-</div>
+        </NavbarBtn>
+        <NavbarBtn text="Accueil"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M20.0402 6.81994L14.2802 2.78994C12.7102 1.68994 10.3002 1.74994 8.79023 2.91994L3.78023 6.82994C2.78023 7.60994 1.99023 9.20994 1.99023 10.4699V17.3699C1.99023 19.9199 4.06023 21.9999 6.61023 21.9999H17.3902C19.9402 21.9999 22.0102 19.9299 22.0102 17.3799V10.5999C22.0102 9.24994 21.1402 7.58994 20.0402 6.81994Z" fill="#292D32"/>
+<path d="M12 18.75C11.59 18.75 11.25 18.41 11.25 18V15C11.25 14.59 11.59 14.25 12 14.25C12.41 14.25 12.75 14.59 12.75 15V18C12.75 18.41 12.41 18.75 12 18.75Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Constantes"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M16.19 2H7.81C4.17 2 2 4.17 2 7.81V16.18C2 19.83 4.17 22 7.81 22H16.18C19.82 22 21.99 19.83 21.99 16.19V7.81C22 4.17 19.83 2 16.19 2Z" fill="#292D32"/>
+<path d="M12.2003 17.6598C11.5003 17.6598 10.7903 17.3898 10.2603 16.8598C9.19031 15.7898 9.19031 14.0398 10.2603 12.9698L11.6703 11.5598C11.9603 11.2698 12.4403 11.2698 12.7303 11.5598C13.0203 11.8498 13.0203 12.3298 12.7303 12.6198L11.3203 14.0298C10.8303 14.5198 10.8303 15.3098 11.3203 15.7998C11.8103 16.2898 12.6003 16.2898 13.0903 15.7998L15.3103 13.5798C15.9203 12.9698 16.2603 12.1498 16.2603 11.2798C16.2603 10.4098 15.9203 9.59978 15.3103 8.97978C14.0803 7.74978 11.9403 7.74978 10.7103 8.97978L8.29031 11.3998C7.25031 12.4398 7.25031 14.1398 8.29031 15.1898C8.58031 15.4798 8.58031 15.9598 8.29031 16.2498C8.00031 16.5398 7.52031 16.5398 7.23031 16.2498C5.60031 14.6198 5.60031 11.9698 7.23031 10.3398L9.65031 7.91979C10.5503 7.01979 11.7403 6.52979 13.0103 6.52979C14.2803 6.52979 15.4703 7.01979 16.3703 7.91979C17.2703 8.81979 17.7603 10.0098 17.7603 11.2798C17.7603 12.5498 17.2703 13.7398 16.3703 14.6398L14.1503 16.8598C13.6103 17.3898 12.9103 17.6598 12.2003 17.6598Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Intégrations"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M19.2007 14.7799C18.3407 15.5699 17.2007 16.0099 16.0307 15.9999H6.3707C2.3007 15.7099 2.2907 9.79993 6.3707 9.50993H6.41071C3.62071 1.74993 15.4107 -1.34009 16.7607 6.79991C20.5307 7.27991 22.0607 12.2899 19.2007 14.7799Z" fill="#292D32"/>
+<path d="M18.75 21C18.75 21.41 18.41 21.75 18 21.75H14C13.95 21.75 13.91 21.75 13.86 21.73C13.57 22.47 12.84 23 12 23C11.16 23 10.43 22.47 10.14 21.73C10.09 21.75 10.05 21.75 10 21.75H6C5.59 21.75 5.25 21.41 5.25 21C5.25 20.59 5.59 20.25 6 20.25H10C10.05 20.25 10.09 20.25 10.14 20.27C10.34 19.75 10.75 19.34 11.27 19.14C11.25 19.09 11.25 19.05 11.25 19V16H12.75V19C12.75 19.05 12.75 19.09 12.73 19.14C13.25 19.34 13.66 19.75 13.86 20.27C13.91 20.25 13.95 20.25 14 20.25H18C18.41 20.25 18.75 20.59 18.75 21Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Templates Pdf"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M20.5 10.19H17.61C15.24 10.19 13.31 8.26 13.31 5.89V3C13.31 2.45 12.86 2 12.31 2H8.07C4.99 2 2.5 4 2.5 7.57V16.43C2.5 20 4.99 22 8.07 22H15.93C19.01 22 21.5 20 21.5 16.43V11.19C21.5 10.64 21.05 10.19 20.5 10.19Z" fill="#292D32"/>
+<path d="M15.7997 2.20999C15.3897 1.79999 14.6797 2.07999 14.6797 2.64999V6.13999C14.6797 7.59999 15.9197 8.80999 17.4297 8.80999C18.3797 8.81999 19.6997 8.81999 20.8297 8.81999C21.3997 8.81999 21.6997 8.14999 21.2997 7.74999C19.8597 6.29999 17.2797 3.68999 15.7997 2.20999Z" fill="#292D32"/>
+<path d="M13.5 13.75H7.5C7.09 13.75 6.75 13.41 6.75 13C6.75 12.59 7.09 12.25 7.5 12.25H13.5C13.91 12.25 14.25 12.59 14.25 13C14.25 13.41 13.91 13.75 13.5 13.75Z" fill="#292D32"/>
+<path d="M11.5 17.75H7.5C7.09 17.75 6.75 17.41 6.75 17C6.75 16.59 7.09 16.25 7.5 16.25H11.5C11.91 16.25 12.25 16.59 12.25 17C12.25 17.41 11.91 17.75 11.5 17.75Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Templates email"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 13C3.24 13 1 15.23 1 18C1 20.77 3.24 23 6 23C8.76 23 11 20.76 11 18C11 15.24 8.77 13 6 13ZM3.95999 15.96H6C6.38 15.96 6.67999 16.27 6.67999 16.64C6.67999 17.01 6.37 17.32 6 17.32H3.95999C3.57999 17.32 3.28 17.01 3.28 16.64C3.28 16.27 3.57999 15.96 3.95999 15.96ZM8.04001 20.04H3.95001C3.57001 20.04 3.26999 19.73 3.26999 19.36C3.26999 18.99 3.58001 18.68 3.95001 18.68H8.04001C8.42001 18.68 8.72 18.99 8.72 19.36C8.72 19.73 8.42001 20.04 8.04001 20.04Z" fill="#292D32"/>
+<path opacity="0.4" d="M17 3H7C4 3 2 4.5 2 8V11.14C2 11.87 2.75001 12.33 3.42001 12.04C4.52001 11.56 5.76999 11.38 7.07999 11.59C9.69999 12.02 11.84 14.09 12.37 16.69C12.52 17.45 12.54 18.19 12.44 18.9C12.36 19.49 12.84 20.01 13.43 20.01H17C20 20.01 22 18.51 22 15.01V8.00999C22 4.49999 20 3 17 3Z" fill="#292D32"/>
+<path d="M12.0008 11.87C11.1608 11.87 10.3108 11.61 9.66076 11.08L6.53075 8.57997C6.21075 8.31997 6.15076 7.84997 6.41076 7.52997C6.67076 7.20997 7.14075 7.14997 7.46075 7.40997L10.5908 9.90997C11.3508 10.52 12.6407 10.52 13.4007 9.90997L16.5308 7.40997C16.8508 7.14997 17.3307 7.19997 17.5807 7.52997C17.8407 7.84997 17.7907 8.32997 17.4607 8.57997L14.3307 11.08C13.6907 11.61 12.8408 11.87 12.0008 11.87Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Automatisation"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M5.75 16.1098V7.89977C7.04 7.56977 8 6.39977 8 5.00977C8 3.34977 6.66 2.00977 5 2.00977C3.34 2.00977 2 3.34977 2 5.00977C2 6.40977 2.96 7.56977 4.25 7.89977V16.1098C2.96 16.4398 2 17.6098 2 18.9998C2 20.6598 3.34 21.9998 5 21.9998C6.66 21.9998 8 20.6598 8 18.9998C8 17.5998 7.04 16.4398 5.75 16.1098Z" fill="#292D32"/>
+<path d="M19.75 16.1102V6.50017C19.75 4.98018 18.52 3.75017 17 3.75017H14.07L15.48 2.58018C15.8 2.31018 15.84 1.84018 15.58 1.52018C15.31 1.20018 14.84 1.16017 14.52 1.42017L11.52 3.92017C11.35 4.06017 11.25 4.27017 11.25 4.50017C11.25 4.73017 11.35 4.93018 11.52 5.08018L14.52 7.58018C14.66 7.70018 14.83 7.75017 15 7.75017C15.21 7.75017 15.43 7.66017 15.58 7.48017C15.85 7.16017 15.8 6.69017 15.48 6.42017L14.07 5.25017H17C17.69 5.25017 18.25 5.81017 18.25 6.50017V16.1102C16.96 16.4402 16 17.6102 16 19.0002C16 20.6602 17.34 22.0002 19 22.0002C20.66 22.0002 22 20.6602 22 19.0002C22 17.6002 21.04 16.4402 19.75 16.1102Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Roles"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M10.9608 2.10989L5.46078 4.16989C4.41078 4.56989 3.55078 5.80989 3.55078 6.93989V15.0399C3.55078 15.8499 4.08078 16.9199 4.73078 17.3999L10.2308 21.5099C11.2008 22.2399 12.7908 22.2399 13.7608 21.5099L19.2608 17.3999C19.9108 16.9099 20.4408 15.8499 20.4408 15.0399V6.93989C20.4408 5.81989 19.5808 4.56988 18.5308 4.17988L13.0308 2.11989C12.4708 1.89989 11.5308 1.89989 10.9608 2.10989Z" fill="#292D32"/>
+<path d="M14.5 10.5C14.5 9.12 13.38 8 12 8C10.62 8 9.5 9.12 9.5 10.5C9.5 11.62 10.24 12.55 11.25 12.87V15.5C11.25 15.91 11.59 16.25 12 16.25C12.41 16.25 12.75 15.91 12.75 15.5V12.87C13.76 12.55 14.5 11.62 14.5 10.5Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+        <NavbarBtn text="Logs"><svg slot="endContent" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M16.19 2H7.81C4.17 2 2 4.17 2 7.81V16.18C2 19.83 4.17 22 7.81 22H16.18C19.82 22 21.99 19.83 21.99 16.19V7.81C22 4.17 19.83 2 16.19 2Z" fill="#292D32"/>
+<path d="M6.89088 15.75C6.61088 15.75 6.35088 15.6 6.22088 15.34C6.03088 14.97 6.18088 14.52 6.56088 14.33C7.43088 13.9 8.17088 13.24 8.70088 12.44C8.88088 12.17 8.88088 11.83 8.70088 11.56C8.16088 10.76 7.42088 10.1 6.56088 9.67002C6.18088 9.49002 6.03088 9.04002 6.22088 8.66002C6.40088 8.29002 6.85088 8.14002 7.22088 8.33002C8.32088 8.88002 9.26088 9.71002 9.94088 10.73C10.4509 11.5 10.4509 12.5 9.94088 13.27C9.26088 14.29 8.32088 15.12 7.22088 15.67C7.12088 15.72 7.00088 15.75 6.89088 15.75Z" fill="#292D32"/>
+<path d="M17 15.75H13C12.59 15.75 12.25 15.41 12.25 15C12.25 14.59 12.59 14.25 13 14.25H17C17.41 14.25 17.75 14.59 17.75 15C17.75 15.41 17.41 15.75 17 15.75Z" fill="#292D32"/>
+</svg>
+</NavbarBtn>
+    </div>
+</Navbar>
 {#if loading}
 	<div class="loader">
 		<RotativeLoader></RotativeLoader>
@@ -97,6 +163,12 @@
 {/if}
 
 <style>
+    .loader {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 60px var(--pad-m);
+    }
 	.entities {
 		width: 100%;
 		height: 40px;
@@ -108,7 +180,8 @@
 		padding: var(--pad-s);
 		border-bottom: 1px solid var(--stroke);
 		overflow-x: auto;
-        flex-shrink: 0;
-        background-color: var(--bg-1);
+		flex-shrink: 0;
+		background-color: var(--bg-1);
+		z-index: 20;
 	}
 </style>

package/src/routes/exemple/[project_normalized_name]/[entity_slug]/+page.svelte

@@ -2,11 +2,11 @@
 	import { beforeNavigate, goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { entityRegistry } from '$lib/registry/entityRegistry/registry.svelte';
-	import ViewEntriesProfilComponent from '$lib/registry/viewEntriesProfilRegistery/components/ViewEntriesProfilComponent.svelte';
-	import ViewEntriesProfilDropdown from '$lib/registry/viewEntriesProfilRegistery/components/ViewEntriesProfilDropdown.svelte';
-	import { createViewEntriesProfil } from '$lib/registry/viewEntriesProfilRegistery/createViewEntriesProfil';
-	import { registerDefaultViewProfil } from '$lib/registry/viewEntriesProfilRegistery/registerDefaultViewEntriesProfils';
-	import { viewEntriesProfilRegistry } from '$lib/registry/viewEntriesProfilRegistery/registry.svelte';
+	import ViewEntriesProfilComponent from '$lib/registry/viewEntriesProfilRegistry/components/ViewEntriesProfilComponent.svelte';
+	import ViewEntriesProfilDropdown from '$lib/registry/viewEntriesProfilRegistry/components/ViewEntriesProfilDropdown.svelte';
+	import { createViewEntriesProfil } from '$lib/registry/viewEntriesProfilRegistry/createViewEntriesProfil';
+	import { registerDefaultViewProfil } from '$lib/registry/viewEntriesProfilRegistry/registerDefaultViewEntriesProfils';
+	import { viewEntriesProfilRegistry } from '$lib/registry/viewEntriesProfilRegistry/registry.svelte';
 	import ViewEntriesTypeDropdown from '$lib/registry/viewEntriesTypeRegistry/components/ViewEntriesTypeDropdown.svelte';
 	import { Button, DropdownMenu, IconButton, sendRequest } from 'hamzus-ui';
 	import { onMount } from 'svelte';
@@ -38,8 +38,6 @@
 		let defaultView = 0;
 
 		for (const viewProfil of request.data) {
-			console.log(viewProfil);
-
 			if (viewProfil.is_default) {
 				defaultView = viewProfil.id;
 			}
@@ -84,6 +82,8 @@
 				name
 			}
 		});
+
+        loadAllViewEntriesProfil()
 	}
 	async function handleDesableDefault() {
 		const request = await sendRequest({

package/src/routes/exemple/[project_normalized_name]/entities/+page.svelte

@@ -2,69 +2,138 @@
 	import { page } from '$app/stores';
 	import Nothing from '$lib/components/Nothing.svelte';
 	import EntityCard from '$lib/registry/entityRegistry/components/EntityCard.svelte';
+	import EntityRow from '$lib/registry/entityRegistry/components/EntityRow.svelte';
 	import { entityRegistry } from '$lib/registry/entityRegistry/registry.svelte';
-	import { Button } from 'hamzus-ui';
+	import { Button, Input } from 'hamzus-ui';
 
-	const entities = entityRegistry.getAll();
+    const allEntities = entityRegistry.getAll()
+
+    let search = $state("")
+
+	const entities = $derived.by(()=>{
+        if (!search) {
+            return $allEntities;
+        }
+
+        let finalEntities = []
+        for (const entity of $allEntities) {
+            console.log(entity);
+            
+            if (entity.plural_name.includes(search)) {
+                finalEntities.push(entity)
+                continue;
+            }
+            if (entity.singular_name.includes(search)) {
+                finalEntities.push(entity)
+                continue;
+            }
+            if (entity.slug.includes(search)) {
+                finalEntities.push(entity)
+                continue;
+            }
+            if (entity.normalized_name.includes(search)) {
+                finalEntities.push(entity)
+                continue;
+            }
+        }
+
+        return finalEntities
+    });
 </script>
-<div class="title">
-    <h3>Entités</h3>
-    <Button href="/exemple/{$page.params.project_normalized_name}/entities/create">
-        <h5>créer</h5>
-    </Button>
-</div>
-{#if $entities.length <= 0}
-	<Nothing title="Aucune entité" description="Il n y a aucune entité actuellement !">
-		<svg
-			slot="top"
-			width="24"
-			height="24"
-			viewBox="0 0 24 24"
-			fill="none"
-			xmlns="http://www.w3.org/2000/svg"
-		>
-			<path
-				d="M7 8H4C2.9 8 2 7.1 2 6V4C2 2.9 2.9 2 4 2H7C8.1 2 9 2.9 9 4V6C9 7.1 8.1 8 7 8Z"
-				fill="#292D32"
-			/>
-			<path
-				d="M20.8 7H17.2C16.54 7 16 6.45999 16 5.79999V4.20001C16 3.54001 16.54 3 17.2 3H20.8C21.46 3 22 3.54001 22 4.20001V5.79999C22 6.45999 21.46 7 20.8 7Z"
-				fill="#292D32"
-			/>
-			<path
-				d="M20.8 14.5H17.2C16.54 14.5 16 13.96 16 13.3V11.7C16 11.04 16.54 10.5 17.2 10.5H20.8C21.46 10.5 22 11.04 22 11.7V13.3C22 13.96 21.46 14.5 20.8 14.5Z"
-				fill="#292D32"
-			/>
-			<path
-				opacity="0.37"
-				d="M16 13.25C16.41 13.25 16.75 12.91 16.75 12.5C16.75 12.09 16.41 11.75 16 11.75H13.25V5.75H16C16.41 5.75 16.75 5.41 16.75 5C16.75 4.59 16.41 4.25 16 4.25H9C8.59 4.25 8.25 4.59 8.25 5C8.25 5.41 8.59 5.75 9 5.75H11.75V18C11.75 19.52 12.98 20.75 14.5 20.75H16C16.41 20.75 16.75 20.41 16.75 20C16.75 19.59 16.41 19.25 16 19.25H14.5C13.81 19.25 13.25 18.69 13.25 18V13.25H16Z"
-				fill="#292D32"
-			/>
-			<path
-				d="M20.8 22H17.2C16.54 22 16 21.46 16 20.8V19.2C16 18.54 16.54 18 17.2 18H20.8C21.46 18 22 18.54 22 19.2V20.8C22 21.46 21.46 22 20.8 22Z"
-				fill="#292D32"
-			/>
-		</svg>
-	</Nothing>
-{:else}
-	<div class="entities">
-		{#each $entities as entity}
-			<EntityCard variant="secondary" style="width:100%;" id={entity.id}></EntityCard>
-		{/each}
+
+<div class="container">
+	<div class="title">
+		<h3>Entités</h3>
 	</div>
-{/if}
+    <div class="search">
+        <Input bind:value={search} placeholder="recherche">
+        </Input>
+        <Button href="/exemple/{$page.params.project_normalized_name}/entities/create" style="padding:var(--pad-s) var(--pad-xl) var(--pad-s) var(--pad-s)">
+        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 12.75H6C5.59 12.75 5.25 12.41 5.25 12C5.25 11.59 5.59 11.25 6 11.25H18C18.41 11.25 18.75 11.59 18.75 12C18.75 12.41 18.41 12.75 18 12.75Z" fill="#292D32"/>
+<path d="M12 18.75C11.59 18.75 11.25 18.41 11.25 18V6C11.25 5.59 11.59 5.25 12 5.25C12.41 5.25 12.75 5.59 12.75 6V18C12.75 18.41 12.41 18.75 12 18.75Z" fill="#292D32"/>
+</svg>
+
+			<h5>créer</h5>
+		</Button>
+    </div>
+	{#if entities.length <= 0}
+		<Nothing title="Aucune entité" description="Il n y a aucune entité actuellement !">
+			<svg
+				slot="top"
+				width="24"
+				height="24"
+				viewBox="0 0 24 24"
+				fill="none"
+				xmlns="http://www.w3.org/2000/svg"
+			>
+				<path
+					d="M7 8H4C2.9 8 2 7.1 2 6V4C2 2.9 2.9 2 4 2H7C8.1 2 9 2.9 9 4V6C9 7.1 8.1 8 7 8Z"
+					fill="#292D32"
+				/>
+				<path
+					d="M20.8 7H17.2C16.54 7 16 6.45999 16 5.79999V4.20001C16 3.54001 16.54 3 17.2 3H20.8C21.46 3 22 3.54001 22 4.20001V5.79999C22 6.45999 21.46 7 20.8 7Z"
+					fill="#292D32"
+				/>
+				<path
+					d="M20.8 14.5H17.2C16.54 14.5 16 13.96 16 13.3V11.7C16 11.04 16.54 10.5 17.2 10.5H20.8C21.46 10.5 22 11.04 22 11.7V13.3C22 13.96 21.46 14.5 20.8 14.5Z"
+					fill="#292D32"
+				/>
+				<path
+					opacity="0.37"
+					d="M16 13.25C16.41 13.25 16.75 12.91 16.75 12.5C16.75 12.09 16.41 11.75 16 11.75H13.25V5.75H16C16.41 5.75 16.75 5.41 16.75 5C16.75 4.59 16.41 4.25 16 4.25H9C8.59 4.25 8.25 4.59 8.25 5C8.25 5.41 8.59 5.75 9 5.75H11.75V18C11.75 19.52 12.98 20.75 14.5 20.75H16C16.41 20.75 16.75 20.41 16.75 20C16.75 19.59 16.41 19.25 16 19.25H14.5C13.81 19.25 13.25 18.69 13.25 18V13.25H16Z"
+					fill="#292D32"
+				/>
+				<path
+					d="M20.8 22H17.2C16.54 22 16 21.46 16 20.8V19.2C16 18.54 16.54 18 17.2 18H20.8C21.46 18 22 18.54 22 19.2V20.8C22 21.46 21.46 22 20.8 22Z"
+					fill="#292D32"
+				/>
+			</svg>
+		</Nothing>
+	{:else}
+		<div class="entities">
+			{#each entities as entity}
+				<EntityRow style="width:100%;" id={entity.id}></EntityRow>
+			{/each}
+		</div>
+	{/if}
+</div>
 
 <style>
-    .title {
+    .container {
         display: flex;
+        flex-direction: column;
         align-items: center;
-        justify-content: space-between;
-        padding: var(--pad-m);
+        row-gap: var(--pad-xxl);
+        padding: 60px 0px;
     }
-	.entities {
+	.title {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: var(--pad-m);
+        width: min(100%, 1000px);
+	}
+    .search {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: var(--pad-m) 0;
+        width: min(100%, 1000px);
+        border-bottom: 1px solid var(--stroke);
+    }
+	/* .entities {
 		display: grid;
 		grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
 		gap: var(--pad-m);
 		padding: var(--pad-xxl);
+	} */
+
+	.entities {
+		display: flex;
+		flex-direction: column;
+		row-gap: var(--pad-m);
+		padding: var(--pad-xxl);
+		width: min(100%, 1000px);
 	}
 </style>