@tycoonsystems/tycoon-modules/modules/admin/DatabaseAdmin.js

www.tv.tycoon.systems/documentation

import React from"react";import{debounce}from"@tycoonsystems/tycoon-modules/util";import{v4 as uuidv4}from"uuid";import AdminStyles from"./Admin.module.scss";import{logout}from"@tycoonsystems/tycoon-modules/utility/onboarding/SignIn";import{fetchPost}from"@tycoonsystems/tycoon-modules/utility/fetch";import{printRecursiveObject}from"@tycoonsystems/tycoon-modules/utility/utility/data";const moduleName="DatabaseAdmin",DO_SEARCH_DELAY=1500,Module=n=>{const[t,a]=React.useState(!1),[,l]=React.useState(null),[r,c]=React.useState(null),[i,o]=React.useState(null),[s,u]=React.useState(!1),[d,m]=React.useState(null),[f,g]=React.useState(0),[p,R]=React.useState(null),[h,v]=React.useState(null),[y,E]=React.useState(null),[b,S]=React.useState(null),A=React.useRef(),N=React.useRef(),C=React.useRef(),T=(n._LocalEventEmitter.unsubscribe(moduleName),n._LocalEventEmitter.subscribe(moduleName,e=>{e&&("loadDefault"===e.dispatch?T():"search"===e.dispatch&&null!==(e=A?.current?.value)&&k(e))}),React.useEffect(()=>{var e;t||(e=uuidv4(),l(e),T(),a(!0))},[t]),async()=>{var e={domainKey:n.domainKey,hash:n._loggedIn.hash,identifier:n._loggedIn.identifier},e=await fetchPost(n.apiUrl+"/a/databasecruddefaults",null,null,e);return!!e&&(e.hasOwnProperty("status")?"disauthenticated"==e.status?(logout(),"disauthenticated"):"failed"!=e.status&&("success"==e.status?(e?.data&&(c(e.data),!i)&&e?.data?.model[0]&&e.data.model[0].table&&o(e.data.model[0].table),e):void 0):void 0)}),_=React.useCallback(e=>{e?.currentTarget?.getAttribute&&(e=e.currentTarget.getAttribute("modif"))&&(o(e),setTimeout(()=>{n._LocalEventEmitter.dispatch(moduleName,{dispatch:"search"})},150))}),k=async e=>{let t;try{var a,l;if(!s)return t=setTimeout(()=>{u(!1)},1e4),a={domainKey:n.domainKey,hash:n._loggedIn.hash,identifier:n._loggedIn.identifier,table:i,value:e,offset:f},(l=await fetchPost(n.apiUrl+"/a/databaserecordssearch",null,null,a))?l.hasOwnProperty("status")?(u(!1),clearTimeout(t),"disauthenticated"==l.status?(logout(),"disauthenticated"):"failed"!=l.status&&("success"==l.status?(l?.data&&m(l.data),l):void 0)):void 0:(u(!1),clearTimeout(t),!1)}catch(e){u(!1),clearTimeout(t)}};var e=React.useCallback(debounce(e=>{e?.target&&void 0!==(e=e.target.value)&&(P(),k(e))},DO_SEARCH_DELAY),[i]);const x=React.useCallback(e=>{var t=e.currentTarget.getAttribute("scope");t&&(e=e.currentTarget.getAttribute("i"),"itemOffset"===t&&g(Number(e)),setTimeout(()=>{n._LocalEventEmitter.dispatch(moduleName,{dispatch:"search"})},150))}),w=React.useCallback(e=>{if(P(),e?.currentTarget?.getAttribute){const t=e.currentTarget.getAttribute("modif");t&&(e=d.find(e=>e.id===t))&&R({model:i,record:e,config:r?.model?.find(e=>e.table===i)})}});var I=React.useCallback(e=>{if(P(),e?.currentTarget?.getAttribute){const c=e.currentTarget.getAttribute("i");var a=e.currentTarget.getAttribute("modif");const n=e.currentTarget.getAttribute("array");e=e.currentTarget.getAttribute("parentarr");if("edit"===a){if(c){let t=p.record;var l=c.split(".");for(let e=0;e<l.length;e++)t=t[l[e]];console.log(N.current),v(null),setTimeout(()=>{v({reference:c,cur:t,arr:n})},100)}}else if("add"===a&&c){let t=p.record;var r=c.split(".");if(console.log(a,n,e,t,r),1<r.length&&r.pop(),e){for(let e=0;e<r.length;e++)t=t[r[e]];console.log(t,n,c,r.join(".")),v({reference:r.join("."),cur:t,arr:n})}else S({reference:r.join("."),field:"",value:""})}}});const D=(e,t,a,l,r)=>(console.log(e,t),r&&!e[t[a]]||e&&e[t[a]]&&a===t.length-1?(e[t[a]]=l,e):D(e[t[a]],t,a+1,l,r));var O=React.useCallback(a=>{if(a?.currentTarget?.getAttribute){a=a.currentTarget.getAttribute("modif");if("cancel"===a)v(null),S(null);else if("set"===a){let e=N.current.value;h?.arr&&(e=e.split(","));a=p.record;let t;b?.reference&&C?.current?.value?(t=b.reference.split(".")).push(C.current.value):t=h.reference.split("."),D(a,t,0,e,!!b?.reference&&C.current.value),E(p),v(null),(async e=>{let a;try{if(!s){a=setTimeout(()=>{u(!1)},1e4);var l,r,c={domainKey:n.domainKey,hash:n._loggedIn.hash,identifier:n._loggedIn.identifier,table:i,record:e??y,recordid:p?.record?.id};let t=await fetchPost(n.apiUrl+"/a/databasecrudupdate",null,null,c);return t?t.hasOwnProperty("status")?(u(!1),clearTimeout(a),"disauthenticated"==t.status?(logout(),"disauthenticated"):"failed"!=t.status&&("success"==t.status?(t?.data&&(console.log(t.data),-1<(r=(l=d).findIndex(e=>e.id===t.data.id))&&(l[r]=t.data),console.log(l[r]),m(l)),t):void 0)):void 0:(u(!1),clearTimeout(a),!1)}}catch(e){u(!1),clearTimeout(a)}})(p.record),S(null)}}});const P=()=>{S(null),v(null),E(null)};var B=[f-2,f-1,f,f+1,f+2];return console.log("Database",r,i,d,p,h),React.createElement("div",{className:`${n.className} ${moduleName}_Container`},React.createElement("h3",null,"Database"),React.createElement("div",{className:""+AdminStyles.containerTwoSmallRight},React.createElement("div",null,React.createElement("div",null,b?React.createElement("div",{className:""+AdminStyles.crudUpdateContainer},React.createElement("div",{style:{marginBottom:".25rem"}},"New field under ",b?.reference," of ",p?.model," ",p?.record?.id),React.createElement("div",{className:"flex gap-p5"},React.createElement("input",{type:"text",placeholder:"Set Field",ref:C,defaultValue:h?.cur,className:""+AdminStyles.inputSearch,style:{width:"100%",marginBottom:".25rem"}}),React.createElement("input",{type:"text",placeholder:"Set Value",ref:N,defaultValue:h?.cur,className:""+AdminStyles.inputSearch,style:{width:"100%",marginBottom:".25rem"}})),React.createElement("div",{className:"flex gap-p2"},React.createElement("button",{onClick:O,modif:"set"},"Set"),React.createElement("button",{onClick:O,modif:"cancel"},"Cancel"))):null),React.createElement("div",null,h?React.createElement("div",{className:""+AdminStyles.crudUpdateContainer},React.createElement("div",{style:{marginBottom:".25rem"}},h?.reference," of ",p?.model," ",p?.record?.id),h?.arr?React.createElement("div",null,"Comma separated list of values"):null,React.createElement("input",{type:"text",placeholder:"Set Value",ref:N,defaultValue:h?.cur,className:""+AdminStyles.inputSearch,style:{width:"100%",marginBottom:".25rem"}}),React.createElement("div",{className:"flex gap-p2"},React.createElement("button",{onClick:O,modif:"set"},"Set"),React.createElement("button",{onClick:O,modif:"cancel"},"Cancel"))):null),React.createElement("div",null,p?.record?React.createElement("div",{className:""+AdminStyles.crudContainer},React.createElement("p",null,p?.model),React.createElement("h4",null,p?.record?.title??p?.record?.name??p?.record?.username??p?.record?.id),React.createElement("div",{className:"record_box"},printRecursiveObject(p.record,0,p?.config,"",I))):null)),React.createElement("div",{className:"Editor_Container Editor_MaxWidth"},React.createElement("div",{className:"tagContainer",style:{marginBottom:".5rem"}},r?.model?.map?r.model.map((e,t)=>React.createElement("div",{className:"tagItem "+(i===e?.table?"tagItemSelected":null),style:{cursor:"pointer"},modif:e?.table,onClick:_},e?.table)):null),React.createElement("section",null,React.createElement("div",null,React.createElement("input",{type:"text",placeholder:"Search Records",ref:A,className:""+AdminStyles.inputSearch,style:{width:"100%"},onChange:e})),React.createElement("div",{className:"flex",style:{flexDirection:"column",gap:".25rem"}},d?.map?d.map(e=>{return React.createElement("div",{className:""+AdminStyles.itemContainer,style:{cursor:"pointer"},onClick:w,modif:e.id},React.createElement("div",null,(e=e).title&&""!==e?.title?e.title:e.name&&""!==e?.name?e.name:e.username&&""!==e?.username?e.username:e.id))}):null),React.createElement("ul",{className:"PaginationContainer"},B.map((e,t)=>-1<e?React.createElement("li",{className:e==f?"ActivePage":"",scope:"itemOffset",key:t,i:e,onClick:x},e+1):null))))))};export default Module;