text: (this["webpackJsonprefactoring-classes-ts"]=this["webpackJsonprefactoring-classes-ts"]||[]).push([[0],{88:function(n,e,t){"use strict";t.r(e);var a,c=t(0),i=t.n(c),r=t(27),o=t.n(r),s=t(28),d=t(2),l=t(49),p=t(13),b=t(4),u=t.n(b),x=t(12),j=t(10),f=t(14),h=t(5),O=t(6),g=O.c.div(a||(a=Object(h.a)(["\n  background: #c72828;\n  padding: 30px 0;\n\n  header {\n    width: 1280px;\n    margin: 0 auto;\n    padding: 0 0 160px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    nav {\n      div {\n        button {\n          font-weight: 600;\n          border-radius: 8px;\n          border: 0;\n          background: #39b100;\n          color: #fff;\n\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n\n          .text {\n            padding: 16px 24px;\n          }\n\n          .icon {\n            display: flex;\n            padding: 16px 16px;\n            background: #41c900;\n            border-radius: 0 8px 8px 0;\n            margin: 0 auto;\n          }\n        }\n      }\n    }\n  }\n"]))),m=t.p+"static/media/logo.5ee7d69c.svg",v=t(1);function w(n){var e=n.openModal;return Object(v.jsx)(g,{children:Object(v.jsxs)("header",{children:[Object(v.jsx)("img",{src:m,alt:"GoRestaurant"}),Object(v.jsx)("nav",{children:Object(v.jsx)("div",{children:Object(v.jsxs)("button",{type:"button",onClick:e,children:[Object(v.jsx)("div",{className:"text",children:"Novo Prato"}),Object(v.jsx)("div",{className:"icon",children:Object(v.jsx)(f.c,{size:24})})]})})})]})})}var y,k,F=t(47),N=t.n(F).a.create({baseURL:"http://localhost:8080"}),z=O.c.div(y||(y=Object(h.a)(["\n  background: #f0f0f5;\n  border-radius: 8px;\n\n  header {\n    background: #ffb84d;\n    border-radius: 8px 8px 0px 0px;\n    height: 192px;\n    overflow: hidden;\n    transition: 0.3s opacity;\n    text-align: center;\n\n    ",";\n\n    img {\n      pointer-events: none;\n      user-select: none;\n    }\n  }\n\n  section.body {\n    padding: 30px;\n\n    h2 {\n      color: #3d3d4d;\n    }\n\n    p {\n      color: #3d3d4d;\n\n      margin-top: 16px;\n    }\n\n    .price {\n      font-style: normal;\n      font-size: 24px;\n      line-height: 34px;\n      color: #39b100;\n\n      b {\n        font-weight: 600;\n      }\n    }\n  }\n\n  section.footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    padding: 20px 30px;\n    background: #e4e4eb;\n    border-radius: 0px 0px 8px 8px;\n\n    div.icon-container {\n      display: flex;\n\n      button {\n        background: #fff;\n        padding: 10px;\n        border-radius: 8px;\n        display: flex;\n        border: none;\n        transition: 0.1s;\n\n        svg {\n          color: #3d3d4d;\n        }\n\n        & + button {\n          margin-left: 6px;\n        }\n      }\n    }\n\n    div.availability-container {\n      display: flex;\n      align-items: center;\n\n      p {\n        color: #3d3d4d;\n      }\n\n      .switch {\n        position: relative;\n        display: inline-block;\n        width: 88px;\n        height: 32px;\n        margin-left: 12px;\n\n        & input {\n          opacity: 0;\n          width: 0;\n          height: 0;\n        }\n\n        .slider {\n          position: absolute;\n          cursor: pointer;\n          top: 0;\n          left: 0;\n          right: 0;\n          bottom: 0;\n          background-color: #c72828;\n          -webkit-transition: 0.4s;\n          transition: 0.4s;\n          border-radius: 16px;\n\n          &:before {\n            position: absolute;\n            content: '';\n            height: 20px;\n            width: 40px;\n            left: 8px;\n            bottom: 6px;\n            background-color: white;\n            -webkit-transition: 0.4s;\n            transition: 0.4s;\n            border-radius: 10px;\n          }\n        }\n\n        input:checked + .slider {\n          background-color: #39b100;\n        }\n\n        input:focus + .slider {\n          box-shadow: 0 0 1px #2196f3;\n        }\n\n        input:checked + .slider:before {\n          -webkit-transform: translateX(32px);\n          -ms-transform: translateX(32px);\n          transform: translateX(32px);\n        }\n      }\n    }\n  }\n"])),(function(n){return!n.available&&Object(O.b)(k||(k=Object(h.a)(["\n        opacity: 0.3;\n      "])))}));function C(n){var e=n.food,t=n.handleEditFood,a=n.handleDelete,i=e.available,r=Object(c.useState)(i),o=Object(j.a)(r,2),s=o[0],d=o[1],l=function(){var n=Object(x.a)(u.a.mark((function n(){return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return n.next=2,N.put("/foods/".concat(e.id),Object(p.a)(Object(p.a)({},e),{},{available:!s}));case 2:d(!s);case 3:case"end":return n.stop()}}),n)})));return function(){return n.apply(this,arguments)}}();return Object(v.jsxs)(z,{available:s,children:[Object(v.jsx)("header",{children:Object(v.jsx)("img",{src:e.image,alt:e.name})}),Object(v.jsxs)("section",{className:"body",children:[Object(v.jsx)("h2",{children:e.name}),Object(v.jsx)("p",{children:e.description}),Object(v.jsxs)("p",{className:"price",children:["R$ ",Object(v.jsx)("b",{children:e.price})]})]}),Object(v.jsxs)("section",{className:"footer",children:[Object(v.jsxs)("div",{className:"icon-container",children:[Object(v.jsx)("button",{type:"button",className:"icon",onClick:function(){t(e)},"data-testid":"edit-food-".concat(e.id),children:Object(v.jsx)(f.b,{size:20})}),Object(v.jsx)("button",{type:"button",className:"icon",onClick:function(){return a(e.id)},"data-testid":"remove-food-".concat(e.id),children:Object(v.jsx)(f.d,{size:20})})]}),Object(v.jsxs)("div",{className:"availability-container",children:[Object(v.jsx)("p",{children:s?"Dispon\xedvel":"Indispon\xedvel"}),Object(v.jsxs)("label",{htmlFor:"available-switch-".concat(e.id),className:"switch",children:[Object(v.jsx)("input",{id:"available-switch-".concat(e.id),type:"checkbox",checked:s,onChange:l,"data-testid":"change-status-food-".concat(e.id)}),Object(v.jsx)("span",{className:"slider"})]})]})]})]})}var E,I=t(23),S=Object(O.c)(I.a)(E||(E=Object(h.a)(["\n  padding: 48px 40px;\n  display: flex;\n  flex-direction: column;\n\n  h1 {\n    font-weight: 600;\n    font-size: 36px;\n    line-height: 36px;\n    margin-bottom: 40px;\n  }\n\n  button {\n    margin-top: 48px;\n    align-self: flex-end;\n  }\n\n  button {\n    font-weight: 600;\n    border-radius: 8px;\n    border: 0;\n    background: #39b100;\n    color: #fff;\n\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n\n    .text {\n      padding: 16px 24px;\n    }\n\n    .icon {\n      display: flex;\n      padding: 16px 16px;\n      background: #41c900;\n      border-radius: 0 8px 8px 0;\n      margin: 0 auto;\n    }\n  }\n"]))),R=t(48),D=t.n(R);function P(n){var e=n.isOpen,t=n.setIsOpen,a=n.children,i=Object(c.useState)(e),r=Object(j.a)(i,2),o=r[0],s=r[1];return Object(c.useEffect)((function(){s(e)}),[e]),Object(v.jsx)(D.a,{shouldCloseOnOverlayClick:!0,onRequestClose:t,isOpen:o,ariaHideApp:!1,style:{content:{top:"50%",left:"50%",right:"auto",bottom:"auto",marginRight:"-50%",transform:"translate(-50%, -50%)",background:"#F0F0F5",color:"#000000",borderRadius:"8px",width:"736px",border:"none"},overlay:{backgroundColor:"#121214e6"}},children:a})}var M,A,q,U,X=t(50),B=t(21),J=O.c.div(M||(M=Object(h.a)(["\n  display: flex;\n  align-items: center;\n\n  background: #fff;\n  border-radius: 8px;\n  padding: 18px 24px;\n  width: 100%;\n  font-size: 16px;\n\n  & + div {\n    margin-top: 24px;\n  }\n\n  h1 {\n    margin-bottom: 40px;\n    font-weight: 600;\n    font-size: 36px;\n    line-height: 36px;\n  }\n\n  ","\n\n  ","\n\n  input {\n    flex: 1;\n    background: transparent;\n    border: 0;\n    color: #b7b7cc;\n\n    &::placeholder {\n      color: #b7b7cc;\n    }\n  }\n\n  svg {\n    margin-right: 16px;\n  }\n"])),(function(n){return n.isFocused&&Object(O.b)(A||(A=Object(h.a)(["\n      color: #ff9000;\n      border-color: #ff9000;\n    "])))}),(function(n){return n.isFilled&&Object(O.b)(q||(q=Object(h.a)(["\n      color: #ff9000;\n    "])))})),V=function(n){var e=n.name,t=n.icon,a=Object(X.a)(n,["name","icon"]),i=Object(c.useRef)(null),r=Object(c.useState)(!1),o=Object(j.a)(r,2),s=o[0],d=o[1],l=Object(c.useState)(!1),b=Object(j.a)(l,2),u=b[0],x=b[1],f=Object(B.c)(e),h=f.fieldName,O=f.defaultValue,g=f.registerField,m=Object(c.useCallback)((function(){d(!0)}),[]),w=Object(c.useCallback)((function(){var n;d(!1),x(!!(null===(n=i.current)||void 0===n?void 0:n.value))}),[]);return Object(c.useEffect)((function(){g({name:h,ref:i.current,path:"value"})}),[h,g]),Object(v.jsxs)(J,{isFilled:u,isFocused:s,children:[t&&Object(v.jsx)(t,{size:20}),Object(v.jsx)("input",Object(p.a)({onFocus:m,onBlur:w,defaultValue:O,ref:i},a))]})};function G(n){var e=n.isOpen,t=n.setIsOpen,a=n.handleAddFood,i=function(){var n=Object(x.a)(u.a.mark((function n(e){return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:a(e),t();case 2:case"end":return n.stop()}}),n)})));return function(e){return n.apply(this,arguments)}}(),r=Object(c.useRef)(null);return Object(v.jsx)(P,{isOpen:e,setIsOpen:t,children:Object(v.jsxs)(S,{ref:r,onSubmit:i,children:[Object(v.jsx)("h1",{children:"Novo Prato"}),Object(v.jsx)(V,{name:"image",placeholder:"Cole o link aqui"}),Object(v.jsx)(V,{name:"name",placeholder:"Ex: Moda Italiana"}),Object(v.jsx)(V,{name:"price",placeholder:"Ex: 19.90"}),Object(v.jsx)(V,{name:"description",placeholder:"Descri\xe7\xe3o"}),Object(v.jsxs)("button",{type:"submit","data-testid":"add-food-button",children:[Object(v.jsx)("p",{className:"text",children:"Adicionar Prato"}),Object(v.jsx)("div",{className:"icon",children:Object(v.jsx)(f.a,{size:24})})]})]})})}var H,L=Object(O.c)(I.a)(U||(U=Object(h.a)(["\n  padding: 48px 40px;\n  display: flex;\n  flex-direction: column;\n\n  h1 {\n    font-weight: 600;\n    font-size: 36px;\n    line-height: 36px;\n    margin-bottom: 40px;\n  }\n\n  button {\n    margin-top: 48px;\n    align-self: flex-end;\n  }\n\n  button {\n    font-weight: 600;\n    border-radius: 8px;\n    border: 0;\n    background: #39b100;\n    color: #fff;\n\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n\n    .text {\n      padding: 16px 24px;\n    }\n\n    .icon {\n      display: flex;\n      padding: 16px 16px;\n      background: #41c900;\n      border-radius: 0 8px 8px 0;\n      margin: 0 auto;\n    }\n  }\n"])));function $(n){var e=n.isOpen,t=n.setIsOpen,a=n.handleUpdateFood,i=n.editingFood,r=Object(c.useRef)(null),o=function(){var n=Object(x.a)(u.a.mark((function n(e){return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:a(e),t();case 2:case"end":return n.stop()}}),n)})));return function(e){return n.apply(this,arguments)}}();return Object(v.jsx)(P,{isOpen:e,setIsOpen:t,children:Object(v.jsxs)(L,{ref:r,onSubmit:o,initialData:i,children:[Object(v.jsx)("h1",{children:"Editar Prato"}),Object(v.jsx)(V,{name:"image",placeholder:"Cole o link aqui"}),Object(v.jsx)(V,{name:"name",placeholder:"Ex: Moda Italiana"}),Object(v.jsx)(V,{name:"price",placeholder:"Ex: 19.90"}),Object(v.jsx)(V,{name:"description",placeholder:"Descri\xe7\xe3o"}),Object(v.jsxs)("button",{type:"submit","data-testid":"edit-food-button",children:[Object(v.jsx)("div",{className:"text",children:"Editar Prato"}),Object(v.jsx)("div",{className:"icon",children:Object(v.jsx)(f.a,{size:24})})]})]})})}var K=O.c.div(H||(H=Object(h.a)(["\n  width: 100%;\n  max-width: 1280px;\n  margin: 0 auto;\n  padding: 40px 0;\n  margin-top: -140px;\n\n  display: grid;\n\n  grid-template-columns: repeat(3, 1fr);\n  grid-gap: 32px;\n"])));function Q(){var n=Object(c.useState)([]),e=Object(j.a)(n,2),t=e[0],a=e[1],i=Object(c.useState)({}),r=Object(j.a)(i,2),o=r[0],s=r[1],d=Object(c.useState)(!1),b=Object(j.a)(d,2),f=b[0],h=b[1],O=Object(c.useState)(!1),g=Object(j.a)(O,2),m=g[0],y=g[1];function k(){return(k=Object(x.a)(u.a.mark((function n(e){var c;return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return n.prev=0,n.next=3,N.post("/foods",Object(p.a)(Object(p.a)({},e),{},{available:!0}));case 3:c=n.sent,a([].concat(Object(l.a)(t),[c.data])),n.next=10;break;case 7:n.prev=7,n.t0=n.catch(0),console.log(n.t0);case 10:case"end":return n.stop()}}),n,null,[[0,7]])})))).apply(this,arguments)}Object(c.useEffect)((function(){function n(){return(n=Object(x.a)(u.a.mark((function n(){var e;return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return n.next=2,N.get("/foods");case 2:e=n.sent,a(e.data);case 4:case"end":return n.stop()}}),n)})))).apply(this,arguments)}!function(){n.apply(this,arguments)}()}),[]);var F=function(){var n=Object(x.a)(u.a.mark((function n(e){var c,i;return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return n.prev=0,n.next=3,N.put("/foods/".concat(o.id),Object(p.a)(Object(p.a)({},o),e));case 3:c=n.sent,i=t.map((function(n){return n.id!==c.data.id?n:c.data})),a(i),n.next=11;break;case 8:n.prev=8,n.t0=n.catch(0),console.log(n.t0);case 11:case"end":return n.stop()}}),n,null,[[0,8]])})));return function(e){return n.apply(this,arguments)}}(),z=function(){var n=Object(x.a)(u.a.mark((function n(e){var c;return u.a.wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return n.next=2,N.delete("/foods/".concat(e));case 2:c=t.filter((function(n){return n.id!==e})),a(c);case 4:case"end":return n.stop()}}),n)})));return function(e){return n.apply(this,arguments)}}(),E=function(){h(!f)},I=function(n){y(!0),s(n)};return Object(v.jsxs)(v.Fragment,{children:[Object(v.jsx)(w,{openModal:E}),Object(v.jsx)(G,{isOpen:f,setIsOpen:E,handleAddFood:function(n){return k.apply(this,arguments)}}),Object(v.jsx)($,{isOpen:m,setIsOpen:function(){y(!m)},editingFood:o,handleUpdateFood:F}),Object(v.jsx)(K,{"data-testid":"foods-list",children:t&&t.map((function(n){return Object(v.jsx)(C,{food:n,handleDelete:z,handleEditFood:I},n.id)}))})]})}var T,W=function(){return Object(v.jsx)(d.c,{children:Object(v.jsx)(d.a,{path:"/",exact:!0,component:Q})})},Y=Object(O.a)(T||(T=Object(h.a)(["\n  * {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n    outline: 0;\n  }\n\n  body {\n    background: #fff;\n    color: #FFF;\n    -webkit-font-smoothing: antialiased;\n  }\n\n  body, input, button {\n    font-family: 'Poppins', sans-serif;\n    font-size: 16px;\n  }\n\n  h1, h2, h3, h4, h5, h6, strong {\n    font-weight: 500;\n  }\n\n  button {\n    cursor: pointer;\n  }\n"]))),Z=function(){return Object(v.jsxs)(v.Fragment,{children:[Object(v.jsx)(Y,{}),Object(v.jsx)(s.a,{children:Object(v.jsx)(W,{})})]})};o.a.render(Object(v.jsx)(i.a.StrictMode,{children:Object(v.jsx)(Z,{})}),document.getElementById("root"))}},[[88,1,2]]]);
  //# sourceMappingURL=main.be2a7f83.chunk.js.map