text: (this["webpackJsonpemployee-directory"]=this["webpackJsonpemployee-directory"]||[]).push([[0],{16:function(e,a,t){e.exports=t(38)},3:function(e,a,t){},38:function(e,a,t){"use strict";t.r(a);var n=t(0),l=t.n(n),r=t(14),c=t.n(r);t(3);var o=function(){return l.a.createElement("div",{className:"jumbotron jumbotron-fluid"},l.a.createElement("div",{className:"container"},l.a.createElement("h1",{className:"jumbotron-text"},"Employee Directory ",l.a.createElement("i",{className:"fas fa-users"}))))};var s=function(){return l.a.createElement("div",null,l.a.createElement("hr",{className:"section-spacing"}))};var m=function(){return l.a.createElement("div",null,l.a.createElement("footer",{className:"page-footer fixed-bottom"},l.a.createElement("div",{className:"footer-copyright"},"\xa9 2020 Copyright:",l.a.createElement("a",{className:"link-name",href:"https://github.com/CrainDavis"}," Chyna Davis"))))},i=t(1),u=t(4),p=t(15),d=t.n(p),f=function(){return d.a.get("https://randomuser.me/api/?results=200&nat=us")};var b=function(e){return l.a.createElement("div",Object.assign({className:"row".concat(e.fluid?"-fluid":"")},e))};var E=function(e){var a=e.size.split(" ").map((function(e){return"col-"+e})).join(" ");return l.a.createElement("div",Object.assign({className:a},e))},y=l.a.createContext({}),v=function(){var e=Object(n.useContext)(y);return l.a.createElement("div",null,l.a.createElement(b,{className:"no-gutters"},l.a.createElement(E,{size:"12"},l.a.createElement("div",{className:"control-panel d-flex justify-content-center"},l.a.createElement("div",{className:"control-panel-subsection"},l.a.createElement("h4",{className:"control-labels"},"sort employees by:"),l.a.createElement("div",{className:"btn-group sort-btns",role:"group","aria-label":"Basic example"},e.employeeState.buttonLabels.map((function(a){var t=a.name;return l.a.createElement("button",{type:"button",key:t,className:"btn btn-outline-light btn-secondary btn-lg",onClick:function(){e.handleSort(t)}},t)})))),l.a.createElement("div",{className:"control-panel-subsection"},l.a.createElement("h4",{className:"control-labels"},"filter employees by:"),l.a.createElement("div",{className:"input-group input-group-lg"},l.a.createElement("input",{disabled:""!==e.inputObject.location||""!==e.inputObject.username,id:"nameInput",value:e.inputObject.name,type:"text",className:"form-control",placeholder:"full name",onChange:function(a){return e.handleNameSearchChange(a)}}),l.a.createElement("p",{className:"filter-or"},"or"),l.a.createElement("input",{disabled:""!==e.inputObject.name||""!==e.inputObject.username,id:"locationInput",value:e.inputObject.location,type:"text",className:"form-control",placeholder:"location",onChange:function(a){return e.handleLocationSearchChange(a)}}),l.a.createElement("p",{className:"filter-or"},"or"),l.a.createElement("input",{disabled:""!==e.inputObject.name||""!==e.inputObject.location,id:"usernameInput",value:e.inputObject.username,type:"text",className:"form-control",placeholder:"username",onChange:function(a){return e.handleUsernameSearchChange(a)}})))))))};var g=function(){var e=Object(n.useContext)(y);function a(e){var a=e.split("-");return a[0]+" "+a[1]+"-"+a[2]}return l.a.createElement("div",null,l.a.createElement("ul",{className:"employee-list"},void 0!==e.employeeState.filteredEmployees[0]&&void 0!==e.employeeState.filteredEmployees[0].name?e.employeeState.filteredEmployees.map((function(e){var t=e.login,n=e.name,r=e.picture,c=e.phone,o=e.cell,s=e.email,m=e.dob,i=e.location;return l.a.createElement("li",{key:t.uuid,className:"employee-card"},l.a.createElement(b,null,l.a.createElement(E,{size:"2"},l.a.createElement("img",{className:"employee-img",src:r.large,alt:n.first+"-"+n.last+"-img"})),l.a.createElement(E,{size:"10"},l.a.createElement(b,null,l.a.createElement(E,{size:"5"},l.a.createElement("p",{className:"employee-fullName"},l.a.createElement("span",{className:"name-tag"},n.first+" "+n.last))),l.a.createElement(E,{size:"3"},l.a.createElement("p",{className:"employee-username"},l.a.createElement("i",{className:"data-label fas fa-user"})," ",t.username)),l.a.createElement(E,{size:"4"},l.a.createElement("p",{className:"employee-dob"},l.a.createElement("i",{className:"data-label fas fa-birthday-cake"})," ",function(e){var a=e.split("-"),t=a[0];return[a[1],a[2].split("T")[0],t].join("-")}(m.date)," (age ",m.age,")"))),l.a.createElement("hr",null),l.a.createElement(b,null,l.a.createElement(E,{size:"5"},l.a.createElement("p",{className:"employee-phoneNumber"},l.a.createElement("i",{className:"data-label fas fa-phone"})," ",a(c)," ",l.a.createElement("i",{className:"data-label fas fa-mobile-alt"})," ",a(o))),l.a.createElement(E,{size:"3"},l.a.createElement("p",{className:"employee-email"},l.a.createElement("i",{className:"data-label fas fa-envelope"})," ",s)),l.a.createElement(E,{size:"4"},l.a.createElement("p",{className:"employee-location"},l.a.createElement("i",{className:"data-label fas fa-globe"})," ",i.city,", ",i.state))))))})):l.a.createElement("div",null,l.a.createElement("p",{className:"no-results"},"no employees found based on your filter(s)..."))))};var h=function(){return l.a.createElement("div",null,l.a.createElement("hr",{className:"section-break"}))};var N=function(){var e=Object(n.useState)({employees:[],order:"desc",filteredEmployees:[],buttonLabels:[{name:"first name",order:"desc"},{name:"last name",order:"desc"},{name:"username",order:"desc"},{name:"dob",order:"desc"},{name:"location",order:"desc"}]}),a=Object(u.a)(e,2),t=a[0],r=a[1],c=Object(n.useState)({name:"",location:"",username:""}),o=Object(u.a)(c,2),s=o[0],m=o[1];return Object(n.useEffect)((function(){f().then((function(e){r(Object(i.a)(Object(i.a)({},t),{},{employees:e.data.results,filteredEmployees:e.data.results}))}))}),[]),l.a.createElement(y.Provider,{value:{employeeState:t,inputObject:s,handleNameSearchChange:function(e){m(Object(i.a)(Object(i.a)({},s),{},{name:e.target.value}));var a=e.target.value,n=t.employees.filter((function(e){if(-1!==(e.name.first.toLowerCase()+" "+e.name.last.toLowerCase()).indexOf(a.toLowerCase()))return e}));r(Object(i.a)(Object(i.a)({},t),{},{filteredEmployees:n}))},handleLocationSearchChange:function(e){m(Object(i.a)(Object(i.a)({},s),{},{location:e.target.value}));var a=e.target.value,n=t.employees.filter((function(e){if(-1!==(e.location.city.toLowerCase()+", "+e.location.state.toLowerCase()).indexOf(a.toLowerCase()))return e}));r(Object(i.a)(Object(i.a)({},t),{},{filteredEmployees:n}))},handleUsernameSearchChange:function(e){m(Object(i.a)(Object(i.a)({},s),{},{username:e.target.value}));var a=e.target.value,n=t.employees.filter((function(e){if(-1!==e.login.username.toLowerCase().indexOf(a.toLowerCase()))return e}));r(Object(i.a)(Object(i.a)({},t),{},{filteredEmployees:n}))},handleSort:function(e){var a=t.buttonLabels.filter((function(a){return a.name===e})).map((function(e){return e.order})).toString();a="desc"===a?"asc":"desc";var n=t.filteredEmployees.sort((function(t,n){if("asc"===a){if("first name"===e)return t.name.first.localeCompare(n.name.first);if("last name"===e)return t.name.last.localeCompare(n.name.last);if("dob"===e)return t.dob.date.localeCompare(n.dob.date);if("location"===e)return t.location.city.localeCompare(n.location.city);if("username"===e)return t.login.username.localeCompare(n.login.username)}else{if("first name"===e)return n.name.first.localeCompare(t.name.first);if("last name"===e)return n.name.last.localeCompare(t.name.last);if("dob"===e)return n.dob.date.localeCompare(t.dob.date);if("location"===e)return n.location.city.localeCompare(t.location.city);if("username"===e)return n.login.username.localeCompare(t.login.username)}})),l=t.buttonLabels.map((function(t){return t.order=t.name===e?a:t.order,t}));r(Object(i.a)(Object(i.a)({},t),{},{filteredEmployees:n,labels:l}))}}},l.a.createElement("div",{className:"main-container"},l.a.createElement(v,{value:{inputObject:s}})),l.a.createElement(h,null),l.a.createElement("div",{className:"main-container"},t.employees.length>0?l.a.createElement(g,null):l.a.createElement("div",null,l.a.createElement("p",{className:"main-no-results"},"...loading employee data"))))};var j=function(){return l.a.createElement("div",null,l.a.createElement(o,null),l.a.createElement(N,null),l.a.createElement(s,null),l.a.createElement(m,null))};c.a.render(l.a.createElement(j,null),document.getElementById("root"))}},[[16,1,2]]]);
  //# sourceMappingURL=main.1f54c80e.chunk.js.map