@salla.sa/twilight-components/dist/twilight/p-26bb80de.entry.js

Salla Web Component

/*!
 * Crafted with ❤ by Salla
 */
import{r as t,h as s,a as i}from"./p-BQQ2x3w_.js";import{H as n}from"./p-CHf8XdiS.js";import"./p-CgtvEd63.js";const a=class{constructor(s){t(this,s),this.itemPerPage=10,this.no_notifications_trans=salla.lang.get("blocks.header.no_notifications"),this.load_more_text_trans=salla.lang.get("common.elements.load_more"),salla.lang.onLoaded((()=>{this.no_notifications_trans=salla.lang.get("blocks.header.no_notifications"),this.load_more_text_trans=salla.lang.get("common.elements.load_more")}))}loading(t=!0){let s=this.status?.querySelector(".s-button-text");s&&(n.toggleElementClassIf(s,"s-button-hide","s-button-show",(()=>t)),this.btnLoader.style.display=t?"inherit":"none")}getNotificationCard(t){const s=document.createElement("salla-notification-item");return s.notification=t,s.classList.add("s-block"),s}render(){return this.showPlaceholder?s("div",{class:"s-notifications-no-content"},s("salla-placeholder",{alignment:"center"},s("span",{slot:"title"},this.no_notifications_trans))):s("div",{class:"s-notifications-wrapper"},s("div",{class:"s-notifications-container",ref:t=>this.wrapper=t}),this.nextPage&&s("div",{class:"s-infinite-scroll-wrapper",ref:t=>this.status=t},s("button",{onClick:()=>this.loadMore(),class:"s-infinite-scroll-btn s-button-btn s-button-primary"},s("span",{class:"s-button-text s-infinite-scroll-btn-text"},this.loadMoreText??this.load_more_text_trans),s("span",{class:"s-button-loader s-button-loader-center s-infinite-scroll-btn-loader",ref:t=>this.btnLoader=t,style:{display:"none"}}))))}handleResponse(t){return t.map((t=>this.getNotificationCard(t)))}initiateInfiniteScroll(){this.wrapper?(this.infiniteScroll=salla.infiniteScroll.initiate(this.wrapper,this.wrapper,{path:()=>this.nextPage,history:!0,nextPage:this.nextPage,scrollThreshold:!1},!0),this.infiniteScroll?.on("request",(()=>{this.loading()})),this.infiniteScroll?.on("load",(t=>{this.loading(!1),this.pagination=t.pagination,this.nextPage=t.pagination.links?.next||null,this.handleResponse(t.data).forEach((t=>this.wrapper.append(t)));let s=this.host.querySelectorAll("salla-notification-item:not(.animated)");n.animateItems(s)})),this.infiniteScroll?.on("error",(t=>{salla.logger.error("Error loading more comments:",t)}))):salla.logger.error("Wrapper is undefined. Cannot initiate infinite scroll.")}async loadInitialData(){await salla.api.notifications.fetch({per_page:this.itemPerPage}).then((t=>{this.pagination=t.pagination,this.total=t.pagination.total,this.nextPage=t.pagination.links?.next||null,setTimeout((()=>{if(!t.data.length)return this.showPlaceholder=!0;this.handleResponse(t.data).forEach((t=>this.wrapper.append(t))),this.initiateInfiniteScroll();let s=this.wrapper.querySelectorAll("salla-notification-item:not(.animated)");n.animateItems(s)}),100)})).catch((t=>{salla.logger.error(t),this.showPlaceholder=!0,this.loading(!1)}))}async loadMore(){this.infiniteScroll?.loadNextPage()}async componentWillLoad(){await this.loadInitialData()}get host(){return i(this)}};a.style="";export{a as salla_notifications}