FEAT: hecho el arreglo de los botones y empecé con el registro de propiedades

Front/src/Componentes/NavBarAutocompletable.svelte

@@ -0,0 +1,84 @@
+<script lang="ts">
+  import { Navbar, NavbarBrand, NavbarToggler, NavItem, Nav, NavLink, Collapse } from "@sveltestrap/sveltestrap";
+  import { onMount } from "svelte";
+  import { writable } from 'svelte/store';
+  import './css/popup.css';
+  let isOpen: boolean = $state(false);
+
+  type Permiso = {
+    id: number;
+    descripcion: string;
+  };
+
+  type Grupo = {
+    id: number;
+    nombre: string;
+    idpermisos: Permiso[];
+  };
+
+  const permisos = writable<Grupo[]>([]);
+  const email = localStorage.getItem('email');
+  const token = sessionStorage.getItem('token');
+
+  async function obtenerPermisos(){
+    try {
+      const response = await fetch("http://localhost:5007/api/acciones",{
+        method: 'GET',
+        headers: {
+          'Auth' : String(token),
+          'Email' : String(email),
+          'Content-Type' : "application/json"
+        },
+      });
+      if (response.ok){
+        const json  = await response.json();
+        
+        permisos.set(json);
+      }
+    } catch (e) {
+      console.error(e);
+ 
+    }
+  }
+  
+  onMount( () => {
+     obtenerPermisos();
+  })
+
+  function redirijir(path: string){
+    location.replace(path);
+  }
+
+</script>
+
+<Navbar container="xxl" expand="md" color="dark-subtle">
+  <NavbarBrand href="/">
+    AlquilaFacil
+  </NavbarBrand>
+  <div class="badge">
+    <a href="/Menu">
+      <img src="/home.svg" alt="Volver al Menú"/>
+    </a>
+  </div>
+  <NavbarToggler on:click={() => (isOpen = !isOpen)} />
+  <Collapse isOpen={isOpen} navbar expand="md">
+    <Nav class="ms-auto" navbar>
+    {#each $permisos as item }
+      <div class="dropdown">
+        <div class="btn-group" style="margin-left: 3px; margin-top: 3px">
+          <button class="btn btn-secondary" onclick={() => redirijir("/grupo/"+item.nombre)} >{item.nombre}</button>
+          <button class="btn btn-secondary dropdown-toggle dropdown-toggle-split" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+            <span class="visually-hidden">Toggle Dropdown</span>
+          </button>
+          <ul class="dropdown-menu dropdown-menu-end"  >
+            {#each item.idpermisos as perm}
+            <li class="dropdown-item"><a class="link-underline-opacity-0 link-underline" href="/accion/{perm.id}">{perm.descripcion}</a></li>
+            <li><hr class="dropdown-divider"></li>
+            {/each}
+          </ul>
+        </div>
+      </div>
+    {/each}
+    </Nav>
+  </Collapse>
+</Navbar>