@enerex/template-studio 1.1.26 → 1.1.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -3,7 +3,7 @@ import I, { useContext as J, useState as E, useEffect as C } from "react";
|
|
|
3
3
|
import { QueryClient as ce, QueryClientProvider as pe, useQuery as q, useMutation as Z, useQueryClient as me } from "@tanstack/react-query";
|
|
4
4
|
import V from "axios";
|
|
5
5
|
import { Spinner as B, Form as S, Card as K, Row as ue, Col as P, Button as z } from "react-bootstrap";
|
|
6
|
-
import { Controller as
|
|
6
|
+
import { Controller as ge, useForm as fe } from "react-hook-form";
|
|
7
7
|
import G from "react-select";
|
|
8
8
|
const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
|
|
9
9
|
<html\r
|
|
@@ -369,7 +369,7 @@ const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
|
|
|
369
369
|
}) => {
|
|
370
370
|
const [s, l] = I.useState(r.clientId), [e, t] = I.useState(r.apiKey), [i, o] = I.useState(
|
|
371
371
|
r.enerexIdentifier
|
|
372
|
-
), [c, y] = I.useState(r.userName), [
|
|
372
|
+
), [c, y] = I.useState(r.userName), [f, h] = I.useState(r.projectId), b = (m) => {
|
|
373
373
|
t(m.apiKey), l(m.clientId), h(m.projectId), o(m.enerexIdentifier), y(m.userName);
|
|
374
374
|
};
|
|
375
375
|
return /* @__PURE__ */ a(
|
|
@@ -380,7 +380,7 @@ const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
|
|
|
380
380
|
apiKey: e,
|
|
381
381
|
setConfiguration: b,
|
|
382
382
|
enerexIdentifier: i,
|
|
383
|
-
projectId:
|
|
383
|
+
projectId: f,
|
|
384
384
|
userName: c
|
|
385
385
|
},
|
|
386
386
|
children: n
|
|
@@ -485,7 +485,7 @@ const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
|
|
|
485
485
|
}) => {
|
|
486
486
|
const { post: l } = te(), { data: e } = ve(), { data: t } = Te(), [i, o] = E(
|
|
487
487
|
n ?? { html: L, css: "" }
|
|
488
|
-
), { enerexIdentifier: c, projectId: y, userName:
|
|
488
|
+
), { enerexIdentifier: c, projectId: y, userName: f } = T(), h = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", b = "https://plugins.stripo.email/api/v1/auth";
|
|
489
489
|
C(() => {
|
|
490
490
|
if (e && t && !document.getElementById("UiEditorScript")) {
|
|
491
491
|
const u = document.createElement("script");
|
|
@@ -503,7 +503,7 @@ const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
|
|
|
503
503
|
metadata: {
|
|
504
504
|
emailId: `${y}_${c}`,
|
|
505
505
|
userId: "1",
|
|
506
|
-
username:
|
|
506
|
+
username: f,
|
|
507
507
|
avatarUrl: h
|
|
508
508
|
},
|
|
509
509
|
locale: "en",
|
|
@@ -513,8 +513,8 @@ const L = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
|
|
|
513
513
|
secretKey: $.EDITOR_SECRET_KEY,
|
|
514
514
|
userId: "12",
|
|
515
515
|
role: "user"
|
|
516
|
-
},
|
|
517
|
-
|
|
516
|
+
}, g = await l(b, p);
|
|
517
|
+
g && u(g.token);
|
|
518
518
|
},
|
|
519
519
|
codeEditorButtonSelector: "#codeEditor",
|
|
520
520
|
undoButtonSelector: "#undoButton",
|
|
@@ -661,7 +661,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
661
661
|
disabled: o,
|
|
662
662
|
isInvalid: c,
|
|
663
663
|
value: y,
|
|
664
|
-
onChange:
|
|
664
|
+
onChange: f,
|
|
665
665
|
uncontrolled: h,
|
|
666
666
|
menuPlacement: b = "auto",
|
|
667
667
|
closeOnSelect: m = !0
|
|
@@ -714,7 +714,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
714
714
|
classNamePrefix: "react-select",
|
|
715
715
|
isMulti: l,
|
|
716
716
|
options: s,
|
|
717
|
-
onChange:
|
|
717
|
+
onChange: f,
|
|
718
718
|
placeholder: e,
|
|
719
719
|
menuPortalTarget: document.body,
|
|
720
720
|
value: y,
|
|
@@ -725,12 +725,12 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
725
725
|
closeMenuOnSelect: m
|
|
726
726
|
}
|
|
727
727
|
) : /* @__PURE__ */ a(
|
|
728
|
-
|
|
728
|
+
ge,
|
|
729
729
|
{
|
|
730
730
|
control: r,
|
|
731
731
|
name: n,
|
|
732
732
|
rules: t,
|
|
733
|
-
render: ({ field: { onChange: p, value:
|
|
733
|
+
render: ({ field: { onChange: p, value: g, onBlur: j } }) => /* @__PURE__ */ a(
|
|
734
734
|
G,
|
|
735
735
|
{
|
|
736
736
|
className: Y({
|
|
@@ -744,14 +744,14 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
744
744
|
onChange: p,
|
|
745
745
|
placeholder: e,
|
|
746
746
|
menuPortalTarget: document.body,
|
|
747
|
-
value:
|
|
747
|
+
value: g,
|
|
748
748
|
getOptionLabel: typeof i == "string" ? (w) => w[i] : i,
|
|
749
749
|
getOptionValue: (w) => w.id,
|
|
750
750
|
isDisabled: o,
|
|
751
751
|
menuPlacement: b,
|
|
752
752
|
closeMenuOnSelect: m
|
|
753
753
|
},
|
|
754
|
-
|
|
754
|
+
g ? JSON.stringify(g) : "reset"
|
|
755
755
|
)
|
|
756
756
|
}
|
|
757
757
|
);
|
|
@@ -803,8 +803,8 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
803
803
|
control: o,
|
|
804
804
|
watch: c,
|
|
805
805
|
reset: y,
|
|
806
|
-
formState: { errors:
|
|
807
|
-
} =
|
|
806
|
+
formState: { errors: f }
|
|
807
|
+
} = fe({
|
|
808
808
|
defaultValues: {
|
|
809
809
|
templateName: "",
|
|
810
810
|
subject: "",
|
|
@@ -816,7 +816,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
816
816
|
data: h,
|
|
817
817
|
refetch: b,
|
|
818
818
|
isLoading: m
|
|
819
|
-
} = Ce(), [u, p] = E([]), [
|
|
819
|
+
} = Ce(), [u, p] = E([]), [g, j] = E(), [w, M] = E(), { mutateAsync: re, isPending: _ } = Ee(), { mutateAsync: se, isPending: R } = je(), { data: D, isLoading: U } = Se(), [ie, ae] = E([]);
|
|
820
820
|
C(() => {
|
|
821
821
|
D && ae(Ie(D));
|
|
822
822
|
}, [D]), C(() => {
|
|
@@ -835,13 +835,13 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
835
835
|
let d = u.find((x) => x.id === c("template")?.id);
|
|
836
836
|
le(d);
|
|
837
837
|
}, [c("template")]), C(() => {
|
|
838
|
-
w &&
|
|
839
|
-
}, [w,
|
|
838
|
+
w && g ? (n(w), i("subject", w.subject ?? "")) : n(void 0);
|
|
839
|
+
}, [w, g, n]);
|
|
840
840
|
const oe = (d) => {
|
|
841
841
|
window.StripoEditorApi.actionsApi.getTemplateData(
|
|
842
842
|
async (x) => {
|
|
843
843
|
let H = d.template.id, F = "";
|
|
844
|
-
|
|
844
|
+
g?.readonly && (H = "", F = d.template.id);
|
|
845
845
|
const de = {
|
|
846
846
|
enerexIdentifier: "",
|
|
847
847
|
projectId: "",
|
|
@@ -863,7 +863,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
863
863
|
{
|
|
864
864
|
label: "Type",
|
|
865
865
|
control: o,
|
|
866
|
-
error:
|
|
866
|
+
error: f,
|
|
867
867
|
options: ie,
|
|
868
868
|
required: !0,
|
|
869
869
|
validation: {
|
|
@@ -880,11 +880,11 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
880
880
|
{
|
|
881
881
|
label: "Template",
|
|
882
882
|
control: o,
|
|
883
|
-
error:
|
|
883
|
+
error: f,
|
|
884
884
|
options: [
|
|
885
885
|
O,
|
|
886
886
|
...u.filter(
|
|
887
|
-
(d) => (d.type?.toString() === c("templateType")?.id || d.type === null) && c("templateType")?.id != null
|
|
887
|
+
(d) => (d.type?.toString() === c("templateType")?.id.toString() || d.type === null) && c("templateType")?.id != null
|
|
888
888
|
).map((d) => ({
|
|
889
889
|
id: d.id,
|
|
890
890
|
name: d.name
|
|
@@ -899,7 +899,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
899
899
|
{
|
|
900
900
|
label: "Name",
|
|
901
901
|
register: l,
|
|
902
|
-
error:
|
|
902
|
+
error: f,
|
|
903
903
|
required: !0,
|
|
904
904
|
name: "templateName",
|
|
905
905
|
validation: {
|
|
@@ -915,7 +915,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
915
915
|
{
|
|
916
916
|
label: "Subject",
|
|
917
917
|
register: l,
|
|
918
|
-
error:
|
|
918
|
+
error: f,
|
|
919
919
|
required: !1,
|
|
920
920
|
name: "subject"
|
|
921
921
|
}
|
|
@@ -943,7 +943,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
943
943
|
) : "Clear"
|
|
944
944
|
}
|
|
945
945
|
),
|
|
946
|
-
(c("templateType")?.id !== "2" || (
|
|
946
|
+
(c("templateType")?.id !== "2" || (g?.id ?? "") !== "") && /* @__PURE__ */ a(
|
|
947
947
|
z,
|
|
948
948
|
{
|
|
949
949
|
type: "submit",
|
|
@@ -960,7 +960,7 @@ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
|
|
|
960
960
|
className: "me-1",
|
|
961
961
|
children: /* @__PURE__ */ a("span", { className: "visually-hidden", children: "Loading..." })
|
|
962
962
|
}
|
|
963
|
-
) :
|
|
963
|
+
) : g?.readonly ? "Save as" : "Save"
|
|
964
964
|
}
|
|
965
965
|
)
|
|
966
966
|
] })
|
|
@@ -358,4 +358,4 @@
|
|
|
358
358
|
Copyright (c) 2018 Jed Watson.
|
|
359
359
|
Licensed under the MIT License (MIT), see
|
|
360
360
|
http://jedwatson.github.io/classnames
|
|
361
|
-
*/var K;function ae(){return K||(K=1,function(n){(function(){var s={}.hasOwnProperty;function l(){for(var t="",i=0;i<arguments.length;i++){var a=arguments[i];a&&(t=e(t,o(a)))}return t}function o(t){if(typeof t=="string"||typeof t=="number")return t;if(typeof t!="object")return"";if(Array.isArray(t))return l.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var i="";for(var a in t)s.call(t,a)&&t[a]&&(i=e(i,a));return i}function e(t,i){return i?t?t+" "+i:t+i:t}n.exports?(l.default=l,n.exports=l):window.classNames=l})()}(L)),L.exports}var de=ae();const z=oe(de),ce=({name:n="",control:s,options:l,multiple:o=!1,placeholder:e,validation:t,labelKey:i="name",disabled:a,isInvalid:m,value:v,onChange:b,uncontrolled:x,menuPlacement:C="auto",closeOnSelect:g=!0})=>{const y={control:u=>({...u,minHeight:"33px",borderColor:m?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:m?'url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23fa5c7c%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23fa5c7c%27 stroke=%27none%27/%3e%3c/svg%3e")':"none",backgroundRepeat:"no-repeat",backgroundPosition:"right calc(0.375em + 0.225rem) center",backgroundSize:"calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)","&:hover":{borderColor:m?"var(--bs-form-invalid-border-color)":"var(--ct-input-border-color)"},"& .react-select__single-value":{color:"var(--ct-input-color) !important"},"& .react-select__placeholder":{color:"var(--ct-input-placeholder-color) !important"},"& .react-select__indicators":{display:"none"}}),menu:u=>({...u,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:u=>({...u,zIndex:9999}),multiValueRemove:u=>({...u,display:a?"none":"block"})};return x?r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onChange:b,placeholder:e,menuPortalTarget:document.body,value:v,getOptionLabel:typeof i=="string"?u=>u[i]:i,getOptionValue:u=>u.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g}):r.jsx(O.Controller,{control:s,name:n,rules:t,render:({field:{onChange:u,value:h,onBlur:P}})=>r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onBlur:P,onChange:u,placeholder:e,menuPortalTarget:document.body,value:h,getOptionLabel:typeof i=="string"?E=>E[i]:i,getOptionValue:E=>E.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g},h?JSON.stringify(h):"reset")})},G=({label:n,name:s,validation:l,control:o,error:e,...t})=>r.jsxs(c.Form.Group,{className:"mb-1",children:[n&&r.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",t.required&&r.jsx("span",{className:"text-danger",children:"*"})]}),r.jsx(ce,{control:o,options:t.options??[],validation:l,isInvalid:e&&!!e[s],name:s}),e&&e[s]?r.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[s].message}):null]}),pe=()=>{const n=I();w.useQueryClient();const{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["saveTemplate"],mutationFn:async e=>(e.enerexIdentifier=s??"",e.projectId=l??"",await n.post(`${_.SaveTemplate}`,e))})},k={id:"",name:"New (Blank)"},me=({onSelectItem:n,templateLoading:s,onReset:l})=>{const{register:o,handleSubmit:e,clearErrors:t,setValue:i,control:a,watch:m,reset:v,formState:{errors:b}}=O.useForm({defaultValues:{templateName:"",subject:"",templateType:void 0,template:k},mode:"onChange"}),{data:x,refetch:C,isLoading:g}=re(),[y,u]=d.useState([]),[h,P]=d.useState(),[E,W]=d.useState(),{mutateAsync:fe,isPending:N}=le(),{mutateAsync:ge,isPending:A}=pe(),{data:$,isLoading:B}=ie(),[ye,he]=d.useState([]);d.useEffect(()=>{$&&he(se($))},[$]),d.useEffect(()=>{s(!!N)},[N]),d.useEffect(()=>{u(x??[])},[x]);const be=async p=>{P(p),p?(i("templateName",p?.name),t()):(i("templateName",""),i("subject",""));const S=await fe({id:p?.id});W(S||void 0)};d.useEffect(()=>{i("template",k)},[m("templateType")]),d.useEffect(()=>{let p=y.find(S=>S.id===m("template")?.id);be(p)},[m("template")]),d.useEffect(()=>{E&&h?(n(E),i("subject",E.subject??"")):n(void 0)},[E,h,n]);const we=p=>{window.StripoEditorApi.actionsApi.getTemplateData(async S=>{let Y=p.template.id,X="";h?.readonly&&(Y="",X=p.template.id);const Te={enerexIdentifier:"",projectId:"",templateId:Y,templateType:p.templateType.id,name:p.templateName,html:S.html,css:S.css,subject:p.templateType.id==="2"?p?.subject??"":"",parent_id:X};await ge(Te)&&(t(),v(),C())})};return r.jsx(c.Card,{className:"border border-0 text-start",children:r.jsx(c.Card.Body,{className:"pe-0 ps-2",children:r.jsx("form",{onSubmit:e(we),children:r.jsx("div",{className:"template-list-container gap-3",children:r.jsxs(c.Row,{children:[r.jsx(c.Col,{children:r.jsx(G,{label:"Type",control:a,error:b,options:ye,required:!0,validation:{required:{value:!0,message:"Select a type"}},...o("templateType")})}),r.jsx(c.Col,{children:r.jsx(G,{label:"Template",control:a,error:b,options:[k,...y.filter(p=>(p.type?.toString()===m("templateType")?.id||p.type===null)&&m("templateType")?.id!=null).map(p=>({id:p.id,name:p.name}))],required:!1,...o("template")})}),r.jsx(c.Col,{children:r.jsx(V,{label:"Name",register:o,error:b,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),m("templateType")?.id==="2"&&r.jsx(c.Col,{children:r.jsx(V,{label:"Subject",register:o,error:b,required:!1,name:"subject"})}),r.jsxs(c.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[r.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:g||N||A||B,onClick:()=>{P(void 0),v(),l()},children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),(m("templateType")?.id!=="2"||(h?.id??"")!=="")&&r.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:g||N||A||B,children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):h?.readonly?"Save as":"Save"})]})]})})})})})},ue=({config:n})=>{const[s,l]=d.useState(),[o,e]=d.useState(!1),t=a=>{l(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??j,a?.css??"","")},i=()=>{e(!1),l(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(j,"","")};return r.jsx(J,{configs:n,children:r.jsx(Z,{children:r.jsxs("div",{className:"root-widget",children:[r.jsx(me,{templateLoading:e,onSelectItem:t,onReset:i}),r.jsx(ne,{templateHTML:{css:s?.css??"",html:s?.html??j},loading:o,className:"col-span-5"})]})})})};f.EditorWidget=ue,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
|
|
361
|
+
*/var K;function ae(){return K||(K=1,function(n){(function(){var s={}.hasOwnProperty;function l(){for(var t="",i=0;i<arguments.length;i++){var a=arguments[i];a&&(t=e(t,o(a)))}return t}function o(t){if(typeof t=="string"||typeof t=="number")return t;if(typeof t!="object")return"";if(Array.isArray(t))return l.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var i="";for(var a in t)s.call(t,a)&&t[a]&&(i=e(i,a));return i}function e(t,i){return i?t?t+" "+i:t+i:t}n.exports?(l.default=l,n.exports=l):window.classNames=l})()}(L)),L.exports}var de=ae();const z=oe(de),ce=({name:n="",control:s,options:l,multiple:o=!1,placeholder:e,validation:t,labelKey:i="name",disabled:a,isInvalid:m,value:v,onChange:b,uncontrolled:x,menuPlacement:C="auto",closeOnSelect:g=!0})=>{const y={control:u=>({...u,minHeight:"33px",borderColor:m?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:m?'url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23fa5c7c%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23fa5c7c%27 stroke=%27none%27/%3e%3c/svg%3e")':"none",backgroundRepeat:"no-repeat",backgroundPosition:"right calc(0.375em + 0.225rem) center",backgroundSize:"calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)","&:hover":{borderColor:m?"var(--bs-form-invalid-border-color)":"var(--ct-input-border-color)"},"& .react-select__single-value":{color:"var(--ct-input-color) !important"},"& .react-select__placeholder":{color:"var(--ct-input-placeholder-color) !important"},"& .react-select__indicators":{display:"none"}}),menu:u=>({...u,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:u=>({...u,zIndex:9999}),multiValueRemove:u=>({...u,display:a?"none":"block"})};return x?r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onChange:b,placeholder:e,menuPortalTarget:document.body,value:v,getOptionLabel:typeof i=="string"?u=>u[i]:i,getOptionValue:u=>u.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g}):r.jsx(O.Controller,{control:s,name:n,rules:t,render:({field:{onChange:u,value:h,onBlur:P}})=>r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onBlur:P,onChange:u,placeholder:e,menuPortalTarget:document.body,value:h,getOptionLabel:typeof i=="string"?E=>E[i]:i,getOptionValue:E=>E.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g},h?JSON.stringify(h):"reset")})},G=({label:n,name:s,validation:l,control:o,error:e,...t})=>r.jsxs(c.Form.Group,{className:"mb-1",children:[n&&r.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",t.required&&r.jsx("span",{className:"text-danger",children:"*"})]}),r.jsx(ce,{control:o,options:t.options??[],validation:l,isInvalid:e&&!!e[s],name:s}),e&&e[s]?r.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[s].message}):null]}),pe=()=>{const n=I();w.useQueryClient();const{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["saveTemplate"],mutationFn:async e=>(e.enerexIdentifier=s??"",e.projectId=l??"",await n.post(`${_.SaveTemplate}`,e))})},k={id:"",name:"New (Blank)"},me=({onSelectItem:n,templateLoading:s,onReset:l})=>{const{register:o,handleSubmit:e,clearErrors:t,setValue:i,control:a,watch:m,reset:v,formState:{errors:b}}=O.useForm({defaultValues:{templateName:"",subject:"",templateType:void 0,template:k},mode:"onChange"}),{data:x,refetch:C,isLoading:g}=re(),[y,u]=d.useState([]),[h,P]=d.useState(),[E,W]=d.useState(),{mutateAsync:fe,isPending:N}=le(),{mutateAsync:ge,isPending:A}=pe(),{data:$,isLoading:B}=ie(),[ye,he]=d.useState([]);d.useEffect(()=>{$&&he(se($))},[$]),d.useEffect(()=>{s(!!N)},[N]),d.useEffect(()=>{u(x??[])},[x]);const be=async p=>{P(p),p?(i("templateName",p?.name),t()):(i("templateName",""),i("subject",""));const S=await fe({id:p?.id});W(S||void 0)};d.useEffect(()=>{i("template",k)},[m("templateType")]),d.useEffect(()=>{let p=y.find(S=>S.id===m("template")?.id);be(p)},[m("template")]),d.useEffect(()=>{E&&h?(n(E),i("subject",E.subject??"")):n(void 0)},[E,h,n]);const we=p=>{window.StripoEditorApi.actionsApi.getTemplateData(async S=>{let Y=p.template.id,X="";h?.readonly&&(Y="",X=p.template.id);const Te={enerexIdentifier:"",projectId:"",templateId:Y,templateType:p.templateType.id,name:p.templateName,html:S.html,css:S.css,subject:p.templateType.id==="2"?p?.subject??"":"",parent_id:X};await ge(Te)&&(t(),v(),C())})};return r.jsx(c.Card,{className:"border border-0 text-start",children:r.jsx(c.Card.Body,{className:"pe-0 ps-2",children:r.jsx("form",{onSubmit:e(we),children:r.jsx("div",{className:"template-list-container gap-3",children:r.jsxs(c.Row,{children:[r.jsx(c.Col,{children:r.jsx(G,{label:"Type",control:a,error:b,options:ye,required:!0,validation:{required:{value:!0,message:"Select a type"}},...o("templateType")})}),r.jsx(c.Col,{children:r.jsx(G,{label:"Template",control:a,error:b,options:[k,...y.filter(p=>(p.type?.toString()===m("templateType")?.id.toString()||p.type===null)&&m("templateType")?.id!=null).map(p=>({id:p.id,name:p.name}))],required:!1,...o("template")})}),r.jsx(c.Col,{children:r.jsx(V,{label:"Name",register:o,error:b,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),m("templateType")?.id==="2"&&r.jsx(c.Col,{children:r.jsx(V,{label:"Subject",register:o,error:b,required:!1,name:"subject"})}),r.jsxs(c.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[r.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:g||N||A||B,onClick:()=>{P(void 0),v(),l()},children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),(m("templateType")?.id!=="2"||(h?.id??"")!=="")&&r.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:g||N||A||B,children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):h?.readonly?"Save as":"Save"})]})]})})})})})},ue=({config:n})=>{const[s,l]=d.useState(),[o,e]=d.useState(!1),t=a=>{l(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??j,a?.css??"","")},i=()=>{e(!1),l(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(j,"","")};return r.jsx(J,{configs:n,children:r.jsx(Z,{children:r.jsxs("div",{className:"root-widget",children:[r.jsx(me,{templateLoading:e,onSelectItem:t,onReset:i}),r.jsx(ne,{templateHTML:{css:s?.css??"",html:s?.html??j},loading:o,className:"col-span-5"})]})})})};f.EditorWidget=ue,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
|
|
@@ -6,13 +6,10 @@ export type HasId = {
|
|
|
6
6
|
export type HasName = {
|
|
7
7
|
name: string;
|
|
8
8
|
};
|
|
9
|
-
export type HasGroup = {
|
|
10
|
-
group?: string;
|
|
11
|
-
};
|
|
12
9
|
export type HasExternalId = {
|
|
13
10
|
externalId: string;
|
|
14
11
|
};
|
|
15
|
-
export type BasicEntity = HasId & HasName
|
|
12
|
+
export type BasicEntity = HasId & HasName;
|
|
16
13
|
interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
|
|
17
14
|
label?: string;
|
|
18
15
|
name: string;
|