Files
cms-backend/Resources/Public/JavaScript/bookmark/toolbar/bookmark-menu-element.js
T

14 lines
3.5 KiB
JavaScript

/*
* This file is part of the TYPO3 CMS project.
*
* It is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License, either version 2
* of the License, or any later version.
*
* For the full copyright and license information, please read the
* LICENSE.txt file that was distributed with this source code.
*
* The TYPO3 project - inspiring people to share!
*/
import{LitElement as b,html as i,nothing as u}from"lit";import{state as h,customElement as f}from"lit/decorators.js";import{repeat as k}from"lit/directives/repeat.js";import c,{BookmarkStoreChangedEvent as g}from"@typo3/backend/bookmark/bookmark-store.js";import"@typo3/backend/element/icon-element.js";import"@typo3/backend/bookmark/bookmark-manager.js";import l from"~labels/core.bookmarks";var m=function(p,e,o,n){var a=arguments.length,t=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,s;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")t=Reflect.decorate(p,e,o,n);else for(var r=p.length-1;r>=0;r--)(s=p[r])&&(t=(a<3?s(t):a>3?s(e,o,t):s(e,o))||t);return a>3&&t&&Object.defineProperty(e,o,t),t};let d=class extends b{constructor(){super(...arguments),this.groupedBookmarks=new Map,this.groups=[],this.handleStoreUpdate=()=>{this.syncFromStore()}}connectedCallback(){super.connectedCallback(),document.addEventListener(g,this.handleStoreUpdate),this.syncFromStore()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(g,this.handleStoreUpdate)}createRenderRoot(){return this}render(){return i`<p class=dropdown-headline>${l.get("title")}</p>${this.renderContent()}<hr class=dropdown-divider aria-hidden=true><typo3-backend-bookmark-manager-button class=dropdown-item><span class=dropdown-item-columns> <span class="dropdown-item-column dropdown-item-column-icon" aria-hidden=true><typo3-backend-icon identifier=actions-cog size=small></typo3-backend-icon> </span> <span class="dropdown-item-column dropdown-item-column-title">${l.get("manage")} </span> </span></typo3-backend-bookmark-manager-button>`}async syncFromStore(){this.groupedBookmarks=await c.getGroupedBookmarks({accessibleOnly:!0}),this.groups=await c.getGroups()}renderContent(){if(this.groupedBookmarks.size===0)return i`<p class=dropdown-item-text>${l.get("description")}</p>`;let e=!0;return i`${k(Array.from(this.groupedBookmarks.entries()),([o])=>o,([o,n])=>{const a=this.renderGroup(o,n,e);return e=!1,a})}`}renderGroup(e,o,n){const t=this.groups.find(r=>r.id===e)?.label,s=t||this.groups.length>1;return i`${n?u:i`<hr class=dropdown-divider aria-hidden=true>`} ${s?i`<p class=dropdown-header id=bookmark-group-${e}>${t||l.get("notGrouped")}</p>`:u}<ul class=dropdown-list data-bookmarkgroup=${e}>${k(o,r=>r.id,r=>this.renderBookmarkItem(r,e))}</ul>`}renderBookmarkItem(e,o){return i`<li class=t3js-topbar-bookmark data-bookmarkid=${e.id} data-bookmarkgroup=${o}><button type=button class=dropdown-item title=${e.title} @click=${()=>this.handleNavigate(e)}><span class=dropdown-item-columns> <span class="dropdown-item-column dropdown-item-column-icon" aria-hidden=true><typo3-backend-icon identifier=${e.iconIdentifier} overlay=${e.iconOverlayIdentifier} size=small></typo3-backend-icon> </span> <span class="dropdown-item-column dropdown-item-column-title">${e.title} </span> </span></button></li>`}handleNavigate(e){c.navigate(e)}};m([h()],d.prototype,"groupedBookmarks",void 0),m([h()],d.prototype,"groups",void 0),d=m([f("typo3-backend-bookmark-menu")],d);export{d as BookmarkMenuElement};