2 lines
25 KiB
JavaScript
2 lines
25 KiB
JavaScript
import{j as e,M as ce,a as $,T as v,B as w,b as S,c as C,A as we,d as ae,L,C as B,I as q,e as Pe,f as T,P as I,g as Se,u as Fe,h as ue,i as ee,k as te,D as K,l as _,m as F,n as H,o as de,p as Ee,q as he,r as me,s as Ae,S as M,t as ke,G as y,v as se,w as De,x as Te,y as Ie,z as $e,F as Ue,E as Le,H as Oe}from"./mui-CxHUbSMi.js";import{u as ne,a as Q,b as V,c as qe,d as Me,L as k,e as Re,O as Be,f as Qe,r as W,g as z,h as N,q as G,i as re,j as R,Q as ze,k as Ne,l as We,R as Ke,m as _e}from"./tanstack-xmxrKlZO.js";import{c as He,r as j}from"./react-DXd9vB-a.js";import{i as O,B as Ve,a as Ge,b as Xe,u as E,t as p}from"./i18n-DJgSTqOl.js";(function(){const s=document.createElement("link").relList;if(s&&s.supports&&s.supports("modulepreload"))return;for(const n of document.querySelectorAll('link[rel="modulepreload"]'))r(n);new MutationObserver(n=>{for(const i of n)if(i.type==="childList")for(const a of i.addedNodes)a.tagName==="LINK"&&a.rel==="modulepreload"&&r(a)}).observe(document,{childList:!0,subtree:!0});function o(n){const i={};return n.integrity&&(i.integrity=n.integrity),n.referrerPolicy&&(i.referrerPolicy=n.referrerPolicy),n.crossOrigin==="use-credentials"?i.credentials="include":n.crossOrigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function r(n){if(n.ep)return;n.ep=!0;const i=o(n);fetch(n.href,i)}})();var Y={},oe=He;Y.createRoot=oe.createRoot,Y.hydrateRoot=oe.hydrateRoot;const J=15,Ze=3,P="https://khofmann.userpage.fu-berlin.de/phpCourse/exam/api/";let ie;class Je{constructor(){if(this.userListeners=[],this.hasAuth=()=>this.token!==void 0,this.isAdmin=()=>{var s;return this.hasAuth()&&((s=this.self)==null?void 0:s.isAdmin)},this.getAuthenticatedUser=()=>this.self,this.getCurrentSession=()=>[this.token,this.refreshToken],this.subscribeToAuthenticatedUser=s=>(this.userListeners.push(s),()=>{this.userListeners=this.userListeners.filter(o=>o!==s)}),this.logIn=async(s,o)=>{const{user:r,token:n}=await(await this.post("login",{email:s,password:o})).json();this.self=r,this.token=n,this.userListeners.forEach(i=>i(r))},this.logOut=async()=>{try{return await(await this.postAuth("logout")).json()}catch{return!1}finally{this.self=void 0,this.token=void 0,this.userListeners.forEach(s=>s())}},this.posts=async s=>{const o=`posts?p=${s??0}&l=${J}`;return this.token?await(await this.getAuth(o)).json():await(await this.get(o)).json()},this.deletePost=async s=>await(await this.delete(`posts/${s}?l=${J}`)).json(),this.user=async s=>{var o;return await(await this.getAuth(`users/${s??((o=this.self)==null?void 0:o.id)}`)).json()},this.updateUser=async(s,o)=>{const r=await(await this.patch(`users/${o??"self"}`,s)).json();return this.self=r,this.userListeners.forEach(n=>n(r)),r},this.updateUserImage=async(s,o)=>{const r=new FormData;s.image&&r.append("image",s.image),!s.image&&s.predefined&&r.append("predefined",s.predefined);const n=await(await this.postAuthRaw(`users/${o??"self"}/image`,r)).json();return this.self=n,this.userListeners.forEach(i=>i(n)),n},this.newPost=async s=>await(await this.postAuth(`posts?l=${J}`,{...s})).json(),this.updatePost=async(s,o)=>await(await this.patch(`posts/${o}`,s)).json(),this.userPosts=async s=>await(await this.getAuth(`users/${s}/posts?l=${Ze}&s=desc`)).json(),this.post=async(s,o,r)=>{const n=await fetch(`${P}${s}`,{mode:"cors",method:"post",headers:r,body:JSON.stringify(o)});if(n.ok)return n;throw await n.json()},this.postAuth=async(s,o,r)=>{const n=await fetch(`${P}${s}`,{mode:"cors",method:"post",headers:{token:this.token??"",...r},body:JSON.stringify(o)});if(n.ok)return n;throw await n.json()},this.postAuthRaw=async(s,o,r)=>{const n=await fetch(`${P}${s}`,{mode:"cors",method:"post",headers:{token:this.token??"",...r},body:o});if(n.ok)return n;throw await n.json()},this.get=async(s,o)=>{const r=await fetch(`${P}${s}`,{mode:"cors",method:"get",headers:o});if(r.ok)return r;throw await r.json()},this.getAuth=async(s,o)=>{const r=await fetch(`${P}${s}`,{mode:"cors",method:"get",headers:{token:this.token??"",...o}});if(r.ok)return r;throw await r.json()},this.delete=async(s,o)=>{const r=await fetch(`${P}${s}`,{mode:"cors",method:"delete",headers:{token:this.token??"",...o}});if(r.ok)return r;throw await r.json()},this.patch=async(s,o,r)=>{const n=await fetch(`${P}${s}`,{mode:"cors",method:"patch",headers:{token:this.token??"",...r},body:JSON.stringify(o)});if(n.ok)return n;throw await n.json()},ie)throw new Error("New instance cannot be created!!");ie=this}}const h=new Je;var D=(t=>(t.NOT_FOUND="NotFound",t.UNAUTHORIZED="Unauthorized",t.FAILED_UPDATE="FailedUpdate",t.MISSING_FIELD="MissingField",t))(D||{});O.use(Ve).use(Ge).use(Xe).init({fallbackLng:"en",debug:!1,interpolation:{escapeValue:!1},backend:{loadPath:"/phpCourse/exam/dist/locales/{{lng}}/{{ns}}.json"}});const Ye=({anchorEl:t,handleClose:s})=>e.jsxs(ce,{anchorEl:t,anchorOrigin:{vertical:"bottom",horizontal:"right"},keepMounted:!0,transformOrigin:{vertical:"top",horizontal:"right"},open:!!t,onClose:s,sx:{"& .MuiMenu-paper":{minWidth:"240px"}},children:[e.jsx($,{selected:O.language==="en",onClick:()=>{O.changeLanguage("en"),s()},children:"English"},"de"),e.jsx($,{selected:O.language==="de",onClick:()=>{O.changeLanguage("de"),s()},children:"Deutsch"},"en")]});var b=(t=>(t.INDEX="/",t.PROFILE="/profile",t))(b||{});const U=({error:t,context:s,color:o="error.main"})=>{const{t:r}=E();if(console.log(t,s),!t)return null;if(t.code)switch(t.code){case D.NOT_FOUND:return e.jsx(v,{color:o,children:r(t.code,{context:`${t.entity}:${s}`})});case D.UNAUTHORIZED:return e.jsx(v,{color:o,children:r(t.code,{context:s})});case D.FAILED_UPDATE:return t.fields.map((n,i)=>e.jsx(v,{color:o,children:r(t.code,{context:`${t.reasons[i]}:${n}:${s}`})},`error_${n}`));case D.MISSING_FIELD:return t.fields.map(n=>e.jsx(v,{color:o,children:r(t.code,{context:`${n}:${s}`})},`error_${n}`))}return e.jsx(v,{color:o,children:r((t==null?void 0:t.message)??"Unknown",{context:s})})},et=({handleClose:t})=>{const[s,o]=j.useState(),{t:r}=E(),n=ne(),i=Q({defaultValues:{email:"",password:""},onSubmit:async({value:a})=>{try{await h.logIn(a.email,a.password),n.invalidate(),t()}catch(m){o(m)}}});return e.jsx("form",{onSubmit:a=>{a.preventDefault(),a.stopPropagation(),i.handleSubmit()},onKeyDown:a=>{a.key==="Tab"&&a.stopPropagation()},noValidate:!0,children:e.jsxs(w,{sx:{display:"grid",gap:2,padding:1},children:[e.jsx(i.Field,{name:"email",validators:{onChange:({value:a})=>a?void 0:r("Email required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:a})=>!a&&r("Email required")},children:a=>e.jsx(e.Fragment,{children:e.jsx(S,{variant:"outlined",name:a.name,value:a.state.value,onBlur:a.handleBlur,onChange:m=>a.handleChange(m.target.value),size:"small",label:r("Email"),required:!0,error:a.state.meta.isTouched&&a.state.meta.errors.length>0,helperText:a.state.meta.isTouched?a.state.meta.errors.join(","):"",type:"email",autoComplete:"username",inputMode:"email",fullWidth:!0})})}),e.jsx(i.Field,{name:"password",validators:{onChange:({value:a})=>a?void 0:r("Password required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:a})=>!a&&r("Password required")},children:a=>e.jsx(e.Fragment,{children:e.jsx(S,{variant:"outlined",name:a.name,value:a.state.value,onBlur:a.handleBlur,onChange:m=>a.handleChange(m.target.value),size:"small",label:r("Password"),required:!0,error:a.state.meta.isTouched&&a.state.meta.errors.length>0,helperText:a.state.meta.isTouched?a.state.meta.errors.join(","):"",type:"password",autoComplete:"password",fullWidth:!0})})}),e.jsx(i.Subscribe,{selector:a=>[a.canSubmit,a.isSubmitting],children:([a])=>e.jsx(e.Fragment,{children:e.jsx(C,{type:"submit",disabled:!a,variant:"contained",children:r("Log in")})})}),s&&e.jsx(U,{error:s,context:"login"})]})})},tt=({anchorEl:t,handleClose:s})=>{const o=V(),r=ne(),n=qe({from:"/profile/",strict:!0,shouldThrow:!1}),i=h.getAuthenticatedUser();return e.jsx(ce,{anchorEl:t,anchorOrigin:{vertical:"bottom",horizontal:"right"},keepMounted:!0,transformOrigin:{vertical:"top",horizontal:"right"},open:!!t,onClose:s,sx:{"& .MuiMenu-paper":{minWidth:"240px"}},children:i?[e.jsx($,{selected:!!n,onClick:()=>{o({to:b.PROFILE}),s()},children:p("Profile")},"profile"),e.jsx($,{onClick:async()=>{await h.logOut(),r.invalidate(),s()},children:p("Log out")},"logout")]:e.jsx(et,{handleClose:s})})},st=({children:t})=>{const s=Fe({disableHysteresis:!0,threshold:0});return j.cloneElement(t,{elevation:s?4:0})},nt=()=>{const[t,s]=j.useState(null),[o,r]=j.useState(null),[n,i]=j.useState(),{t:a}=E(),m=Me({select:l=>l.status==="pending"});j.useEffect(()=>h.subscribeToAuthenticatedUser(l=>i(l)),[]);const g=()=>{r(null),s(null)};return e.jsx(st,{children:e.jsxs(e.Fragment,{children:[e.jsx(we,{children:e.jsxs(ae,{children:[e.jsxs(w,{sx:{flexGrow:1,alignItems:"center",display:"flex",gap:1},children:[e.jsx(L,{component:k,to:"/",color:"#FFF",variant:"h6",underline:"none",children:a("GuestBook")}),m&&e.jsx(B,{size:16,thickness:10,sx:{color:"white"}})]}),e.jsxs(w,{sx:{display:"flex",gap:1},children:[e.jsx(q,{size:"large",onClick:l=>r(l.currentTarget),children:e.jsx(Pe,{sx:{color:"white"}})}),n?e.jsx(q,{onClick:l=>s(l.currentTarget),sx:{p:0},children:e.jsx(T,{alt:n.username,src:`/storage/${n.image}`,children:e.jsx(I,{})})}):e.jsx(q,{size:"large",onClick:l=>s(l.currentTarget),color:"inherit",children:e.jsx(Se,{})})]}),e.jsx(Ye,{anchorEl:o,handleClose:g}),e.jsx(tt,{anchorEl:t,handleClose:g})]})}),e.jsx(ae,{})]})})},rt=()=>e.jsxs(e.Fragment,{children:[e.jsx(nt,{}),e.jsx(w,{sx:{display:"flex",justifyContent:"center"},children:e.jsx(w,{sx:{maxWidth:"800px",flexGrow:1},children:e.jsx(Be,{})})}),!1]}),at=({error:t})=>{const s=ne(),o=Qe();return j.useEffect(()=>{o.reset()},[o]),"code"in t&&t.code===D.UNAUTHORIZED&&(h.logOut(),W({to:b.INDEX})),e.jsxs("div",{children:[t.message,e.jsx("button",{onClick:()=>{s.invalidate()},children:"retry"})]})},X=Re()({component:rt,errorComponent:at}),ot=()=>{const[t,s]=j.useState(),[o,r]=j.useState(0),{t:n}=E(),i=z(),a=V(),m=N({mutationFn:({data:l})=>h.newPost(l)}),g=Q({defaultValues:{content:""},onSubmit:async({value:l})=>{try{m.mutate({data:l},{onSuccess:async x=>{g.reset(),await i.invalidateQueries({queryKey:["posts"]}),a({to:"/",search:{page:x.pages-1}})},onError:s})}catch(x){s(x)}}});return e.jsx("form",{onSubmit:l=>{l.preventDefault(),l.stopPropagation(),g.handleSubmit()},onKeyDown:l=>{l.key==="Tab"&&l.stopPropagation()},noValidate:!0,children:e.jsxs(w,{sx:{display:"grid",gap:2,padding:1},children:[e.jsx(g.Field,{name:"content",validators:{onChange:({value:l})=>l?void 0:n("Content required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:l})=>!l&&n("Content required")},children:l=>e.jsxs(e.Fragment,{children:[e.jsx(S,{variant:"outlined",multiline:!0,minRows:3,name:l.name,value:l.state.value,onBlur:l.handleBlur,onChange:x=>{x.target.value.length<=250&&(r(x.target.value.length),l.handleChange(x.target.value))},size:"small",label:n("Comment"),required:!0,error:l.state.meta.isTouched&&l.state.meta.errors.length>0,helperText:l.state.meta.isTouched?l.state.meta.errors.join(","):"",autoComplete:"off",fullWidth:!0}),e.jsx(ue,{variant:"determinate",value:o/250*100,color:o===250?"error":o>=200?"warning":"primary"})]})}),e.jsx(g.Subscribe,{selector:l=>[l.canSubmit,l.isSubmitting],children:([l])=>e.jsx(e.Fragment,{children:e.jsx(C,{type:"submit",disabled:!l||m.isPending,variant:"contained",endIcon:m.isPending&&e.jsx(B,{color:"inherit",size:"20px"}),children:n("Post comment")})})}),t&&e.jsx(U,{error:t,context:"newPost"})]})})},pe=t=>new Date(t.date).toLocaleString(navigator.languages[0]??"de-DE",{timeZone:t.timezone,day:"2-digit",month:"2-digit",year:"numeric",hour:"2-digit",hour12:!1,minute:"2-digit"}),it=({post:t,open:s,onClose:o})=>{const[r,n]=j.useState(),[i,a]=j.useState(t.content.length),m=N({mutationFn:({data:u,id:f})=>h.updatePost(u,f)}),g=Q({defaultValues:{content:t.content.replaceAll("<br />","")},onSubmit:async({value:u})=>{try{m.mutate({data:u,id:t.id},{onSuccess:()=>{d(),c.invalidateQueries({queryKey:["posts"]})},onError:n})}catch(f){n(f)}}}),l=ee(),x=te(l.breakpoints.only("xs"),{noSsr:!0}),c=z(),d=()=>{g.reset(),n(void 0),o()};return e.jsxs(K,{open:s,onClose:d,fullWidth:!0,fullScreen:x,PaperProps:{component:"form",onSubmit:u=>{u.preventDefault(),u.stopPropagation(),g.handleSubmit()},onKeyDown:u=>{u.key==="Tab"&&u.stopPropagation()},noValidate:!0},children:[e.jsx(_,{children:p("Edit post")}),e.jsx(F,{children:e.jsx(g.Field,{name:"content",validators:{onChange:({value:u})=>u?void 0:p("Content required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:u})=>!u&&p("Content required")},children:u=>e.jsxs(e.Fragment,{children:[e.jsx(S,{variant:"outlined",multiline:!0,minRows:3,name:u.name,value:u.state.value,onBlur:u.handleBlur,onChange:f=>{f.target.value.length<=250&&(a(f.target.value.length),u.handleChange(f.target.value))},size:"small",label:p("Comment"),required:!0,error:u.state.meta.isTouched&&u.state.meta.errors.length>0,helperText:u.state.meta.isTouched?u.state.meta.errors.join(","):"",autoComplete:"off",margin:"dense",fullWidth:!0}),e.jsx(ue,{variant:"determinate",value:i/250*100,color:i===250?"error":i>=200?"warning":"primary"})]})})}),e.jsx(H,{children:e.jsx(g.Subscribe,{selector:u=>[u.canSubmit,u.isSubmitting],children:([u])=>e.jsxs(e.Fragment,{children:[e.jsx(C,{variant:"outlined",onClick:()=>{d()},children:p("Cancel")}),e.jsx(C,{type:"submit",disabled:!u||m.isPending,autoFocus:!0,variant:"contained",endIcon:m.isPending&&e.jsx(B,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(F,{children:e.jsx(U,{error:r,context:"postUpdate"})})]})},ge=({post:t,disableActions:s})=>{var d,u,f;const[o,r]=j.useState(!1),[n,i]=j.useState(!1),[a,m]=j.useState(),g=N({mutationFn:A=>h.deletePost(A)}),{t:l}=E(),x=z(),c=V();return e.jsxs(de,{children:[e.jsx(Ee,{avatar:!s&&"id"in t.user?t.user.id!==((d=h.getAuthenticatedUser())==null?void 0:d.id)?e.jsx(L,{component:k,to:"/profile/$id",params:{id:t.user.id},children:e.jsx(T,{alt:t.user.username,src:`/storage/${t.user.image}`,children:e.jsx(I,{})})}):e.jsx(L,{component:k,to:"/profile",children:e.jsx(T,{alt:t.user.username,src:`/storage/${t.user.image}`,children:e.jsx(I,{})})}):e.jsx(T,{alt:t.user.username,src:`/storage/${t.user.image}`,children:e.jsx(I,{})}),title:!s&&"id"in t.user?t.user.id!==((u=h.getAuthenticatedUser())==null?void 0:u.id)?e.jsx(L,{component:k,to:"/profile/$id",params:{id:t.user.id},children:t.user.username}):e.jsx(L,{component:k,to:"/profile",children:t.user.username}):t.user.username,subheader:pe(t.postedAt)}),e.jsx(he,{children:e.jsx(v,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:t.content}})})}),e.jsxs(me,{children:[!s&&(h.isAdmin()||"id"in t.user&&t.user.id===((f=h.getAuthenticatedUser())==null?void 0:f.id))&&e.jsxs(e.Fragment,{children:[e.jsx(C,{size:"small",onClick:()=>i(!0),children:l("Edit")}),e.jsx(it,{post:t,open:n,onClose:()=>i(!1)})]}),!s&&h.isAdmin()&&e.jsxs(e.Fragment,{children:[e.jsx(C,{size:"small",color:"error",onClick:()=>r(!0),children:l("Delete")}),e.jsxs(K,{open:o,onClose:()=>r(!1),children:[e.jsx(_,{children:l("Confirm post delete title")}),e.jsx(F,{children:e.jsx(Ae,{children:l("Confirm post delete body",{name:t.user.username})})}),e.jsxs(H,{children:[e.jsx(C,{onClick:()=>r(!1),autoFocus:!0,variant:"contained",children:l("No")}),e.jsx(C,{variant:"outlined",color:"error",onClick:()=>{g.mutate(t.id,{onSuccess:async A=>{await x.invalidateQueries({queryKey:["posts"]}),c({to:"/",search:{page:A.pages-1}})},onError:m}),r(!1)},children:l("Yes")})]})]})]})]}),e.jsx(M,{open:g.isError,autoHideDuration:2e3,onClose:()=>{g.reset()},TransitionProps:{onExited:()=>m(void 0)},children:e.jsx(ke,{severity:"error",variant:"filled",sx:{width:"100%"},children:a&&e.jsx(U,{error:a,context:"delete",color:"white"})})}),e.jsx(M,{open:g.isPending,message:l("Deleting")})]})},xe=t=>G({queryKey:["posts",{page:t??0,hasAuth:h.hasAuth()}],queryFn:()=>h.posts(t)}),lt=()=>{const{page:t}=je.useSearch(),{data:s,isFetching:o}=R(xe(t)),{t:r}=E(),n=V();return j.useEffect(()=>{(t??0)>=s.pages&&n({to:"/",search:{page:s.pages-1}})},[t]),e.jsxs(e.Fragment,{children:[e.jsx(M,{open:o,message:r("Updating")}),e.jsxs(y,{container:!0,spacing:2,children:[s.data.map(i=>e.jsx(y,{item:!0,xs:12,children:e.jsx(ge,{post:i})},i.id)),e.jsx(y,{item:!0,xs:12,children:e.jsx(se,{variant:"middle"})}),h.hasAuth()&&e.jsx(y,{item:!0,xs:12,children:e.jsx(ot,{})}),e.jsx(y,{item:!0,xs:12,sx:{display:"flex",justifyContent:"center"},children:e.jsx(De,{page:(t??0)+1,count:s.pages,color:"primary",renderItem:i=>e.jsx(Te,{...i,component:k,to:"/",search:{page:(i.page??0)>0?(i.page??1)-1:void 0},onClick:a=>i.onClick(a)})})})]})]})},je=re(b.INDEX)({loaderDeps:({search:{page:t}})=>({page:t}),loader:({context:{queryClient:t},deps:{page:s}})=>t.ensureQueryData(xe(s)),validateSearch:t=>({page:(t==null?void 0:t.page)!==void 0?Number((t==null?void 0:t.page)??0):void 0}),component:lt}),ct=({user:t,open:s,onClose:o})=>{const[r,n]=j.useState(),i=N({mutationFn:({data:c,id:d})=>h.updateUser(c,d)}),a=Q({defaultValues:{username:t.username,email:t.email},onSubmit:async({value:c})=>{var d;try{i.mutate({data:c,id:((d=h.getAuthenticatedUser())==null?void 0:d.id)===t.id?void 0:t.id},{onSuccess:()=>{var f;x();const u=((f=h.getAuthenticatedUser())==null?void 0:f.id)===t.id?["profile"]:["profile",{id:t.id}];l.invalidateQueries({queryKey:u})},onError:n})}catch(u){n(u)}}}),m=ee(),g=te(m.breakpoints.only("xs"),{noSsr:!0}),l=z(),x=()=>{a.reset(),n(void 0),o()};return e.jsxs(K,{open:s,onClose:x,fullWidth:!0,fullScreen:g,PaperProps:{component:"form",onSubmit:c=>{c.preventDefault(),c.stopPropagation(),a.handleSubmit()},onKeyDown:c=>{c.key==="Tab"&&c.stopPropagation()},noValidate:!0},children:[e.jsx(_,{children:p("Edit data")}),e.jsxs(F,{children:[e.jsx(a.Field,{name:"username",validators:{onChange:({value:c})=>c?void 0:p("Username required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:c})=>!c&&p("Username required")},children:c=>e.jsx(e.Fragment,{children:e.jsx(S,{name:c.name,value:c.state.value,onBlur:c.handleBlur,onChange:d=>c.handleChange(d.target.value),size:"small",label:p("Username"),required:!0,margin:"dense",autoComplete:"new-username",fullWidth:!0,error:c.state.meta.isTouched&&c.state.meta.errors.length>0,helperText:c.state.meta.isTouched?c.state.meta.errors.join(","):""})})}),e.jsx(a.Field,{name:"email",validators:{onChange:({value:c})=>c?void 0:p("Email required"),onChangeAsyncDebounceMs:250,onChangeAsync:async({value:c})=>!c&&p("Email required")},children:c=>e.jsx(e.Fragment,{children:e.jsx(S,{name:c.name,value:c.state.value,onBlur:c.handleBlur,onChange:d=>c.handleChange(d.target.value),size:"small",label:p("Email"),required:!0,margin:"dense",autoComplete:"new-username",fullWidth:!0,error:c.state.meta.isTouched&&c.state.meta.errors.length>0,helperText:c.state.meta.isTouched?c.state.meta.errors.join(","):""})})})]}),e.jsx(H,{children:e.jsx(a.Subscribe,{selector:c=>[c.canSubmit,c.isSubmitting],children:([c])=>e.jsxs(e.Fragment,{children:[e.jsx(C,{variant:"outlined",onClick:()=>{x()},children:p("Cancel")}),e.jsx(C,{type:"submit",disabled:!c||i.isPending,autoFocus:!0,variant:"contained",endIcon:i.isPending&&e.jsx(B,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(F,{children:e.jsx(U,{error:r,context:"userUpdate"})})]})},ut=({user:t,open:s,onClose:o})=>{const[r,n]=j.useState(),i=N({mutationFn:({data:d,id:u})=>h.updateUserImage(d,u)}),a=Q({onSubmit:async({value:d})=>{var u;try{i.mutate({data:d,id:((u=h.getAuthenticatedUser())==null?void 0:u.id)===t.id?void 0:t.id},{onSuccess:()=>{var A;c();const f=((A=h.getAuthenticatedUser())==null?void 0:A.id)===t.id?["profile"]:["profile",{id:t.id}];l.invalidateQueries({queryKey:f})},onError:n})}catch(f){n(f)}}}),m=ee(),g=te(m.breakpoints.only("xs"),{noSsr:!0}),l=z(),x=a.useStore(d=>({image:d.values.image,predefined:d.values.predefined})),c=()=>{a.reset(),n(void 0),o()};return e.jsxs(K,{open:s,onClose:c,fullWidth:!0,fullScreen:g,PaperProps:{component:"form",encType:"multipart/form-data",onSubmit:d=>{d.preventDefault(),d.stopPropagation(),a.handleSubmit()},onKeyDown:d=>{d.key==="Tab"&&d.stopPropagation()},noValidate:!0},children:[e.jsx(_,{children:p("Edit image")}),e.jsx(F,{sx:{gap:2},children:e.jsxs(y,{container:!0,spacing:2,children:[e.jsx(y,{item:!0,xs:12,sx:{display:"flex",justifyContent:"center"},children:e.jsx(T,{alt:t.username,src:x.image?URL.createObjectURL(x.image):x.predefined?`/storage/profilbilder/default/${x.predefined}.svg`:`/storage/${t.image}`,sx:{width:"100px",height:"100px"},children:e.jsx(I,{sx:{width:"60px",height:"60px"}})})}),e.jsx(y,{item:!0,xs:12,children:e.jsxs(w,{sx:{display:"flex",gap:2},children:[e.jsx(C,{component:"label",role:void 0,variant:"contained",tabIndex:-1,startIcon:e.jsx(Ie,{}),fullWidth:!0,children:e.jsx(a.Field,{name:"image",children:d=>{var u;return e.jsxs(e.Fragment,{children:[e.jsx(w,{sx:{textOverflow:"ellipsis",textWrap:"nowrap",overflow:"hidden"},children:d.state.value?p("Upload named",{name:(u=d.state.value)==null?void 0:u.name}):p("Upload image")}),e.jsx(S,{name:d.name,onBlur:d.handleBlur,value:d.state.value?void 0:"",onChange:f=>d.handleChange(f.target.files[0]),size:"small",type:"file",required:!0,sx:{display:"none"},autoComplete:"off"})]})}})}),e.jsx(q,{color:"error",onClick:()=>a.setFieldValue("image",void 0),children:e.jsx($e,{})})]})}),e.jsx(y,{item:!0,xs:12,children:e.jsx(se,{variant:"middle",children:e.jsx(v,{sx:{opacity:.36},children:p("or")})})}),e.jsx(y,{item:!0,xs:12,children:e.jsx(a.Field,{name:"predefined",children:d=>e.jsxs(Ue,{fullWidth:!0,children:[e.jsx(Le,{size:"small",children:p("Predefined")}),e.jsxs(Oe,{name:d.name,value:d.state.value??"",onBlur:d.handleBlur,onChange:u=>d.handleChange(u.target.value),size:"small",label:p("Predefined"),autoComplete:"off",fullWidth:!0,children:[e.jsx($,{value:"",selected:!0,children:"Keine Auswahl"}),[...Array(10).keys()].map(u=>e.jsx($,{value:`avatar-${u+1}`,children:p("Avatar",{name:u+1})},`avatar-${u+1}`))]})]})})})]})}),e.jsx(H,{children:e.jsx(a.Subscribe,{selector:d=>[d.canSubmit,d.isSubmitting],children:([d])=>e.jsxs(e.Fragment,{children:[e.jsx(C,{variant:"outlined",onClick:()=>{c()},children:p("Cancel")}),e.jsx(C,{type:"submit",disabled:!d||i.isPending,autoFocus:!0,variant:"contained",endIcon:i.isPending&&e.jsx(B,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(F,{children:e.jsx(U,{error:r,context:"userUpdate"})})]})},fe=({user:t,posts:s,canEdit:o})=>{const[r,n]=j.useState(!1),[i,a]=j.useState(!1),{t:m}=E();return e.jsxs(y,{container:!0,sx:{justifyContent:"center"},spacing:2,children:[e.jsx(y,{item:!0,children:e.jsxs(de,{children:[e.jsx(he,{children:e.jsxs(y,{container:!0,spacing:2,children:[e.jsx(y,{item:!0,sx:{display:"flex",flexGrow:1,justifyContent:"center"},children:e.jsx(q,{onClick:()=>a(!0),children:e.jsx(T,{alt:t.username,src:`/storage/${t.image}`,sx:{width:"100px",height:"100px"},children:e.jsx(I,{sx:{width:"60px",height:"60px"}})})})}),e.jsx(y,{item:!0,sx:{display:"flex",alignItems:"center"},children:e.jsxs(w,{sx:{display:"grid",gridTemplateColumns:"120px 1fr",columnGap:1},children:[e.jsxs(v,{fontWeight:"bold",children:[m("Username"),":"]}),e.jsx(v,{children:t.username}),e.jsxs(v,{fontWeight:"bold",children:[m("Email"),":"]}),e.jsx(v,{children:t.email}),e.jsxs(v,{fontWeight:"bold",children:[m("Member since"),":"]}),e.jsx(v,{children:pe(t.memberSince)}),e.jsxs(v,{fontWeight:"bold",children:[m("Post count"),":"]}),e.jsx(v,{children:t.postCount})]})})]})}),e.jsx(me,{children:o&&e.jsxs(e.Fragment,{children:[e.jsx(C,{size:"small",onClick:()=>n(!0),children:m("Edit")}),e.jsx(ct,{user:t,open:r,onClose:()=>n(!1)}),e.jsx(ut,{user:t,open:i,onClose:()=>a(!1)})]})})]})}),e.jsx(y,{item:!0,xs:12,children:e.jsx(se,{variant:"middle",children:e.jsx(v,{sx:{opacity:.36},children:m("Recent posts")})})}),s.map(g=>e.jsx(y,{item:!0,xs:12,children:e.jsx(ge,{post:g,disableActions:!0})}))]})},ye=G({queryKey:["profile"],queryFn:()=>h.user()}),ve=t=>G({queryKey:["profile",{id:t}],queryFn:()=>h.user(t)}),Z=t=>G({queryKey:["profilePosts",{id:t}],queryFn:()=>h.userPosts(t)}),dt=()=>{var n;const{data:t,isFetching:s}=R(ye),{data:o,isFetching:r}=R(Z(((n=h.getAuthenticatedUser())==null?void 0:n.id)??0));return console.log(o.data),e.jsxs(e.Fragment,{children:[e.jsx(M,{open:s||r,message:p("Updating")}),e.jsx(fe,{user:t,posts:o.data,canEdit:!0})]})},ht=re(`${b.PROFILE}/`)({loader:({context:{queryClient:t}})=>{var s;t.ensureQueryData(ye),t.ensureQueryData(Z(((s=h.getAuthenticatedUser())==null?void 0:s.id)??0))},beforeLoad:()=>{if(!h.hasAuth())throw W({to:b.INDEX})},component:dt}),mt=()=>{const{id:t}=Ce.useParams(),{data:s,isFetching:o}=R(ve(t)),{data:r,isFetching:n}=R(Z(t));return e.jsxs(e.Fragment,{children:[e.jsx(M,{open:o||n,message:p("Updating")}),e.jsx(fe,{user:s,posts:r.data,canEdit:h.isAdmin()})]})},Ce=re(`${b.PROFILE}/$id`)({params:{parse:({id:t})=>({id:parseInt(t)}),stringify:({id:t})=>({id:t.toString()})},loader:({context:{queryClient:t},params:{id:s}})=>{t.ensureQueryData(ve(s)),t.ensureQueryData(Z(s))},beforeLoad:({params:{id:t}})=>{var s;if(!h.hasAuth())throw W({to:b.INDEX});if(t===((s=h.getAuthenticatedUser())==null?void 0:s.id))throw W({to:b.PROFILE})},component:mt}),pt=je.update({path:"/",getParentRoute:()=>X}),gt=ht.update({path:"/profile/",getParentRoute:()=>X}),xt=Ce.update({path:"/profile/$id",getParentRoute:()=>X}),jt=X.addChildren({IndexRoute:pt,ProfileIdRoute:xt,ProfileIndexRoute:gt}),be=new ze,ft=Ne({routeTree:jt,context:{queryClient:be},defaultPreload:"intent",defaultPreloadStaleTime:0,basepath:"/phpCourse/exam"}),le=document.getElementById("root");le.innerHTML||Y.createRoot(le).render(e.jsx(j.StrictMode,{children:e.jsxs(We,{client:be,children:[e.jsx(Ke,{router:ft}),e.jsx(_e,{initialIsOpen:!1})]})}));
|