https://xquare.net/_nuxt/bg3Aqkjn.js

1import{u as W,_ as Z}from"./Dg0C84su.js";import{d as q,u as G,a5 as H,o as Q,c as n,e as t,n as w,h as o,k as F,R as X,t as a,s as R,v as Y,F as k,r as C,$ as ee,j as S,m as te,x as y,b as r,y as oe}from"./aDqk-s0q.js";import{u as se}from"./BkBhOcgX.js";const le={class:"space-y-6"},ae={class:"flex gap-1",role:"tablist","aria-label":"Directory view"},re=["aria-selected"],ne=["aria-selected"],ie={class:"space-y-6"},de={class:"flex items-end justify-between flex-wrap gap-3"},ue={class:"text-sm text-on-surface-variant"},ce={class:"relative w-full sm:w-72"},pe={class:"flex flex-wrap items-center gap-3"},be={class:"flex gap-1 overflow-x-auto",role:"tablist","aria-label":"Filter by role"},fe=["id","aria-selected","aria-controls","tabindex","onClick","onKeydown"],me={class:"ml-auto flex items-center gap-2 text-sm"},ve=["value"],ge={key:0,class:"rounded-xl border border-error/30 bg-error/5 p-4 text-sm text-error"},ye=["id","aria-labelledby"],xe={key:0,class:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4"},_e={key:1,class:"rounded-2xl border border-outline-variant/20 bg-surface-container-lowest p-10 text-center"},he={class:"text-sm text-on-surface-variant"},we={key:2,class:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4"},ke={class:"flex items-start gap-3"},Ce={class:"w-12 h-12 rounded-full bg-surface-container-high border-2 border-primary/20 overflow-hidden flex items-center justify-center text-primary font-bold shrink-0"},Se=["src","alt"],Te={key:1},$e={class:"min-w-0 flex-1"},Me={class:"text-sm font-bold truncate"},Fe={class:"text-xs text-outline truncate"},Be={class:"mt-1 inline-block text-[10px] font-extrabold uppercase tracking-widest px-2 py-0.5 rounded-full bg-primary/10 text-primary"},Re={class:"flex items-center gap-3 text-xs text-on-surface-variant"},ze={class:"flex items-center gap-1"},je={class:"flex items-center gap-1"},Ae={key:0,class:"ml-auto text-outline"},De=["aria-pressed","disabled","onClick"],Pe={key:3,class:"flex items-center justify-between gap-3 pt-2","aria-label":"Members pagination"},Ie=["disabled"],Ne={class:"text-sm text-on-surface-variant"},Ee=["disabled"],z=24,Ue=q({__name:"members",setup(Je){G({title:"Members · xquare hub"});const{members:B,total:T,page:b,loaded:x,loading:j,error:d,fetchMembers:A,toggleFollow:D}=W(),i=y("people"),u=y(""),c=y("all"),_=y("recent"),$=[{value:"all",label:"All members"},{value:"owner",label:"Owners"},{value:"admin",label:"Admins"},{value:"moderator",label:"Moderators"},{value:"member",label:"Members"}],{activeIdx:P,setRef:I,focusTab:N,onKey:E}=se(0);function J(l){N(l),c.value=$[l].value,p(1)}const K=[{value:"recent",label:"Most recent"},{value:"alphabetical",label:"A → Z"},{value:"role",label:"By role"}];function p(l=1){A({search:u.value.trim()||void 0,roleFilter:c.value,sortBy:_.value,page:l,pageSize:z})}const M=oe(()=>Math.max(1,Math.ceil(T.value/z)));let f=null;function L(){f&&clearTimeout(f),f=setTimeout(()=>p(1),300)}H(()=>{f&&clearTimeout(f)});const m=y(null);async function O(l){if(m.value===l.user_id)return;m.value=l.user_id;const s=l.is_following;l.is_following=!s,l.follower_count+=s?-1:1;try{const{action:v}=await D(l.user_id),e=v==="followed";l.is_following!==e&&(l.is_following=e,l.follower_count+=e?1:-1)}catch(v){l.is_following=s,l.follower_count+=s?1:-1;const e=v?.message??"";d.value=/permission denied|RLS|JWT|not authenticated|unauthorized/i.test(e)?"Sign in to follow members.":e||"Could not update follow.",setTimeout(()=>{d.value&&d.value.startsWith("Could not")&&(d.value=null)},4e3)}finally{m.value=null}}function U(l){return l?new Date(l).toLocaleDateString(void 0,{month:"short",year:"numeric"}):""}function V(l){return(l||"?").trim().charAt(0).toUpperCase()}return Q(()=>p(1)),(l,s)=>{const v=Z;return r(),n("section",le,[t("div",ae,[t("button",{type:"button",role:"tab","aria-selected":o(i)==="people",class:w(["px-3 py-1.5 rounded-lg text-sm font-semibold transition-colors",o(i)==="people"?"bg-primary text-on-primary":"text-on-surface-variant hover:bg-surface-container"]),onClick:s[0]||(s[0]=e=>i.value="people")},"People",10,re),t("button",{type:"button",role:"tab","aria-selected":o(i)==="businesses",class:w(["px-3 py-1.5 rounded-lg text-sm font-semibold transition-colors",o(i)==="businesses"?"bg-primary text-on-primary":"text-on-surface-variant hover:bg-surface-container"]),onClick:s[1]||(s[1]=e=>i.value="businesses")},"Businesses",10,ne)]),F(t("div",ie,[t("header",de,[t("div",null,[s[7

1]||(s[7]=t("h1",{class:"font-bold leading-tight",style:{"font-size":"1.875rem"}},"Community directory",-1)),t("p",ue,a(o(x)?`${o(T)} ${o(T)===1?"member":"members"}`:"Connect with members across the community."),1)]),t("label",ce,[s[8]||(s[8]=t("span",{class:"material-symbols-outlined absolute left-3 top-1/2 -translate-y-1/2 text-on-surface-variant",style:{"font-size":"1.1rem"},"aria-hidden":"true"},"search",-1)),F(t("input",{"onUpdate:modelValue":s[2]||(s[2]=e=>R(u)?u.value=e:null),type:"search",name:"member-search",autocomplete:"off",spellcheck:"false",placeholder:"Search members…",class:"w-full bg-surface-container-lowest border border-outline-variant/30 rounded-xl pl-10 pr-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary/20 placeholder:text-outline",onInput:L},null,544),[[Y,o(u)]])])]),t("div",pe,[t("div",be,[(r(),n(k,null,C($,(e,g)=>t("button",{key:e.value,ref_for:!0,ref:h=>o(I)(h,g),type:"button",role:"tab",id:`role-tab-${e.value}`,"aria-selected":o(c)===e.value,"aria-controls":`role-panel-${e.value}`,tabindex:g===o(P)?0:-1,class:w(["relative px-3 py-1.5 text-sm font-semibold whitespace-nowrap rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-primary/30",o(c)===e.value?"bg-primary/10 text-primary":"text-on-surface-variant hover:text-on-surface hover:bg-surface-container"]),onClick:h=>J(g),onKeydown:h=>o(E)(h,g,$.length)},a(e.label),43,fe)),64))]),t("div",me,[s[9]||(s[9]=t("label",{for:"sort-by",class:"text-on-surface-variant"},"Sort",-1)),F(t("select",{id:"sort-by","onUpdate:modelValue":s[3]||(s[3]=e=>R(_)?_.value=e:null),onChange:s[4]||(s[4]=e=>p(1)),class:"bg-surface-container-lowest border border-outline-variant/30 rounded-lg px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-primary/20"},[(r(),n(k,null,C(K,e=>t("option",{key:e.value,value:e.value},a(e.label),9,ve)),64))],544),[[ee,o(_)]])])]),o(d)?(r(),n("div",ge,a(o(d)),1)):S("",!0),t("section",{role:"tabpanel",id:`role-panel-${o(c)}`,"aria-labelledby":`role-tab-${o(c)}`,tabindex:"0",class:"focus:outline-none"},[o(j)&&!o(x)?(r(),n("div",xe,[(r(),n(k,null,C(8,e=>t("div",{key:e,class:"rounded-xl border border-outline-variant/20 bg-surface-container-lowest p-4 h-32 animate-pulse"})),64))])):o(x)&&!o(B).length?(r(),n("div",_e,[t("p",he,a(o(u)?`No members match “${o(u)}”.`:"No members yet on this hub."),1)])):(r(),n("ul",we,[(r(!0),n(k,null,C(o(B),e=>(r(),n("li",{key:e.user_id,class:"rounded-xl border border-outline-variant/20 bg-surface-container-lowest p-4 flex flex-col gap-3 hover:shadow-md hover:border-primary/30 transition-[box-shadow,border-color] duration-200"},[t("div",ke,[t("div",Ce,[e.avatar_url?(r(),n("img",{key:0,src:e.avatar_url,alt:e.display_name,width:"48",height:"48",loading:"lazy",decoding:"async",class:"w-full h-full object-cover"},null,8,Se)):(r(),n("span",Te,a(V(e.display_name||e.email)),1))]),t("div",$e,[t("p",Me,a(e.display_name||e.email),1),t("p",Fe,a(e.email),1),t("span",Be,a(e.top_role||"member"),1)])]),t("dl",Re,[t("div",ze,[s[10]||(s[10]=t("span",{class:"material-symbols-outlined",style:{"font-size":"1rem"},"aria-hidden":"true"},"grid_view",-1)),s[11]||(s[11]=t("dt",{class:"sr-only"},"Spaces",-1)),t("dd",null,a(e.space_count),1)]),t("div",je,[s[12]||(s[12]=t("span",{class:"material-symbols-outlined",style:{"font-size":"1rem"},"aria-hidden":"true"},"group",-1)),s[13]||(s[13]=t("dt",{class:"sr-only"},"Followers",-1)),t("dd",null,a(e.follower_count),1)]),e.joined_at?(r(),n("div",Ae,[s[14]||(s[14]=t("dt",{class:"sr-only"},"Joined",-1)),t("dd",null,"Joined "+a(U(e.joined_at)),1)])):S("",!0)]),t("button",{class:w(["mt-auto w-full px-3 py-1.5 rounded-lg text-sm font-bold transition-colors disabled:opacity-60",e.is_following?"bg-surface-container text-on-surface hover:bg-surface-container-high":"bg-primary text-on-primary hover:brightness-110"]),"aria-pressed":e.is_following,disabled:o(m)===e.user_id,onClick:g=>O(e)},a(o(m)===e.user_id?"…":e.is_following?"Following":"Follow"),11,De)]))),128))])),o(x)&&o(M)>1?(r(),n("nav",Pe,[t("button",{class:"px-3 py-1.5 rounded-lg text-sm font-semibold disabled:opacity-40 hover:bg-surface-container transition-colors",disabled:o(b)<=1,onClick:s[5

1]||(s[5]=e=>p(o(b)-1))}," ← Prev ",8,Ie),t("span",Ne,"Page "+a(o(b))+" of "+a(o(M)),1),t("button",{class:"px-3 py-1.5 rounded-lg text-sm font-semibold disabled:opacity-40 hover:bg-surface-container transition-colors",disabled:o(b)>=o(M),onClick:s[6]||(s[6]=e=>p(o(b)+1))}," Next → ",8,Ee)])):S("",!0)],8,ye)],512),[[X,o(i)==="people"]]),o(i)==="businesses"?(r(),te(v,{key:0})):S("",!0)])}}});export{Ue as default};