(this.webpackJsonppuhelinluettelo=this.webpackJsonppuhelinluettelo||[]).push([[0],{14:function(e,n,t){e.exports=t(37)},19:function(e,n,t){},37:function(e,n,t){"use strict";t.r(n);var a=t(0),o=t.n(a),r=t(13),l=t.n(r),u=(t(19),t(2)),c=function(e){var n=e.person,t=e.deletePerson;return o.a.createElement("p",null,n.name,n.number,o.a.createElement("button",{onClick:t},"delete"))},i=function(e){var n=e.persons,t=e.filter,a=e.deletePerson,r=n;t&&(r=r.filter((function(e){return e.name.toLowerCase().includes(t.toLowerCase())})));return console.log("filteredPersons",r),o.a.createElement("ul",null,r.map((function(e){return o.a.createElement(c,{key:e.name,person:e,number:e.number,deletePerson:function(){return a(e.id)}})})))},s=function(e){var n=e.handleFilterChange;return o.a.createElement("div",null,"filter shown with:",o.a.createElement("input",{type:"text",onChange:n}))},m=function(e){var n=e.onSubmit,t=e.handlePersonChange,a=e.handleNumberChange;return o.a.createElement("form",{onSubmit:n},"name:",o.a.createElement("input",{onChange:t}),o.a.createElement("br",null),"number:",o.a.createElement("input",{onChange:a}),o.a.createElement("br",null),o.a.createElement("button",{type:"submit"},"Add"))},f=function(e){var n=e.notification,t=n.message,a=n.type;return null===t?null:"notification"===a?o.a.createElement("div",{className:"notification"},t):"error"===a?o.a.createElement("div",{className:"error"},t):void 0},d=t(3),h=t.n(d),p="/api/persons",b=function(){return h.a.get(p).then((function(e){return e.data}))},g=function(e){return h.a.post(p,e).then((function(e){return e.data}))},v=function(e){return h.a.delete("".concat(p,"/").concat(e))},E=function(){var e=Object(a.useState)([]),n=Object(u.a)(e,2),t=n[0],r=n[1],l=Object(a.useState)(""),c=Object(u.a)(l,2),d=c[0],h=c[1],p=Object(a.useState)(""),E=Object(u.a)(p,2),w=E[0],y=E[1],C=Object(a.useState)(""),j=Object(u.a)(C,2),O=j[0],k=j[1],P=Object(a.useState)({message:null,type:null}),S=Object(u.a)(P,2),N=S[0],L=S[1];Object(a.useEffect)((function(){b().then((function(e){r(e)}))}),[]);return o.a.createElement("div",null,o.a.createElement("h2",null,"Phonebook"),o.a.createElement(f,{notification:N}),o.a.createElement(s,{handleFilterChange:function(e){console.log(e.target.value),k(e.target.value)}}),o.a.createElement("h3",null,"add a new"),o.a.createElement(m,{onSubmit:function(e){e.preventDefault();var n={name:d,number:w};if(function(e,n){for(var t in e)if(e[t].name.toLowerCase()===n.toLowerCase())return!0;return!1}(t,n.name)){var a={message:"Name '".concat(n.name,"' is already added to the phonebook"),type:"error"};L(a)}setTimeout((function(){L({message:null,type:null})}),5e3),g(n).then((function(e){var a={message:"Added '".concat(n.name,"' to the phonebook"),type:"notification"};L(a),r(t.concat(e))})),setTimeout((function(){L({message:null,type:null})}),5e3)},handlePersonChange:function(e){console.log(e.target.value),h(e.target.value)},handleNumberChange:function(e){console.log(e.target.value),y(e.target.value)}}),o.a.createElement("h3",null,"Numbers"),o.a.createElement(i,{persons:t,filter:O,deletePerson:function(e){var n=t.findIndex((function(n){return n.id===e}));window.confirm("Delete '".concat(t[n].name,"'?"))&&(v(e).then((function(){var a={message:"Deleted '".concat(t[n].name,"' from the phonebook"),type:"notification"};L(a),r(t.filter((function(n){return n.id!==e})))})),setTimeout((function(){L({message:null,type:null})}),5e3))}}))};Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));l.a.render(o.a.createElement(E,null),document.getElementById("root")),"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}},[[14,1,2]]]);
//# sourceMappingURL=main.b898758d.chunk.js.map