2 lines
25 KiB
JavaScript
2 lines
25 KiB
JavaScript
import{j as e,M as ue,a as U,T as v,B as w,b as F,c as C,A as Pe,d as oe,L as O,C as Q,I as M,e as Se,f as T,P as I,g as Fe,u as Ae,h as de,i as te,k as se,D as _,l as H,m as A,n as V,o as he,p as Ee,q as me,r as pe,s as $e,S as R,t as ke,G as y,v as ne,w as De,x as Te,y as Ie,z as Ue,F as Le,E as Oe,H as qe}from"./mui-CxHUbSMi.js";import{u as re,a as z,b as G,c as Me,d as Re,L as k,e as Be,O as Qe,f as ze,r as K,g as N,h as W,q as X,i as ae,j as B,Q as Ne,k as We,l as Ke,R as _e,m as He}from"./tanstack-xmxrKlZO.js";import{c as Ve,r as j}from"./react-DXd9vB-a.js";import{i as q,B as Ge,a as Xe,b as Ze,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 ee={},ie=Ve;ee.createRoot=ie.createRoot,ee.hydrateRoot=ie.hydrateRoot;const Y=15,Je=3,S="/phpCourse/exam/storage/",P="https://khofmann.userpage.fu-berlin.de/phpCourse/exam/api/";let le;class Ye{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=${Y}`;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=${Y}`)).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=${Y}`,{...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=${Je}&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()},le)throw new Error("New instance cannot be created!!");le=this}}const h=new Ye;var D=(t=>(t.NOT_FOUND="NotFound",t.UNAUTHORIZED="Unauthorized",t.FAILED_UPDATE="FailedUpdate",t.MISSING_FIELD="MissingField",t))(D||{});q.use(Ge).use(Xe).use(Ze).init({fallbackLng:"en",debug:!1,interpolation:{escapeValue:!1},backend:{loadPath:"/phpCourse/exam/dist/locales/{{lng}}/{{ns}}.json"}});const et=({anchorEl:t,handleClose:s})=>e.jsxs(ue,{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(U,{selected:q.language==="en",onClick:()=>{q.changeLanguage("en"),s()},children:"English"},"de"),e.jsx(U,{selected:q.language==="de",onClick:()=>{q.changeLanguage("de"),s()},children:"Deutsch"},"en")]});var b=(t=>(t.INDEX="/",t.PROFILE="/profile",t))(b||{});const L=({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})})},tt=({handleClose:t})=>{const[s,o]=j.useState(),{t:r}=E(),n=re(),i=z({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(F,{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(F,{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(L,{error:s,context:"login"})]})})},st=({anchorEl:t,handleClose:s})=>{const o=G(),r=re(),n=Me({from:"/profile/",strict:!0,shouldThrow:!1}),i=h.getAuthenticatedUser();return e.jsx(ue,{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(U,{selected:!!n,onClick:()=>{o({to:b.PROFILE}),s()},children:p("Profile")},"profile"),e.jsx(U,{onClick:async()=>{await h.logOut(),r.invalidate(),s()},children:p("Log out")},"logout")]:e.jsx(tt,{handleClose:s})})},nt=({children:t})=>{const s=Ae({disableHysteresis:!0,threshold:0});return j.cloneElement(t,{elevation:s?4:0})},rt=()=>{const[t,s]=j.useState(null),[o,r]=j.useState(null),[n,i]=j.useState(),{t:a}=E(),m=Re({select:l=>l.status==="pending"});j.useEffect(()=>h.subscribeToAuthenticatedUser(l=>i(l)),[]);const g=()=>{r(null),s(null)};return e.jsx(nt,{children:e.jsxs(e.Fragment,{children:[e.jsx(Pe,{children:e.jsxs(oe,{children:[e.jsxs(w,{sx:{flexGrow:1,alignItems:"center",display:"flex",gap:1},children:[e.jsx(O,{component:k,to:"/",color:"#FFF",variant:"h6",underline:"none",children:a("GuestBook")}),m&&e.jsx(Q,{size:16,thickness:10,sx:{color:"white"}})]}),e.jsxs(w,{sx:{display:"flex",gap:1},children:[e.jsx(M,{size:"large",onClick:l=>r(l.currentTarget),children:e.jsx(Se,{sx:{color:"white"}})}),n?e.jsx(M,{onClick:l=>s(l.currentTarget),sx:{p:0},children:e.jsx(T,{alt:n.username,src:`${S}/${n.image}`,children:e.jsx(I,{})})}):e.jsx(M,{size:"large",onClick:l=>s(l.currentTarget),color:"inherit",children:e.jsx(Fe,{})})]}),e.jsx(et,{anchorEl:o,handleClose:g}),e.jsx(st,{anchorEl:t,handleClose:g})]})}),e.jsx(oe,{})]})})},at=()=>e.jsxs(e.Fragment,{children:[e.jsx(rt,{}),e.jsx(w,{sx:{display:"flex",justifyContent:"center"},children:e.jsx(w,{sx:{maxWidth:"800px",flexGrow:1},children:e.jsx(Qe,{})})}),!1]}),ot=({error:t})=>{const s=re(),o=ze();return j.useEffect(()=>{o.reset()},[o]),"code"in t&&t.code===D.UNAUTHORIZED&&(h.logOut(),K({to:b.INDEX})),e.jsxs("div",{children:[t.message,e.jsx("button",{onClick:()=>{s.invalidate()},children:"retry"})]})},Z=Be()({component:at,errorComponent:ot}),it=()=>{const[t,s]=j.useState(),[o,r]=j.useState(0),{t:n}=E(),i=N(),a=G(),m=W({mutationFn:({data:l})=>h.newPost(l)}),g=z({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(F,{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(de,{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(Q,{color:"inherit",size:"20px"}),children:n("Post comment")})})}),t&&e.jsx(L,{error:t,context:"newPost"})]})})},ge=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"}),lt=({post:t,open:s,onClose:o})=>{const[r,n]=j.useState(),[i,a]=j.useState(t.content.length),m=W({mutationFn:({data:u,id:f})=>h.updatePost(u,f)}),g=z({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=te(),x=se(l.breakpoints.only("xs"),{noSsr:!0}),c=N(),d=()=>{g.reset(),n(void 0),o()};return e.jsxs(_,{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(H,{children:p("Edit post")}),e.jsx(A,{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(F,{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(de,{variant:"determinate",value:i/250*100,color:i===250?"error":i>=200?"warning":"primary"})]})})}),e.jsx(V,{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(Q,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(A,{children:e.jsx(L,{error:r,context:"postUpdate"})})]})},xe=({post:t,disableActions:s})=>{var d,u,f;const[o,r]=j.useState(!1),[n,i]=j.useState(!1),[a,m]=j.useState(),g=W({mutationFn:$=>h.deletePost($)}),{t:l}=E(),x=N(),c=G();return e.jsxs(he,{children:[e.jsx(Ee,{avatar:!s&&"id"in t.user?t.user.id!==((d=h.getAuthenticatedUser())==null?void 0:d.id)?e.jsx(O,{component:k,to:"/profile/$id",params:{id:t.user.id},children:e.jsx(T,{alt:t.user.username,src:`${S}${t.user.image}`,children:e.jsx(I,{})})}):e.jsx(O,{component:k,to:"/profile",children:e.jsx(T,{alt:t.user.username,src:`${S}${t.user.image}`,children:e.jsx(I,{})})}):e.jsx(T,{alt:t.user.username,src:`${S}${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(O,{component:k,to:"/profile/$id",params:{id:t.user.id},children:t.user.username}):e.jsx(O,{component:k,to:"/profile",children:t.user.username}):t.user.username,subheader:ge(t.postedAt)}),e.jsx(me,{children:e.jsx(v,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:t.content}})})}),e.jsxs(pe,{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(lt,{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(_,{open:o,onClose:()=>r(!1),children:[e.jsx(H,{children:l("Confirm post delete title")}),e.jsx(A,{children:e.jsx($e,{children:l("Confirm post delete body",{name:t.user.username})})}),e.jsxs(V,{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 $=>{await x.invalidateQueries({queryKey:["posts"]}),c({to:"/",search:{page:$.pages-1}})},onError:m}),r(!1)},children:l("Yes")})]})]})]})]}),e.jsx(R,{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(L,{error:a,context:"delete",color:"white"})})}),e.jsx(R,{open:g.isPending,message:l("Deleting")})]})},je=t=>X({queryKey:["posts",{page:t??0,hasAuth:h.hasAuth()}],queryFn:()=>h.posts(t)}),ct=()=>{const{page:t}=fe.useSearch(),{data:s,isFetching:o}=B(je(t)),{t:r}=E(),n=G();return j.useEffect(()=>{(t??0)>=s.pages&&n({to:"/",search:{page:s.pages-1}})},[t]),e.jsxs(e.Fragment,{children:[e.jsx(R,{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(xe,{post:i})},i.id)),e.jsx(y,{item:!0,xs:12,children:e.jsx(ne,{variant:"middle"})}),h.hasAuth()&&e.jsx(y,{item:!0,xs:12,children:e.jsx(it,{})}),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)})})})]})]})},fe=ae(b.INDEX)({loaderDeps:({search:{page:t}})=>({page:t}),loader:({context:{queryClient:t},deps:{page:s}})=>t.ensureQueryData(je(s)),validateSearch:t=>({page:(t==null?void 0:t.page)!==void 0?Number((t==null?void 0:t.page)??0):void 0}),component:ct}),ut=({user:t,open:s,onClose:o})=>{const[r,n]=j.useState(),i=W({mutationFn:({data:c,id:d})=>h.updateUser(c,d)}),a=z({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=te(),g=se(m.breakpoints.only("xs"),{noSsr:!0}),l=N(),x=()=>{a.reset(),n(void 0),o()};return e.jsxs(_,{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(H,{children:p("Edit data")}),e.jsxs(A,{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(F,{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(F,{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(V,{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(Q,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(A,{children:e.jsx(L,{error:r,context:"userUpdate"})})]})},dt=({user:t,open:s,onClose:o})=>{const[r,n]=j.useState(),i=W({mutationFn:({data:d,id:u})=>h.updateUserImage(d,u)}),a=z({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 $;c();const f=(($=h.getAuthenticatedUser())==null?void 0:$.id)===t.id?["profile"]:["profile",{id:t.id}];l.invalidateQueries({queryKey:f})},onError:n})}catch(f){n(f)}}}),m=te(),g=se(m.breakpoints.only("xs"),{noSsr:!0}),l=N(),x=a.useStore(d=>({image:d.values.image,predefined:d.values.predefined})),c=()=>{a.reset(),n(void 0),o()};return e.jsxs(_,{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(H,{children:p("Edit image")}),e.jsx(A,{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?`${S}profilbilder/default/${x.predefined}.svg`:`${S}${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(F,{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(M,{color:"error",onClick:()=>a.setFieldValue("image",void 0),children:e.jsx(Ue,{})})]})}),e.jsx(y,{item:!0,xs:12,children:e.jsx(ne,{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(Le,{fullWidth:!0,children:[e.jsx(Oe,{size:"small",children:p("Predefined")}),e.jsxs(qe,{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(U,{value:"",selected:!0,children:"Keine Auswahl"}),[...Array(10).keys()].map(u=>e.jsx(U,{value:`avatar-${u+1}`,children:p("Avatar",{name:u+1})},`avatar-${u+1}`))]})]})})})]})}),e.jsx(V,{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(Q,{color:"inherit",size:"20px"}),children:p("Save")})]})})}),r&&e.jsx(A,{children:e.jsx(L,{error:r,context:"userUpdate"})})]})},ye=({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(he,{children:[e.jsx(me,{children:e.jsxs(y,{container:!0,spacing:2,children:[e.jsx(y,{item:!0,sx:{display:"flex",flexGrow:1,justifyContent:"center"},children:e.jsx(M,{onClick:()=>a(!0),children:e.jsx(T,{alt:t.username,src:`${S}${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:ge(t.memberSince)}),e.jsxs(v,{fontWeight:"bold",children:[m("Post count"),":"]}),e.jsx(v,{children:t.postCount})]})})]})}),e.jsx(pe,{children:o&&e.jsxs(e.Fragment,{children:[e.jsx(C,{size:"small",onClick:()=>n(!0),children:m("Edit")}),e.jsx(ut,{user:t,open:r,onClose:()=>n(!1)}),e.jsx(dt,{user:t,open:i,onClose:()=>a(!1)})]})})]})}),e.jsx(y,{item:!0,xs:12,children:e.jsx(ne,{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(xe,{post:g,disableActions:!0})}))]})},ve=X({queryKey:["profile"],queryFn:()=>h.user()}),Ce=t=>X({queryKey:["profile",{id:t}],queryFn:()=>h.user(t)}),J=t=>X({queryKey:["profilePosts",{id:t}],queryFn:()=>h.userPosts(t)}),ht=()=>{var n;const{data:t,isFetching:s}=B(ve),{data:o,isFetching:r}=B(J(((n=h.getAuthenticatedUser())==null?void 0:n.id)??0));return console.log(o.data),e.jsxs(e.Fragment,{children:[e.jsx(R,{open:s||r,message:p("Updating")}),e.jsx(ye,{user:t,posts:o.data,canEdit:!0})]})},mt=ae(`${b.PROFILE}/`)({loader:({context:{queryClient:t}})=>{var s;t.ensureQueryData(ve),t.ensureQueryData(J(((s=h.getAuthenticatedUser())==null?void 0:s.id)??0))},beforeLoad:()=>{if(!h.hasAuth())throw K({to:b.INDEX})},component:ht}),pt=()=>{const{id:t}=be.useParams(),{data:s,isFetching:o}=B(Ce(t)),{data:r,isFetching:n}=B(J(t));return e.jsxs(e.Fragment,{children:[e.jsx(R,{open:o||n,message:p("Updating")}),e.jsx(ye,{user:s,posts:r.data,canEdit:h.isAdmin()})]})},be=ae(`${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(Ce(s)),t.ensureQueryData(J(s))},beforeLoad:({params:{id:t}})=>{var s;if(!h.hasAuth())throw K({to:b.INDEX});if(t===((s=h.getAuthenticatedUser())==null?void 0:s.id))throw K({to:b.PROFILE})},component:pt}),gt=fe.update({path:"/",getParentRoute:()=>Z}),xt=mt.update({path:"/profile/",getParentRoute:()=>Z}),jt=be.update({path:"/profile/$id",getParentRoute:()=>Z}),ft=Z.addChildren({IndexRoute:gt,ProfileIdRoute:jt,ProfileIndexRoute:xt}),we=new Ne,yt=We({routeTree:ft,context:{queryClient:we},defaultPreload:"intent",defaultPreloadStaleTime:0,basepath:"/phpCourse/exam"}),ce=document.getElementById("root");ce.innerHTML||ee.createRoot(ce).render(e.jsx(j.StrictMode,{children:e.jsxs(Ke,{client:we,children:[e.jsx(_e,{router:yt}),e.jsx(He,{initialIsOpen:!1})]})}));
|