.eslintcache

[{"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\index.js":"1","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\TempleApp.js":"2","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\home.js":"3","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\teacher_detail.js":"4","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\teachers.js":"5","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\login.js":"6","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\courses.js":"7","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\contact.js":"8","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\course.js":"9","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_event.js":"10","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\about.js":"11","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\admin.js":"12","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\course_player.js":"13","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\view_cert.js":"14","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\context\\AuthContext.js":"15","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\customRouter\\privateRoute.js":"16","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\api.js":"17","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\funcionesTexto.js":"18","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\almUsuario.js":"19","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-MONGODB-FATAMA-1.js":"20","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-PROTECCIONDEDATOS-PROFELEAL-1.js":"21","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-INGLES-BENAVIDES-1.js":"22","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-PYTHON-RODRIGO-1.js":"23","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-CPP-LOPEZ-1.js":"24","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-REACT-RAZIEL-2022.js":"25","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\tabla\\docentes.js":"26","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\tabla\\cursos.js":"27","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\firebase.js":"28","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\navbar\\navbar.jsx":"29","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\footer\\footer.jsx":"30","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\estadisticas\\estadisticas.jsx":"31","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\testimonios\\testimonios.jsx":"32","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\nuestroscursos\\nuestroscursos.jsx":"33","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\course_teacher\\course_teacher.jsx":"34","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\parrafo_teacher\\parrafo_teacher.jsx":"35","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\episodio\\acordeon_episodios.jsx":"36","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\cursos\\card\\card.jsx":"37","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\cursos\\cursos-data.jsx":"38","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\docentes\\card\\card_teacher.jsx":"39","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\panoramaInicio\\index.js":"40","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\calendario\\index.js":"41","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\avatar\\index.js":"42","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\pestanas\\index.js":"43","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\navbar\\index.js":"44","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\footer\\index.js":"45","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\validadores.js":"46","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\step-manager\\step-manager.js":"47","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\hooks\\useStepObserver.js":"48","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\data\\data.js":"49","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionClases.js":"50","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionCurso.js":"51","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\confirmacion.js":"52","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionProfesor.js":"53","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\testimonios\\testimonios-data.jsx":"54","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\episodio\\card\\card_episodio.jsx":"55","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\avatar\\avatar.js":"56","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\pestanas\\pestanas.js":"57","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\dropdown-image\\index.js":"58","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\helmet\\index.js":"59","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\forms-steps\\index.js":"60","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\panoramaInicio\\panorama.jsx":"61","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\calendario\\calendario.jsx":"62","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\funcionesArreglo.js":"63","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\tarjeta_edicion_clase.js":"64","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\dropdown-image\\dropdown.js":"65","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\helmet\\helmet-metadata.js":"66","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\forms-steps\\form-steps.js":"67","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\hooks\\useOutsideListener.js":"68"},{"size":480,"mtime":1612712085400,"results":"69","hashOfConfig":"70"},{"size":1917,"mtime":1619465213939,"results":"71","hashOfConfig":"70"},{"size":1877,"mtime":1619465085683,"results":"72","hashOfConfig":"70"},{"size":5851,"mtime":1614149447869,"results":"73","hashOfConfig":"70"},{"size":1485,"mtime":1619473314884,"results":"74","hashOfConfig":"70"},{"size":2940,"mtime":1619580787717,"results":"75","hashOfConfig":"70"},{"size":1741,"mtime":1619471108612,"results":"76","hashOfConfig":"70"},{"size":738,"mtime":1611425705215,"results":"77","hashOfConfig":"70"},{"size":8324,"mtime":1619473293547,"results":"78","hashOfConfig":"70"},{"size":1124,"mtime":1662014470261,"results":"79","hashOfConfig":"70"},{"size":357,"mtime":1611692395480,"results":"80","hashOfConfig":"70"},{"size":1198,"mtime":1618940375116,"results":"81","hashOfConfig":"70"},{"size":3313,"mtime":1619473385153,"results":"82","hashOfConfig":"70"},{"size":8463,"mtime":1620181853571,"results":"83","hashOfConfig":"70"},{"size":876,"mtime":1618939505470,"results":"84","hashOfConfig":"70"},{"size":662,"mtime":1612323653724,"results":"85","hashOfConfig":"70"},{"size":11811,"mtime":1619469032310,"results":"86","hashOfConfig":"70"},{"size":1171,"mtime":1619492347354,"results":"87","hashOfConfig":"70"},{"size":295,"mtime":1618939600559,"results":"88","hashOfConfig":"70"},{"size":24322,"mtime":1631157054659,"results":"89","hashOfConfig":"70"},{"size":23754,"mtime":1631139065261,"results":"90","hashOfConfig":"70"},{"size":23317,"mtime":1631665175848,"results":"91","hashOfConfig":"70"},{"size":23299,"mtime":1662015986315,"results":"92","hashOfConfig":"70"},{"size":23447,"mtime":1630735124660,"results":"93","hashOfConfig":"70"},{"size":23263,"mtime":1662084704123,"results":"94","hashOfConfig":"70"},{"size":7524,"mtime":1611452996330,"results":"95","hashOfConfig":"70"},{"size":9245,"mtime":1611453024063,"results":"96","hashOfConfig":"70"},{"size":659,"mtime":1611426599873,"results":"97","hashOfConfig":"70"},{"size":2740,"mtime":1618940597109,"results":"98","hashOfConfig":"70"},{"size":1994,"mtime":1611692562737,"results":"99","hashOfConfig":"70"},{"size":3353,"mtime":1612712718385,"results":"100","hashOfConfig":"70"},{"size":1137,"mtime":1611692422631,"results":"101","hashOfConfig":"70"},{"size":1702,"mtime":1611692502680,"results":"102","hashOfConfig":"70"},{"size":1452,"mtime":1611449403756,"results":"103","hashOfConfig":"70"},{"size":1378,"mtime":1612117348887,"results":"104","hashOfConfig":"70"},{"size":530,"mtime":1611424035661,"results":"105","hashOfConfig":"70"},{"size":1181,"mtime":1611637215345,"results":"106","hashOfConfig":"70"},{"size":3273,"mtime":1612930536034,"results":"107","hashOfConfig":"70"},{"size":2423,"mtime":1611637135000,"results":"108","hashOfConfig":"70"},{"size":37,"mtime":1611425534150,"results":"109","hashOfConfig":"70"},{"size":39,"mtime":1611424035314,"results":"110","hashOfConfig":"70"},{"size":35,"mtime":1611424035261,"results":"111","hashOfConfig":"70"},{"size":36,"mtime":1611692468392,"results":"112","hashOfConfig":"70"},{"size":35,"mtime":1611424036088,"results":"113","hashOfConfig":"70"},{"size":35,"mtime":1611424035861,"results":"114","hashOfConfig":"70"},{"size":3994,"mtime":1619580747892,"results":"115","hashOfConfig":"70"},{"size":230,"mtime":1611891779839,"results":"116","hashOfConfig":"70"},{"size":651,"mtime":1611963889219,"results":"117","hashOfConfig":"70"},{"size":1112,"mtime":1619580608320,"results":"118","hashOfConfig":"70"},{"size":4901,"mtime":1611453191790,"results":"119","hashOfConfig":"70"},{"size":11880,"mtime":1611506217312,"results":"120","hashOfConfig":"70"},{"size":812,"mtime":1611446993466,"results":"121","hashOfConfig":"70"},{"size":10015,"mtime":1611452760831,"results":"122","hashOfConfig":"70"},{"size":1235,"mtime":1611553176055,"results":"123","hashOfConfig":"70"},{"size":1109,"mtime":1617131372013,"results":"124","hashOfConfig":"70"},{"size":475,"mtime":1611434139071,"results":"125","hashOfConfig":"70"},{"size":1031,"mtime":1612647337693,"results":"126","hashOfConfig":"70"},{"size":37,"mtime":1611812649805,"results":"127","hashOfConfig":"70"},{"size":44,"mtime":1615182318124,"results":"128","hashOfConfig":"70"},{"size":39,"mtime":1611877771633,"results":"129","hashOfConfig":"70"},{"size":697,"mtime":1611697769306,"results":"130","hashOfConfig":"70"},{"size":5403,"mtime":1612927828099,"results":"131","hashOfConfig":"70"},{"size":356,"mtime":1618123114215,"results":"132","hashOfConfig":"70"},{"size":7055,"mtime":1618123233573,"results":"133","hashOfConfig":"70"},{"size":2835,"mtime":1617688124356,"results":"134","hashOfConfig":"70"},{"size":2218,"mtime":1619467736905,"results":"135","hashOfConfig":"70"},{"size":850,"mtime":1619422693722,"results":"136","hashOfConfig":"70"},{"size":913,"mtime":1615182318153,"results":"137","hashOfConfig":"70"},{"filePath":"138","messages":"139","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},"h6hyae",{"filePath":"141","messages":"142","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"143","messages":"144","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"145","messages":"146","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"147","messages":"148","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"149","messages":"150","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"151","usedDeprecatedRules":"140"},{"filePath":"152","messages":"153","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"154","messages":"155","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"156","messages":"157","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":1,"source":"158","usedDeprecatedRules":"140"},{"filePath":"159","messages":"160","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"161","messages":"162","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"163","messages":"164","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"165","messages":"166","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"167","usedDeprecatedRules":"140"},{"filePath":"168","messages":"169","errorCount":0,"fatalErrorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":"170","usedDeprecatedRules":"140"},{"filePath":"171","messages":"172","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"173","messages":"174","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"175","messages":"176","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"177","usedDeprecatedRules":"140"},{"filePath":"178","messages":"179","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"180","usedDeprecatedRules":"140"},{"filePath":"181","messages":"182","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"183","messages":"184","errorCount":0,"fatalErrorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"185","usedDeprecatedRules":"140"},{"filePath":"186","messages":"187","errorCount":0,"fatalErrorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"188","usedDeprecatedRules":"140"},{"filePath":"189","messages":"190","errorCount":0,"fatalErrorCount":0,"warningCount":6,"fixableErrorCount":0,"fixableWarningCount":0,"source":"191","usedDeprecatedRules":"140"},{"filePath":"192","messages":"193","errorCount":0,"fatalErrorCount":0,"warningCount":6,"fixableErrorCount":0,"fixableWarningCount":0,"source":"194","usedDeprecatedRules":"140"},{"filePath":"195","messages":"196","errorCount":0,"fatalErrorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"197","usedDeprecatedRules":"140"},{"filePath":"198","messages":"199","errorCount":0,"fatalErrorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"200","messages":"201","errorCount":0,"fatalErrorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":"202","usedDeprecatedRules":"140"},{"filePath":"203","messages":"204","errorCount":0,"fatalErrorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":"205","usedDeprecatedRules":"140"},{"filePath":"206","messages":"207","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"208","messages":"209","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"210","usedDeprecatedRules":"140"},{"filePath":"211","messages":"212","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"213","messages":"214","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"215","messages":"216","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"217","messages":"218","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"219","messages":"220","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"221","messages":"222","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"223","usedDeprecatedRules":"140"},{"filePath":"224","messages":"225","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"226","messages":"227","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"228","messages":"229","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"230","messages":"231","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"232","messages":"233","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"234","messages":"235","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"236","messages":"237","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"238","messages":"239","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"240","messages":"241","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"242","messages":"243","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"244","messages":"245","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"246","usedDeprecatedRules":"140"},{"filePath":"247","messages":"248","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"249","messages":"250","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"251","messages":"252","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"253","messages":"254","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"255","usedDeprecatedRules":"140"},{"filePath":"256","messages":"257","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"258","usedDeprecatedRules":"140"},{"filePath":"259","messages":"260","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"261","messages":"262","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"263","usedDeprecatedRules":"140"},{"filePath":"264","messages":"265","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"266","messages":"267","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"268","messages":"269","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"270","messages":"271","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"272","usedDeprecatedRules":"140"},{"filePath":"273","messages":"274","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"275","messages":"276","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"277","messages":"278","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"279","messages":"280","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"281","messages":"282","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"283","usedDeprecatedRules":"140"},{"filePath":"284","messages":"285","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"286","messages":"287","errorCount":0,"fatalErrorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"288","usedDeprecatedRules":"140"},{"filePath":"289","messages":"290","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"291","usedDeprecatedRules":"140"},{"filePath":"292","messages":"293","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"140"},{"filePath":"294","messages":"295","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"296","usedDeprecatedRules":"140"},{"filePath":"297","messages":"298","errorCount":0,"fatalErrorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"299","usedDeprecatedRules":"140"},"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\index.js",[],["300","301"],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\TempleApp.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\home.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\teacher_detail.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\teachers.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\login.js",["302"],"import React, { useState, useEffect } from \"react\"\r\nimport { useHistory } from \"react-router-dom\"\r\nimport Navbar from \"../components/navbar/navbar\"\r\nimport Footer from \"../components/footer/footer\"\r\nimport { obtCursosMuestra, iniciarSesion } from \"../api\"\r\nimport { almacenarUsuarioStorage, obtUsuarioStorage } from '../helpers/almUsuario';\r\n\r\nexport default function Login({ location }) {\r\n\r\n    let history = useHistory();\r\n    const [cursos, estCursos] = useState([]);\r\n    const [correo, estCorreo] = useState('');\r\n    const [contrasena, estContrasena] = useState('');\r\n    const [usuario] = useState(obtUsuarioStorage());\r\n\r\n    useEffect(() => {\r\n        obtCursosMuestra()\r\n            .then(data => {\r\n                estCursos(data);\r\n            });\r\n    }, []);\r\n\r\n    const manejarCampoCorreo = (ev) => {\r\n        estCorreo(ev.target.value);\r\n    }\r\n\r\n    const manejarCampoContrasena = (ev) => {\r\n        estContrasena(ev.target.value);\r\n    }\r\n\r\n    const ingresar = (e) => {\r\n        if (correo && contrasena) {\r\n            e.preventDefault();\r\n            iniciarSesion(correo, contrasena)\r\n                .then(usuario => {\r\n                    if (usuario) {\r\n                        almacenarUsuarioStorage(usuario);\r\n                        history.push('/admin');\r\n                    } else {\r\n                        alert('Usuario inexistente');\r\n                    }\r\n                })\r\n                .catch(error => {\r\n                    alert('Usuario inválido');\r\n                })\r\n        } else {\r\n            alert('Hay campos vacíos')\r\n        }\r\n    }\r\n\r\n    if (usuario) {\r\n        history.push('/admin');\r\n    }\r\n\r\n    return (\r\n        <div>\r\n            <Navbar />\r\n            <div className=\"contenedor cuerpo-pagina\">\r\n                <h2 className=\"titulo-seccion mt-5\">Iniciar sesión</h2>\r\n\r\n                <form onSubmit={ingresar}>\r\n                    <div class=\"form-group form-group-login\">\r\n                        <label for=\"exampleInputEmail1\">Correo</label>\r\n                        <input value={correo} onChange={manejarCampoCorreo} type=\"email\" class=\"form-control\" id=\"exampleInputEmail1\" placeholder=\"Ingresa tu usuario\" />\r\n                    </div>\r\n                    <div class=\"form-group form-group-login\">\r\n                        <label for=\"exampleInputPassword1\">Contraseña</label>\r\n                        <input value={contrasena} onChange={manejarCampoContrasena} type=\"password\" class=\"form-control\" id=\"exampleInputPassword1\" placeholder=\"**********************\" />\r\n                    </div>\r\n                    <button type='submit' target=\"_blank\" className=\"boton btn-principal btn-rep-curso d-block mt-5\" to={'/'}>\r\n                        <i className=\"fas fa-sign-in-alt mr-3\"></i>\r\n                        Ingresar\r\n                    </button>\r\n                </form>\r\n            </div>\r\n            <Footer />\r\n        </div>\r\n    )\r\n}","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\courses.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\contact.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\course.js",["303","304"],"import React, { useState, useEffect } from \"react\"\r\nimport Navbar from \"../components/navbar/navbar\"\r\nimport Footer from \"../components/footer/footer\"\r\nimport AcordeonEpisodio from \"../components/episodio/acordeon_episodios\"\r\nimport queryString from 'query-string'\r\nimport GridLoader from \"react-spinners/GridLoader\"\r\nimport Avatar from \"../components/avatar\"\r\nimport { obtenerOracion } from '../helpers/funcionesTexto'\r\nimport { css } from \"@emotion/core\"\r\nimport { obtCursoExtendido } from '../api'\r\nimport { diasSemana, nombresDiasSemana } from '../components/cursos/cursos-data'\r\nimport { Link, useHistory } from \"react-router-dom\"\r\nimport moment from \"moment\"\r\nimport 'moment/locale/es'\r\n\r\nconst override = css`\r\n  display: block;\r\n  margin: 50px auto;\r\n  background-color: 'green';\r\n`;\r\n\r\nconst obtenerTextoFecha = ({ fInicioFin }) => {\r\n    if (moment(fInicioFin[0], 'DD/MM/YYYY').format('YYYY-MM-DD') == moment().format('YYYY-MM-DD')) {\r\n        return 'Hoy, ' + moment(fInicioFin[0], 'DD/MM/YYYY').format('D [de] MMMM')\r\n    } else {\r\n        const porcionFecha = moment(fInicioFin[0], 'DD/MM/YYYY').format('dddd, D [de] MMMM [del] YYYY');\r\n        return obtenerOracion(porcionFecha);\r\n    }\r\n}\r\n\r\nconst obtenerTextoHorarios = ({ dias, hInicioFin, fInicioFin }) => {\r\n    const porcionHora = 'de ' + moment(hInicioFin[0], 'HH:mm').format('hh:mma') + ' a ' + moment(hInicioFin[1], 'HH:mm').format('hh:mma');\r\n    if (fInicioFin[0] === fInicioFin[1]) {\r\n        return obtenerOracion(moment(fInicioFin[0], 'DD/MM/YYYY').format('dddd, D [de] MMMM [del] YYYY ') + porcionHora + ' (Único día)');\r\n    } else {\r\n        const arrDias = dias.map(dia => {\r\n            const indice = diasSemana.indexOf(dia);\r\n            return nombresDiasSemana[indice];\r\n        });\r\n        return 'Cada ' + arrDias.join(', ') + ' ' + porcionHora\r\n    }\r\n}\r\n\r\nconst calcularTotalHoras = (clases) => {\r\n    let totalMinutos = 0;\r\n\r\n    // Sumo todas las horas y minutos\r\n    clases.map(clase => {\r\n        const hm = clase.duracion.split(' ');\r\n        const horas = parseInt(hm[0], 10);\r\n        const minutos = parseInt(hm[1], 10);\r\n        totalMinutos += minutos;\r\n        totalMinutos += (horas * 60);\r\n        return { totalMinutos }\r\n    })\r\n\r\n    // Obtengo las horas y minutos completos\r\n    const horas = totalMinutos / 60;\r\n    const horasCompletas = Math.trunc(horas); // Parte entera\r\n    const minutosCompletos = Math.trunc((horas % 1) * 60); // Parte decimal\r\n\r\n    // Lo paso a formato horario\r\n    return `${horasCompletas}h ${minutosCompletos}m`;\r\n}\r\n\r\nexport default function Course(props) {\r\n    const idCurso = queryString.parse(props.location.search).id;\r\n    const [curso, estCurso] = useState({});\r\n    const [cargando, estCargando] = useState(true);\r\n    const history = useHistory();\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0)\r\n    }, []);\r\n\r\n    useEffect(() => {\r\n        estCargando(true);\r\n        obtCursoExtendido(idCurso)\r\n            .then(curso => {\r\n                estCurso(curso);\r\n                estCargando(false);\r\n            })\r\n    }, [idCurso]);\r\n\r\n    const navegar = (idEpisodio) => {\r\n        history.push(`/course-player/?id=${idCurso}&episode=${idEpisodio}`);\r\n    }\r\n\r\n    return (\r\n        <div>\r\n            <Navbar />\r\n            <div className=\"cuerpo-pagina\">\r\n                {\r\n                    curso && curso.urlImg\r\n                    &&\r\n                    <div className=\"contenedor-portada-curso\">\r\n                        <div className=\"fondo-portada-curso\" style={{ backgroundImage: `url(${curso.urlImg})` }}></div>\r\n                        <img src={curso?.urlImg} alt=\"portada-curso\" />\r\n                    </div>\r\n                }\r\n                <div className=\"contenedor contenedor-60 vh-50\">\r\n                    <GridLoader css={override} loading={cargando} size={20} />\r\n                    {\r\n                        !cargando && curso.id\r\n                        &&\r\n                        <>\r\n                            <h2 className=\"titulo-seccion text-left titulo-curso\">{curso.titulo}</h2>\r\n                            <div className=\"contenedor-controles-curso\">\r\n                                <a target=\"_blank\" className=\"boton btn-principal btn-rep-curso d-block\" href={curso.urlInscripcion}>\r\n                                    <i className=\"fas fa-edit mr-3\"></i>\r\n                                    Inscribirme\r\n                                </a>\r\n                                <div className=\"contenedor-data-cursos\">\r\n                                    <div className=\"mr-md-5\">\r\n                                        <i className=\"fas fa-layer-group\"></i>{' '}\r\n                                        {curso.clases && curso.clases.length} Clases\r\n                                </div>\r\n                                    <div>\r\n                                        <i className=\"far fa-clock\"></i>{' '}\r\n                                        {calcularTotalHoras(curso.clases)}\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <p className=\"descripcion-curso\">\r\n                                {curso.descExtendida}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">¿Cuándo inicia?</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {obtenerTextoFecha(curso)}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">¿En qué horarios?</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {obtenerTextoHorarios(curso)}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">¿Qué aprenderás?</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {curso.objetivo}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Requisitos</h3>\r\n                            <ul className=\"requisitos-curso\">\r\n                                {\r\n                                    curso.requisitos.map((requisito, indice) => (\r\n                                        <li key={indice}>{requisito}</li>\r\n                                    ))\r\n                                }\r\n                            </ul>\r\n                            <div className=\"contenedor-curso-profesor\">\r\n                                <div className=\"contenedor-img\">\r\n                                    <Avatar img={curso.profesor.img} />\r\n                                </div>\r\n                                <div className=\"contenedor-descripcion\">\r\n                                    <h4>\r\n                                        <Link to={`/teacher-detail/?id=${curso.profesor.id}`}>\r\n                                            {curso.profesor.nombres + ' ' + curso.profesor.apellidos}\r\n                                        </Link>\r\n                                    </h4>\r\n                                    <p className=\"descripcion-curso clamp clamp-2\">\r\n                                        {curso.profesor.sobreMi}\r\n                                    </p>\r\n                                </div>\r\n                            </div>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Lista de clases</h3>\r\n                            {\r\n                                curso.clases && curso.clases.length > 0\r\n                                    ?\r\n                                    <AcordeonEpisodio\r\n                                        episodios={curso.clases}\r\n                                        machucar={navegar} />\r\n                                    :\r\n                                    <p className=\"descripcion-curso\">Aún no hay videos</p>\r\n                            }\r\n                        </>\r\n                    }\r\n                    {\r\n                        !cargando && !curso.id\r\n                        &&\r\n                        <p>No se pudo cargar el curso</p>\r\n                    }\r\n                </div>\r\n            </div>\r\n            <Footer />\r\n        </div>\r\n    )\r\n}","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_event.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\about.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\admin.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\course_player.js",["305"],"import React, { useState, useEffect } from \"react\"\r\nimport Plyr from 'plyr'\r\nimport Navbar from \"../components/navbar/navbar\"\r\nimport Footer from \"../components/footer/footer\"\r\nimport AcordeonEpisodio from \"../components/episodio/acordeon_episodios\"\r\nimport queryString from 'query-string'\r\nimport { obtClasesCurso } from '../api'\r\n\r\nconst construirUrlVideo = (urlVideo) => {\r\n    return `https://www.youtube.com/embed/${urlVideo}?origin=https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1`;\r\n}\r\n\r\nexport default function Course(props) {\r\n    const { id: idCurso, episode: idEpisodio } = queryString.parse(props.location.search);\r\n\r\n    const [episodios, estEpisodios] = useState([]);\r\n    const [cargandoEpisodios, estCargandoEpisodios] = useState(true);\r\n    const [urlVideo, estUrlVideo] = useState('');\r\n    const [idVideo, estIdVideo] = useState(idEpisodio);\r\n\r\n    const obtUrlPorIdVideo = (episodios, idEpisodio) => {\r\n        const encontrado = episodios.find(e => e.id === idEpisodio);\r\n        return encontrado && encontrado.urlVideo;\r\n    }\r\n\r\n    const seleccionarEpisodio = (id, urlVideo) => {\r\n        estIdVideo(id);\r\n        estUrlVideo(construirUrlVideo(urlVideo));\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0)\r\n    }, []);\r\n\r\n    useEffect(() => {\r\n        estCargandoEpisodios(true);\r\n        obtClasesCurso(idCurso)\r\n            .then(episodios => {\r\n                estEpisodios(episodios.reverse());\r\n                estUrlVideo(construirUrlVideo(obtUrlPorIdVideo(episodios, idEpisodio)));\r\n                estCargandoEpisodios(false);\r\n            })\r\n    }, [idCurso, idEpisodio]);\r\n\r\n    useEffect(() => {\r\n        const player = new Plyr('#player', {\r\n            controls: ['play-large', 'play', 'progress', 'current-time', 'volume', 'captions', 'settings', 'pip', 'airplay', 'fullscreen', 'quality'],\r\n            tooltips: { controls: false, seek: false },\r\n            settings: ['captions', 'quality', 'speed', 'loop']\r\n        });\r\n        window.player = player;\r\n    }, [urlVideo]);\r\n\r\n    return (\r\n        <div>\r\n            <Navbar />\r\n            <div className=\"cuerpo-pagina pb-0\">\r\n                <div className=\"contenedor-reproductor\">\r\n                    <div className=\"contenedor-video\">\r\n                        <div key={idVideo} className=\"plyr__video-embed\" id=\"player\">\r\n                            <iframe\r\n                                title=\"...\"\r\n                                width=\"100%\"\r\n                                frameBorder=\"0\"\r\n                                src={urlVideo}\r\n                                allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\r\n                                allowFullScreen></iframe>\r\n                        </div>\r\n                    </div>\r\n                    <div className=\"contenedor-acordeon\">\r\n                        <AcordeonEpisodio\r\n                            invertir={true}\r\n                            episodios={episodios}\r\n                            idActivo={idVideo}\r\n                            machucar={seleccionarEpisodio} />\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <Footer />\r\n        </div>\r\n    )\r\n}","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\view_cert.js",["306","307","308","309","310","311","312"],"import React, { useState, useEffect } from 'react';\r\nimport Navbar from '../components/navbar';\r\nimport Footer from \"../components/footer\";\r\nimport GridLoader from \"react-spinners/GridLoader\";\r\nimport queryString from 'query-string';\r\nimport Avatar from \"../components/avatar\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faDownload } from '@fortawesome/free-solid-svg-icons';\r\nimport { FacebookShareButton } from \"react-share\";\r\nimport { faFacebook } from '@fortawesome/free-brands-svg-icons';\r\nimport { obtenerFechaTexto } from '../helpers/funcionesTexto';\r\nimport { obtCertificado } from '../api';\r\nimport { css } from \"@emotion/core\";\r\nimport { Document, Page } from 'react-pdf/dist/esm/entry.webpack';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\nconst override = css`\r\n  display: block;\r\n  margin: 50px auto;\r\n  background-color: 'green';\r\n`;\r\n\r\nconst Previsualizacion = ({ location }) => {\r\n\r\n    const [id, setId] = useState('');\r\n    const [isTest, setIsTest] = useState(false);\r\n    const [origin, setOrigin] = useState('OTHER');\r\n    const [course, setCourse] = useState('');\r\n    const [name, setName] = useState('');\r\n    const [condition, setCondition] = useState('');\r\n    const [teachers, setTeachers] = useState([]);\r\n    const [issuedAt, setIssuedAt] = useState('');\r\n    const [isLoading, setIsLoading] = useState(true);\r\n    const [resultUrl, setResultUrl] = useState('');\r\n    const [success, setSuccess] = useState(false);\r\n    const [numPages, setNumPages] = useState(0);\r\n\r\n    const history = useHistory();\r\n\r\n    useEffect(() => {\r\n\r\n        const { test, origin, fbclid, templated } = queryString.parse(location.search);\r\n\r\n        const idCert = history.location.pathname.toString().replace(/\\//g, '').replace(/view-cert/g, '');\r\n\r\n        if (test) {\r\n            setIsTest(true);\r\n        }\r\n        if (templated) {\r\n            setOrigin('MAIL');\r\n        }\r\n\r\n        if (origin == 'qr') {\r\n            setOrigin('QR');\r\n        }\r\n\r\n        if (fbclid) {\r\n            setOrigin('FB');\r\n        }\r\n\r\n        if (idCert) {\r\n            obtCertificado(idCert).then(({ data, error }) => {\r\n                if (!error) {\r\n                    const { urlCert, curso, profesores, creadoEn, condicion, otorgadoA } = data;\r\n                    setId(idCert);\r\n                    setResultUrl(urlCert);\r\n                    setCourse(curso);\r\n                    setTeachers(profesores);\r\n                    setIssuedAt(creadoEn);\r\n                    setName(otorgadoA);\r\n                    setCondition(condicion);\r\n                    setIsLoading(false);\r\n                } else {\r\n                    alert('No se encontró el archivo. Intente más tarde');\r\n                    setIsLoading(false);\r\n                    setSuccess(false);\r\n                }\r\n            });\r\n        } else {\r\n            alert('Id inválido');\r\n            setIsLoading(false);\r\n            setSuccess(false);\r\n        }\r\n\r\n    }, [location]);\r\n\r\n    const onDocumentLoadSuccess = ({ numPages = 0 }) => {\r\n        setIsLoading(false);\r\n        setSuccess(true);\r\n        setNumPages(numPages);\r\n    }\r\n\r\n    const onDocumentError = () => {\r\n        setIsLoading(false);\r\n        setSuccess(false);\r\n    }\r\n\r\n    const url = process.env.REACT_APP_WEBSITE + '/' + window.location.pathname;\r\n\r\n    return (\r\n        <div>\r\n            <Navbar />\r\n            <div className=\"cuerpo-pagina\">\r\n                <GridLoader css={override} loading={isLoading} size={20} />\r\n                {\r\n                    resultUrl && !isLoading &&\r\n                    <>\r\n                        <section className='contenedor contenedor-visor-pdf position-relative'>\r\n                            <div>\r\n                                <h2 className=\"titulo-seccion\">{course.nombre}</h2>\r\n                                <Document\r\n                                    file={resultUrl}\r\n                                    onLoadSuccess={onDocumentLoadSuccess}\r\n                                    onLoadError={onDocumentError}\r\n                                    externalLinkTarget={'_blank'}>\r\n                                    {\r\n                                        Array.from(\r\n                                            new Array(numPages),\r\n                                            (el, index) => (\r\n                                                <Page\r\n                                                    key={`page_${index + 1}`}\r\n                                                    pageNumber={index + 1}\r\n                                                />\r\n                                            ),\r\n                                        )\r\n                                    }\r\n                                </Document>\r\n                            </div>\r\n                        </section>\r\n                        <section className='contenedor contenedor-60 contenedor-datos-certificado'>\r\n                            <h3 className=\"subtitulo-descripcion-curso mt-4\">Otorgado a:</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {name}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Condición lograda:</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {condition}\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Profesores:</h3>\r\n                            {\r\n                                teachers.map(profesor => (\r\n                                    <div className=\"contenedor-curso-profesor\">\r\n                                        <div className=\"contenedor-img\">\r\n                                            <Avatar img={profesor.imgUrl} />\r\n                                        </div>\r\n                                        <div className=\"contenedor-descripcion\">\r\n                                            <h4>\r\n                                                <Link to={`/teacher-detail/?id=${profesor.id}`}>\r\n                                                    {profesor.nombres}\r\n                                                </Link>\r\n                                            </h4>\r\n                                            <p className=\"descripcion-curso clamp clamp-2\">\r\n                                                {profesor.sobreMi}\r\n                                            </p>\r\n                                        </div>\r\n                                    </div>\r\n                                ))\r\n                            }\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Curso:</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                <a href=\"_blank\" href={course.url}>{course.nombre}</a>\r\n                            </p>\r\n                            <h3 className=\"subtitulo-descripcion-curso\">Emitido el:</h3>\r\n                            <p className=\"descripcion-curso\">\r\n                                {obtenerFechaTexto(issuedAt.seconds * 1000)}\r\n                            </p>\r\n                        </section>\r\n                    </>\r\n                }\r\n            </div>\r\n            <Footer />\r\n            <div className='bottom-prev-navbar'>\r\n                <nav className='contenedor'>\r\n                    <button className='button-purple position-relative p-0'>\r\n                        <FacebookShareButton\r\n                            url={url.toString()}\r\n                            quote={'¡Hice un curso y obtuve un certificado en la Academia Temple!'}\r\n                            className='py-08'\r\n                            hashtag='#academiatemple'\r\n                            style={{ width: '100%', height: '100%' }}>\r\n                            <FontAwesomeIcon color={'white'} icon={faFacebook} className='icon' />\r\n                            {' '}\r\n                        Comparte\r\n                    </FacebookShareButton>\r\n                    </button>\r\n                    <button className='button-purple' onClick={() => window.open(resultUrl)}>\r\n                        <FontAwesomeIcon color={'white'} icon={faDownload} className='icon' />\r\n                    </button>\r\n                </nav>\r\n            </div>\r\n        </div>\r\n    );\r\n}\r\n\r\nexport default Previsualizacion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\context\\AuthContext.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\customRouter\\privateRoute.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\api.js",["313","314"],"//import 'babel-polyfill';\r\nimport firebase from './firebase';\r\n\r\nconst firestore = firebase.firestore();\r\nconst auth = firebase.auth();\r\nconst storage = firebase.storage();\r\n\r\n// Profesor\r\nexport const obtProfesoresMuestra = async () => {\r\n    return firestore.collection('docentes').where('activo', '==', 1).orderBy('nombres', 'asc').get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const { img, nombres, apellidos, sobreMi, etiquetas, likes, redes } = doc.data();\r\n                lista.push({ id: doc.id, img, nombres, apellidos, sobreMi, etiquetas, likes, redes });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n}\r\n\r\nexport const obtProfesoresCombo = async () => {\r\n    return firestore.collection('docentes').where('activo', '==', 1).orderBy('nombres', 'asc').get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const { nombres, apellidos } = doc.data();\r\n                lista.push({ id: doc.id, nombres, apellidos });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n}\r\n\r\nexport const obtPerfilProfesor = async idProfesor => {\r\n    return firestore.collection('docentes').doc(idProfesor).get()\r\n        .then(async doc => {\r\n            if (doc.exists) {\r\n                const { img, nombres, apellidos, sobreMi, logros, pais, experiencia, etiquetas, likes, redes } = doc.data();\r\n                return {\r\n                    id: doc.id,\r\n                    cursos: await obtCursosPorProfesor(idProfesor),\r\n                    img,\r\n                    nombres,\r\n                    apellidos,\r\n                    sobreMi,\r\n                    logros,\r\n                    pais,\r\n                    experiencia,\r\n                    etiquetas,\r\n                    likes,\r\n                    redes\r\n                };\r\n            } else {\r\n                return {};\r\n            }\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return {};\r\n        });\r\n}\r\n\r\nconst obtProfesorCurso = async (idProfesor) => {\r\n    return firestore.collection('docentes').doc(idProfesor).get()\r\n        .then(doc => {\r\n            if (doc.exists) {\r\n                const { img, nombres, apellidos, sobreMi } = doc.data();\r\n                return {\r\n                    id: doc.id, img, nombres, apellidos, sobreMi\r\n                };\r\n            } else {\r\n                return {};\r\n            }\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return {};\r\n        });\r\n}\r\n\r\n// Curso\r\nexport const obtCursosCalendario = async () => {\r\n    return firestore.collection('cursos').where('activo', '==', 1).get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const { id, titulo, dias, hInicioFin, fInicioFin, excepciones, cancelaciones, urlInscripcion } = doc.data();\r\n                lista.push({ id, titulo, dias, hInicioFin, fInicioFin, excepciones, cancelaciones, urlInscripcion });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n}\r\n\r\nexport const obtCursosMuestra = async () => {\r\n    return firestore.collection('cursos').where('activo', '==', 1).get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const { titulo, urlImg, descBreve } = doc.data();\r\n                lista.push({ id: doc.id, titulo, urlImg, descBreve });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n    //firestore.collection('episodios').doc('88Ec4OtP23y1IQxf7c0o').set(episodios)\r\n    //return cursos.map(({ id, titulo, urlImg, descBreve }) => ({ id, titulo, urlImg, descBreve }));\r\n}\r\n\r\nexport const obtCursoExtendido = async (idCurso) => {\r\n    return firestore.collection('cursos').doc(idCurso).get()\r\n        .then(async doc => {\r\n            if (doc.exists) {\r\n                const { idProfesor, titulo, urlImg, dias, hInicioFin, fInicioFin, excepciones, cancelaciones, urlInscripcion, descBreve, descExtendida, objetivo, requisitos } = doc.data();\r\n                return {\r\n                    id: doc.id,\r\n                    titulo,\r\n                    urlImg,\r\n                    dias,\r\n                    hInicioFin,\r\n                    fInicioFin,\r\n                    excepciones,\r\n                    cancelaciones,\r\n                    urlInscripcion,\r\n                    descBreve,\r\n                    descExtendida,\r\n                    objetivo,\r\n                    profesor: await obtProfesorCurso(idProfesor),\r\n                    clases: await obtClasesCurso(idCurso),\r\n                    requisitos\r\n                };\r\n            } else {\r\n                return {};\r\n            }\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return {};\r\n        });\r\n}\r\n\r\nconst obtCursosPorProfesor = async (idProfesor) => {\r\n    return firestore.collection('cursos').where('idProfesor', '==', idProfesor).get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const { titulo, urlImg, descBreve } = doc.data();\r\n                lista.push({ id: doc.id, titulo, urlImg, descBreve });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n}\r\n\r\n// Clase\r\nexport const obtClasesCurso = async (idCurso) => {\r\n    return firestore.collection('episodios')\r\n        .where('idCurso', '==', idCurso)\r\n        .orderBy('orden', 'desc')\r\n        .get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                const data = doc.data();\r\n                lista.push({ id: doc.id, ...data });\r\n            });\r\n            return lista;\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return [];\r\n        });\r\n}\r\n\r\n// Sesión\r\nexport const iniciarSesion = async (usuario, contrasena) => {\r\n    return auth.signInWithEmailAndPassword(usuario, contrasena)\r\n        .then((user) => {\r\n            return user;\r\n        })\r\n        .catch((error) => {\r\n            console.log(error.message);\r\n            //var errorCode = error.code;\r\n            //var errorMessage = error.message;\r\n        });\r\n}\r\n\r\nexport const cerrarSesion = async () => {\r\n    return auth.signOut().then(function () {\r\n        return true;\r\n    }).catch(function (error) {\r\n        console.log(error.message);\r\n    });\r\n}\r\n\r\n// Eventos\r\nexport const guardarInscripcion = async (object) => {\r\n    return firestore.collection('inscripciones').doc().set({ ...object, createdAt: firebase.firestore.FieldValue.serverTimestamp() }, { merge: true });\r\n}\r\n\r\n// País\r\nexport const obtPais = (prefijo) => {\r\n    return fetch('https://restcountries.eu/rest/v2/alpha/' + prefijo)\r\n        .then(response => response.json())\r\n        .then(pais => pais);\r\n}\r\n\r\n// Certificados\r\nexport const obtCertificado = async (certId) => {\r\n    return firestore.collection('certificados').doc(certId).get()\r\n        .then(async doc => {\r\n            if (doc.exists) {\r\n                return { data: { ...doc.data(), id: doc.id } }\r\n            } else {\r\n                return { error: 'No existe un certificado con ese id' }\r\n            }\r\n        })\r\n        .catch(error => {\r\n            return { error }\r\n        })\r\n}\r\n\r\n// Admin\r\n\r\n// Profesor\r\nexport const obtRegistrosPaginadosAdmin = async (coleccion, campo, limite = 10, antesDe, despuesDe, incluirRegistro) => {\r\n\r\n    const campoConsulta = campo;\r\n\r\n    let ref = firestore.collection(coleccion).orderBy(campoConsulta).limit(limite + 1);\r\n\r\n    if (antesDe) {\r\n        ref = ref.endBefore(antesDe[campoConsulta]).limitToLast(limite + 1);\r\n    }\r\n\r\n    if (despuesDe) {\r\n        if (incluirRegistro) {\r\n            ref = ref.startAt(despuesDe[campoConsulta]);\r\n        } else {\r\n            ref = ref.startAfter(despuesDe[campoConsulta]);\r\n        }\r\n    }\r\n\r\n    return ref\r\n        .get()\r\n        .then(qsn => {\r\n            let lista = [];\r\n            qsn.forEach(doc => {\r\n                lista.push({ ...doc.data(), id: doc.id });\r\n            });\r\n\r\n            let haySiguiente = false;\r\n            if (lista.length == limite + 1) { // Esto significa que hay siguiente\r\n                haySiguiente = true;\r\n                if (antesDe) {\r\n                    lista.shift(); // Elimino el primero, porque he retrocedido\r\n                }\r\n                else {\r\n                    lista.pop(); // Elimino el último\r\n                }\r\n            }\r\n            return {\r\n                lista,\r\n                haySiguiente\r\n            };\r\n        })\r\n        .catch(error => {\r\n            console.log(error);\r\n            return {\r\n                lista: []\r\n            };\r\n        });\r\n}\r\n\r\nexport const actEstadoProfesorAdmin = async (id, estado) => {\r\n    return firestore.collection('docentes').doc(id).set(\r\n        {\r\n            activo: estado\r\n        }, { merge: true });\r\n}\r\n\r\nexport const actProfesorAdmin = async (profesor) => {\r\n    return firestore.collection('docentes').doc(profesor.id).set(\r\n        profesor, { merge: true });\r\n}\r\n\r\n/*export const guardarProfesorAdmin = async (profesor) => {\r\n    return firestore.collection('docentes').add({ ...profesor, activo: 1 });\r\n}*/\r\n\r\n// Curso\r\nexport const actEstadoCursoAdmin = async (id, estado) => {\r\n    return firestore.collection('cursos').doc(id).set(\r\n        {\r\n            activo: estado\r\n        }, { merge: true });\r\n}\r\n\r\nexport const actCursoAdmin = async (curso) => {\r\n    return firestore.collection('cursos').doc(curso.id).set(\r\n        curso, { merge: true });\r\n}\r\n\r\n/*export const guardarCursoAdmin = async (curso) => {\r\n    return firestore.collection('cursos').add({ ...curso, activo: 1 });\r\n}*/\r\n\r\n// Clase\r\nexport const guardarClaseAdmin = async (clase) => {\r\n    return firestore.collection('episodios').add(clase);\r\n}\r\n\r\nexport const actClaseAdmin = async (clase) => {\r\n    return firestore.collection('episodios').doc(clase.id).set(\r\n        clase, { merge: true });\r\n}\r\n\r\nexport const eliminarClaseAdmin = async (idClase) => {\r\n    return firestore.collection('episodios').doc(idClase).delete();\r\n}\r\n\r\n// Archivos\r\nexport const subirImagen = async (ruta, id, archivo) => {\r\n    return new Promise((resolve, reject) => {\r\n        let storageRef = storage.ref();\r\n        let imgRef = storageRef.child(`${ruta}/${id}`);\r\n        const task = imgRef.put(archivo);\r\n\r\n        task.on('state_changed', function (snapshot) {\r\n            var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;\r\n            console.log('Upload is ' + progress + '% done');\r\n            switch (snapshot.state) {\r\n                case firebase.storage.TaskState.PAUSED: // or 'paused'\r\n                    console.log('Upload is paused');\r\n                    break;\r\n                case firebase.storage.TaskState.RUNNING: // or 'running'\r\n                    console.log('Upload is running');\r\n                    break;\r\n            }\r\n        }, function (error) {\r\n            reject(error);\r\n        }, function () {\r\n            task.snapshot.ref.getDownloadURL().then(function (downloadURL) {\r\n                resolve(downloadURL);\r\n            });\r\n        });\r\n    })\r\n}\r\n\r\n// Funciones firestore\r\nexport const obtIdGenerado = (coleccion) => {\r\n    return firestore.collection(coleccion).doc().id;\r\n}","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\funcionesTexto.js",["315"],"import moment from 'moment';\r\nimport \"moment/locale/es\";\r\n\r\nexport const obtenerOracion = (texto, limite) => {\r\n  limite = !limite ? texto.length : limite;\r\n  if (texto && texto.length > 0) {\r\n    return texto.substring(0, 1).toUpperCase() + texto.substring(1, limite);\r\n  } else {\r\n    return '';\r\n  }\r\n}\r\n\r\nexport const aOracion = (text, limit) => {\r\n  limit = !limit ? text.length : limit;\r\n  if (text && text.length > 0) {\r\n    return text.substring(0, 1).toUpperCase() + text.substring(1, limit);\r\n  } else {\r\n    return '';\r\n  }\r\n}\r\n\r\nexport const aNombre = (rawName) => {\r\n  let nameArray = rawName.replace(/'.'/g, '').trim().split(' ');\r\n  nameArray = nameArray.filter(name => name != '').map(name => name && aOracion(name.trim()));\r\n  return nameArray.join(' ');\r\n}\r\n\r\nexport const extraerLink = (rawLink) => {\r\n  if (rawLink) {\r\n    const matchedArray = rawLink.match(/(?:(?:https?|ftp):\\/\\/)?[\\w/\\-?=%.]+\\.[\\w/\\-&?=%.]+/g);\r\n    if (matchedArray) {\r\n      return matchedArray[0];\r\n    }\r\n  }\r\n  return '';\r\n}\r\n\r\nexport const obtenerFechaTexto = (date) => {\r\n  const momentObj = moment(date);\r\n  return aOracion(momentObj.format('D [de] MMMM [del] YYYY'));\r\n}\r\n","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\almUsuario.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-MONGODB-FATAMA-1.js",["316","317","318","319","320"],"import React, { useState, useEffect } from 'react'\r\nimport Footer from '../../components/footer/footer';\r\nimport Navbar from '../../components/navbar';\r\nimport DropdownImage from '../../components/dropdown-image';\r\nimport ClipLoader from \"react-spinners/ClipLoader\";\r\nimport Steps from '../../components/forms/forms-steps';\r\nimport StepManager from '../../components/forms/step-manager/step-manager';\r\nimport Fade from 'react-reveal/Fade';\r\nimport HelmetMetaData from \"../../components/helmet\";\r\nimport Avatar from \"../../components/avatar\";\r\nimport { aNombre } from '../../helpers/funcionesTexto';\r\nimport { esNombreInvalido, esEdadInvalida, esTelefonoInvalido, esCorreoInvalido, esProfesionInvalida } from '../../helpers/validadores';\r\nimport { guardarInscripcion } from '../../api';\r\nimport { useStepObserver } from '../../hooks/useStepObserver';\r\nimport { css } from \"@emotion/core\";\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faAngleDown, faAngleLeft, faAngleRight, faCheck, faCheckCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { contactTypes, fromTypes, knowLevelTypes } from '../../data/data';\r\nimport { faDiscord, faTelegram, faWhatsapp } from '@fortawesome/free-brands-svg-icons';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\n// EDITAR\r\n\r\n// Título principal del curso\r\nconst mainTitle = 'Introducción a Mongo DB';\r\n\r\n// Nombre del profesor\r\nconst hostName = 'Jorge Fatama';\r\n\r\n// Imagen de fondo\r\nconst backgroundImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/formularios%2Fpastel-de-fua.jpg?alt=media&token=d0c9b41f-06ab-42d3-ba1d-f9c05c1b9ea3';\r\n\r\n// Id del profesor\r\nconst teacherId = 'pLmrref9VE4ywTYQMkIy';\r\n\r\n// Img del profesor\r\nconst teacherImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2FpLmrref9VE4ywTYQMkIy?alt=media&token=b658cd73-73f9-4fad-8411-3dff5ece5ac8';\r\n\r\n// Descripción corta del profesor\r\nconst teacherDescription = 'Bienvenidos a todos, Mi nombre es Jorge Fatama. Soy bachiller en Ciencias con mención en Ingeniería Informática por la PUCP, con interés en un enfoque académico en bases de datos no relacionales. También soy co-fundador y presidente del Grupo AEDITIP, el cual inició como una iniciativa estudiantil de asesoría gratuita de cursos de la Universidad, organización de eventos de difusión académica y de reforma de política universitaria. Soy un apasionado difusor sobre actualidad de tecnología e informática.';\r\n\r\n// Grupos a los que se unirán: WSP, TELEGRAM, DISCORD\r\nconst joinGroups = [\r\n    {\r\n        type: 'TELEGRAM',\r\n        link: 'https://t.me/joinchat/du_cBO1kg4s5ZTVh',\r\n        icon: faTelegram\r\n    },\r\n    {\r\n        type: 'DISCORD',\r\n        link: 'https://discord.gg/hpWGqySeFY',\r\n        icon: faDiscord\r\n    }\r\n];\r\n\r\n// Descripción del curso\r\nconst MainDescription = () => (\r\n    <>\r\n        Si te gusta la tecnología y programación para crear cosas de tu imaginación, <b>hoy tienes esa oportunidad.</b><br />\r\n        Inscríbete y aprende una de las bases de datos más populares: <b>MongoDB</b>.<br />\r\n        <b>Requisitos previos: Nociones básicas de programación (operadores booleanos,comandos de líneas y comandos shell y funciones variables) y es recomendable (No es indispensable) tener experiencia con base de datos relacionales (MySQL, Oracle).</b><br /><br />\r\n        <b>Al final de tu inscripción, tendrás acceso a los grupos del curso. No olvides unirte a los grupos de Telegram y Discord que tendrás al final de tu inscripción. Es un requisito para obtener el certificado.</b> <br />\r\n        <b>Para obtener el certificado</b>, debes aprobar <b> el examen que el profesor propondrá al final de la clases. Para esto, debes asistir a la clase de inicio a fin.</b><br /><br />\r\n        El profesor solo contestará por Discord las dudas. En Telegram y Discord agruparemos a los alumnos :). \r\n    </>\r\n);\r\n//<b>Al final de esta clase,</b> te brindaremos un <b>certificado</b> si logras aprobar <b> el examen que el profesor propondrá al final de la clases</b>\r\n\r\n// Número de sesiones\r\nconst numOfSessions = 1;\r\n\r\n// Fecha(s) del evento\r\nconst dateTime = '19 de setiembre, de 4pm a 7pm (Hora Lima - Colombia)';\r\n\r\n// Plataforma(s)\r\nconst platform = 'Google Meets y/o Discord';\r\n\r\n////// NO EDITAR - Lógica\r\n\r\nconst steps = ['Inicio', 'Contacto', 'Listo'];\r\nconst chkPoints = [{ id: 'SI', name: 'Sí', abrev: 'Sí' }];\r\n\r\nconst overrideSpinnerInline = css`\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n`;\r\n\r\nconst Inscripcion = () => {\r\n\r\n    const [activeIndex, setActiveIndex] = useState(0);\r\n    const [loading, setLoading] = useState(false); // Determina si se está enviando el form\r\n    const [success, setSuccess] = useState(true); // Determina si se envío el form sin errores\r\n    const { canGoBackwards, isLast } = useStepObserver(activeIndex, steps.length);\r\n\r\n    const [name, setName] = useState('');\r\n    const [age, setAge] = useState('');\r\n    const [phone, setPhone] = useState('');\r\n    const [messengerType, setMessengerType] = useState(contactTypes[0]);\r\n    const [email, setEmail] = useState('');\r\n    const [profession, setProfession] = useState('');\r\n    const [fromType, setFromType] = useState(fromTypes[0]);\r\n    const [knowLevelType, setKnowLevelType] = useState(knowLevelTypes[0]);\r\n    const [points, setPoints] = useState([]);\r\n\r\n    const history = useHistory();\r\n\r\n    const updName = (e) => {\r\n        setName(e.target.value);\r\n    }\r\n\r\n    const updAge = (e) => {\r\n        setAge(e.target.value);\r\n    }\r\n\r\n    const updPhone = (e) => {\r\n        setPhone(e.target.value);\r\n    }\r\n\r\n    const updMessengerType = (val) => {\r\n        setMessengerType(val);\r\n    }\r\n\r\n    const updFromType = (val) => {\r\n        setFromType(val);\r\n    }\r\n\r\n    const updKnowLevelType = (val) => {\r\n        setKnowLevelType(val);\r\n    }\r\n\r\n    const updEmail = (e) => {\r\n        setEmail(e.target.value);\r\n    }\r\n\r\n    const updProfession = (e) => {\r\n        setProfession(e.target.value);\r\n    }\r\n\r\n    const selectPoint = (id) => {\r\n        if (includesPoint(id)) {\r\n            setPoints(points.filter(p => p != id));\r\n        } else {\r\n            setPoints([...points, id]);\r\n        }\r\n    }\r\n\r\n    const previous = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex - 1);\r\n    }\r\n\r\n    const next = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex + 1);\r\n    }\r\n\r\n    const send = async (e) => {\r\n        e.preventDefault();\r\n        if (!checkErrors()) {\r\n            setLoading(true);\r\n            saveChanges();\r\n        }\r\n    }\r\n\r\n    const saveChanges = () => {\r\n\r\n        const idEvento = history.location.pathname.toString().replace(/\\//g, '').replace(/enr-event/g, '');\r\n\r\n        const data = {\r\n            eventId: idEvento,\r\n            eventName: mainTitle,\r\n            name: aNombre(name.trim()),\r\n            age: parseInt(age),\r\n            profession: profession,\r\n            phone: phone.trim(),\r\n            email: email.trim(),\r\n            fromType: fromType.type,\r\n            knowLevelType: knowLevelType.type\r\n        };\r\n\r\n        guardarInscripcion(data).then(() => {\r\n            window.scrollTo(0, 0);\r\n            setLoading(false);\r\n            setSuccess(true);\r\n        });\r\n    }\r\n\r\n    const checkErrors = () => {\r\n\r\n        let error = (esNombreInvalido(name) || esEdadInvalida(age) || esTelefonoInvalido(phone) || esCorreoInvalido(email) || esProfesionInvalida(profession));\r\n\r\n        // Custom errors\r\n        if (!includesPoint('SI')) {\r\n            error = 'Debes confirmar tu asistencia';\r\n        }\r\n\r\n        if (error) {\r\n            alert(error);\r\n            return true;\r\n        };\r\n\r\n        return false;\r\n    }\r\n\r\n    const includesPoint = (pointId) => {\r\n        return points.find(p => p == pointId);\r\n    }\r\n\r\n    const navigateTo = (index) => {\r\n        setActiveIndex(index);\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0);\r\n        setSuccess(false);\r\n    }, [activeIndex]);\r\n\r\n    return (\r\n        <div>\r\n            <HelmetMetaData title={mainTitle + ' - Academia Temple'} description=\"¿Quieres destacar? Aprende C++.\" />\r\n            <Navbar />\r\n            <main className=\"cuerpo-pagina\">\r\n                <div className=\"full-background\" style={{ backgroundImage: `url('${backgroundImg}')` }} />\r\n                <section className='contenedor contenedor-60 section position-relative z-2'>\r\n                    <h2 className='titulo-seccion mb-4 text-left titulo-curso'>{mainTitle}</h2>\r\n                    <p className='descripcion-curso color-dark-blue'>Con {hostName}</p>\r\n                </section>\r\n                <section className='contenedor contenedor-60 position-relative'>\r\n                    <div className='floating-form'>\r\n                        {\r\n                            success\r\n                                ?\r\n                                <div className='form-container text-align-center'>\r\n                                    <Fade bottom>\r\n                                        <FontAwesomeIcon color={'#3DE58D'} icon={faCheckCircle} style={{ fontSize: '8rem' }} />\r\n                                        <h3 className='titulo-seccion mt-2 mb-2'>Listo</h3>\r\n                                    </Fade>\r\n                                    <p className='descripcion-curso m0-auto'>¡No olvides unirte a los grupos del curso!</p>\r\n                                    <FontAwesomeIcon icon={faAngleDown} size='2x' />\r\n\r\n                                    {\r\n                                        joinGroups.map((group, index) => (\r\n                                            <div className={`form-buttons-container ${index == 0 ? 'mt-3' : ''} ${index == joinGroups.length - 1 ? '' : 'mb-3'}`}>\r\n                                                <a href={group.link} className='boton btn-principal m0-auto'>\r\n                                                    <FontAwesomeIcon icon={group.icon} size='1x' />\r\n                                                    {' '}\r\n                                                    <span>\r\n                                                        Unirme\r\n                                                    </span>\r\n                                                </a>\r\n                                            </div>\r\n                                        ))\r\n                                    }\r\n                                </div>\r\n                                :\r\n                                <>\r\n                                    <Steps\r\n                                        activeIndex={activeIndex}\r\n                                        navigateTo={navigateTo}\r\n                                        steps={steps} />\r\n                                    <div className='form-container'>\r\n                                        <form>\r\n                                            <StepManager currentIndex={activeIndex}>\r\n                                                <div className='step-1'>\r\n\r\n                                                    <div className='form-group mb-0'>\r\n                                                        <h2 className='titulo-seccion'>¡Bienvenido(a) al curso!</h2>\r\n                                                        <p className='descripcion-curso no-break'>\r\n                                                            <MainDescription />\r\n                                                            <div className=\"contenedor-curso-profesor mt-5\">\r\n                                                                <div className=\"contenedor-img\">\r\n                                                                    <Avatar img={teacherImg} />\r\n                                                                </div>\r\n                                                                <div className=\"contenedor-descripcion\">\r\n                                                                    <h4>\r\n                                                                        <Link to={`/teacher-detail/?id=${teacherId}`}>\r\n                                                                            {hostName}\r\n                                                                        </Link>\r\n                                                                    </h4>\r\n                                                                    <p className=\"descripcion-curso clamp clamp-2 no-break\">\r\n                                                                        {teacherDescription}\r\n                                                                    </p>\r\n                                                                </div>\r\n                                                            </div>\r\n                                                            <b>*Si te inscribes e incumples, serás retirado del grupo.</b><br /><br />\r\n                                                        </p>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <ul>\r\n                                                            <li><b>Número de sesiones:</b> {numOfSessions}</li>\r\n                                                            <li><b>Horarios:</b> {dateTime}</li>\r\n                                                            <li><b>Profesor:</b> {hostName}</li>\r\n                                                            <li><b>Plataforma:</b> {platform}</li>\r\n                                                        </ul>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <p className='descripcion-curso'>Presiona siguiente para continuar.</p>\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-2'>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNombres\">¿Cuáles son tus nombres completos?</label>\r\n                                                        <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={name} onChange={updName} id=\"txtNombres\" placeholder=\"Ejemplo: Alex Chancón\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtEdad\">¿Qué edad tienes?</label>\r\n                                                        <input type=\"number\" min={10} max={99} value={age} onChange={updAge} id=\"txtEdad\" placeholder=\"Ingresa tu edad\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNumero\">¿Con qué número entrarás? (con código de país)</label>\r\n                                                        <div className='cbo-text'>\r\n                                                            <DropdownImage\r\n                                                                selectedItem={messengerType}\r\n                                                                list={[contactTypes[0]]}\r\n                                                                select={updMessengerType} />\r\n                                                            <input type=\"text\" value={phone} onChange={updPhone} id=\"txtNumero\" placeholder=\"Ej: +51 999 999 999\" />\r\n                                                        </div>\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtCorreo\">Bríndanos tu correo de contacto</label>\r\n                                                        <input minLength=\"6\" maxLength=\"100\" type=\"email\" value={email} onChange={updEmail} id=\"txtCorreo\" placeholder=\"Ingresa tu correo\" />\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-3'>\r\n\r\n                                                    <div className='form-group'>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtProfesion\">¿Cuál es tu profesión o cuál estudias?</label>\r\n                                                            <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={profession} onChange={updProfession} id=\"txtProfesion\" placeholder=\"Ingresa tu profesión\" />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cómo te enteraste del curso?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={fromType}\r\n                                                                list={fromTypes}\r\n                                                                select={updFromType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cuánto conoces del tema a dictar?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={knowLevelType}\r\n                                                                list={knowLevelTypes}\r\n                                                                select={updKnowLevelType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">He leído los horarios y confirmo mi asistencia.</label>\r\n                                                            {\r\n                                                                chkPoints.map(point => {\r\n                                                                    const included = includesPoint(point.id);\r\n                                                                    return (\r\n                                                                        <div key={point.id} onClick={() => selectPoint(point.id)} className={`chkTag ${included ? 'active' : ''}`}>\r\n                                                                            {\r\n                                                                                included\r\n                                                                                    ?\r\n                                                                                    <FontAwesomeIcon color={'white'} icon={faCheck} style={{ fontSize: '1.6rem' }} />\r\n                                                                                    :\r\n                                                                                    <FontAwesomeIcon color={'#adadad'} icon={faDotCircle} style={{ fontSize: '1.6rem' }} />\r\n                                                                            }\r\n                                                                            {' '}\r\n                                                                            {point.name}\r\n                                                                        </div>\r\n                                                                    )\r\n                                                                })\r\n                                                            }\r\n                                                        </div>\r\n                                                    </div>\r\n                                                </div>\r\n                                            </StepManager>\r\n                                            <div className='form-buttons-container'>\r\n                                                {\r\n                                                    canGoBackwards && !loading\r\n                                                    &&\r\n                                                    <button onClick={previous} className='boton btn-principal'>\r\n                                                        <FontAwesomeIcon icon={faAngleLeft} size='xl' />\r\n                                                        {' '}\r\n                                                        <span className='d-none d-md-inline'>\r\n                                                            Anterior\r\n                                                        </span>\r\n                                                    </button>\r\n                                                }\r\n                                                {\r\n                                                    loading\r\n                                                        ?\r\n                                                        <span className='boton btn-principal justify-self-right'>\r\n                                                            Enviando\r\n                                                            {' '}\r\n                                                            <ClipLoader color={'#fff'} loading={true} css={overrideSpinnerInline} size={22} />\r\n                                                        </span>\r\n                                                        :\r\n                                                        isLast\r\n                                                            ?\r\n                                                            <button onClick={send} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Enviar\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faCheck} size='xl' />\r\n                                                            </button>\r\n                                                            :\r\n                                                            <button onClick={next} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Siguiente\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faAngleRight} size='xl' />\r\n                                                            </button>\r\n                                                }\r\n                                            </div>\r\n                                        </form>\r\n                                    </div>\r\n                                </>\r\n                        }\r\n                    </div>\r\n\r\n                </section>\r\n            </main>\r\n            <Footer />\r\n        </div >\r\n    );\r\n}\r\n\r\nexport default Inscripcion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-PROTECCIONDEDATOS-PROFELEAL-1.js",["321","322","323","324"],"import React, { useState, useEffect } from 'react'\r\nimport Footer from '../../components/footer/footer';\r\nimport Navbar from '../../components/navbar';\r\nimport DropdownImage from '../../components/dropdown-image';\r\nimport ClipLoader from \"react-spinners/ClipLoader\";\r\nimport Steps from '../../components/forms/forms-steps';\r\nimport StepManager from '../../components/forms/step-manager/step-manager';\r\nimport Fade from 'react-reveal/Fade';\r\nimport HelmetMetaData from \"../../components/helmet\";\r\nimport Avatar from \"../../components/avatar\";\r\nimport { aNombre } from '../../helpers/funcionesTexto';\r\nimport { esNombreInvalido, esEdadInvalida, esTelefonoInvalido, esCorreoInvalido, esProfesionInvalida } from '../../helpers/validadores';\r\nimport { guardarInscripcion } from '../../api';\r\nimport { useStepObserver } from '../../hooks/useStepObserver';\r\nimport { css } from \"@emotion/core\";\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faAngleDown, faAngleLeft, faAngleRight, faCheck, faCheckCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { contactTypes, fromTypes, knowLevelTypes } from '../../data/data';\r\nimport { faDiscord, faTelegram, faWhatsapp } from '@fortawesome/free-brands-svg-icons';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\n// EDITAR\r\n\r\n// Título principal del curso\r\nconst mainTitle = 'Webminar: Importancia de la Protcción de Datos Personales y Empresariales';\r\n\r\n// Nombre del profesor\r\nconst hostName = 'Profe Carlos Leal (https://www.youtube.com/c/ProfeCarlosLeal)';\r\n\r\n// Imagen de fondo\r\nconst backgroundImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2FLJ83RQQiqWowUTpmmTID?alt=media&token=ae625c95-b236-4234-b77b-3a1a9dfb7d80';\r\n\r\n// Id del profesor\r\nconst teacherId = 'LJ83RQQiqWowUTpmmTID';\r\n\r\n// Img del profesor\r\nconst teacherImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2FLJ83RQQiqWowUTpmmTID?alt=media&token=ae625c95-b236-4234-b77b-3a1a9dfb7d80';\r\n\r\n// Descripción corta del profesor\r\nconst teacherDescription = 'Bienvenidos a todos, soy un Docente Universitario, nicaragüense por gracias de Dios, entusiasta del Software Libre y la seguridad informática, por medio de este canal se promueve el uso adecuado de las Tecnologías, especialmente las de software libre y código abierto.';\r\n\r\n// Grupos a los que se unirán: WSP, TELEGRAM, DISCORD\r\nconst joinGroups = [\r\n    {\r\n        type: 'WSP',\r\n        link: 'https://chat.whatsapp.com/HG5880h2bbT4U7Ch4x4Wma',\r\n        icon: faWhatsapp\r\n    },\r\n    {\r\n        type: 'TELEGRAM',\r\n        link: 'https://t.me/joinchat/du_cBO1kg4s5ZTVh',\r\n        icon: faTelegram\r\n    },\r\n    {\r\n        type: 'DISCORD',\r\n        link: 'https://discord.gg/hpWGqySeFY',\r\n        icon: faDiscord\r\n    }\r\n];\r\n\r\n// Descripción del curso\r\nconst MainDescription = () => (\r\n    <>\r\n        Si te gusta la tecnología y programación para crear cosas de tu imaginación, <b>hoy tienes esa oportunidad.</b><br /><br />\r\n        Inscríbete y aprende sobre protección de datos personales y empresariales.<br /><br />\r\n        <b>requisitos previos:  nociones básicas o intermedios de programción. No olvides unirte a los grupos de Telegram y Whatsapp y/o Discord para las dudas o información adicional al curso.</b>\r\n    </>\r\n);\r\n//<b>Al final de esta clase,</b> te brindaremos un <b>certificado</b> si logras aprobar <b> el examen que el profesor propondrá al final de la clases</b>\r\n\r\n// Número de sesiones\r\nconst numOfSessions = 'Hasta donde lleguemos :)';\r\n\r\n// Fecha(s) del evento\r\nconst dateTime = '19 de setiembre, de 4pm a 6pm (Hora Lima - Colombia) (sábados y domingos)';\r\n\r\n// Plataforma(s)\r\nconst platform = 'Google Meets y/o Discord';\r\n\r\n////// NO EDITAR - Lógica\r\n\r\nconst steps = ['Inicio', 'Contacto', 'Listo'];\r\nconst chkPoints = [{ id: 'SI', name: 'Sí', abrev: 'Sí' }];\r\n\r\nconst overrideSpinnerInline = css`\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n`;\r\n\r\nconst Inscripcion = () => {\r\n\r\n    const [activeIndex, setActiveIndex] = useState(0);\r\n    const [loading, setLoading] = useState(false); // Determina si se está enviando el form\r\n    const [success, setSuccess] = useState(true); // Determina si se envío el form sin errores\r\n    const { canGoBackwards, isLast } = useStepObserver(activeIndex, steps.length);\r\n\r\n    const [name, setName] = useState('');\r\n    const [age, setAge] = useState('');\r\n    const [phone, setPhone] = useState('');\r\n    const [messengerType, setMessengerType] = useState(contactTypes[0]);\r\n    const [email, setEmail] = useState('');\r\n    const [profession, setProfession] = useState('');\r\n    const [fromType, setFromType] = useState(fromTypes[0]);\r\n    const [knowLevelType, setKnowLevelType] = useState(knowLevelTypes[0]);\r\n    const [points, setPoints] = useState([]);\r\n\r\n    const history = useHistory();\r\n\r\n    const updName = (e) => {\r\n        setName(e.target.value);\r\n    }\r\n\r\n    const updAge = (e) => {\r\n        setAge(e.target.value);\r\n    }\r\n\r\n    const updPhone = (e) => {\r\n        setPhone(e.target.value);\r\n    }\r\n\r\n    const updMessengerType = (val) => {\r\n        setMessengerType(val);\r\n    }\r\n\r\n    const updFromType = (val) => {\r\n        setFromType(val);\r\n    }\r\n\r\n    const updKnowLevelType = (val) => {\r\n        setKnowLevelType(val);\r\n    }\r\n\r\n    const updEmail = (e) => {\r\n        setEmail(e.target.value);\r\n    }\r\n\r\n    const updProfession = (e) => {\r\n        setProfession(e.target.value);\r\n    }\r\n\r\n    const selectPoint = (id) => {\r\n        if (includesPoint(id)) {\r\n            setPoints(points.filter(p => p != id));\r\n        } else {\r\n            setPoints([...points, id]);\r\n        }\r\n    }\r\n\r\n    const previous = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex - 1);\r\n    }\r\n\r\n    const next = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex + 1);\r\n    }\r\n\r\n    const send = async (e) => {\r\n        e.preventDefault();\r\n        if (!checkErrors()) {\r\n            setLoading(true);\r\n            saveChanges();\r\n        }\r\n    }\r\n\r\n    const saveChanges = () => {\r\n\r\n        const idEvento = history.location.pathname.toString().replace(/\\//g, '').replace(/enr-event/g, '');\r\n\r\n        const data = {\r\n            eventId: idEvento,\r\n            eventName: mainTitle,\r\n            name: aNombre(name.trim()),\r\n            age: parseInt(age),\r\n            profession: profession,\r\n            phone: phone.trim(),\r\n            email: email.trim(),\r\n            fromType: fromType.type,\r\n            knowLevelType: knowLevelType.type\r\n        };\r\n\r\n        guardarInscripcion(data).then(() => {\r\n            window.scrollTo(0, 0);\r\n            setLoading(false);\r\n            setSuccess(true);\r\n        });\r\n    }\r\n\r\n    const checkErrors = () => {\r\n\r\n        let error = (esNombreInvalido(name) || esEdadInvalida(age) || esTelefonoInvalido(phone) || esCorreoInvalido(email) || esProfesionInvalida(profession));\r\n\r\n        // Custom errors\r\n        if (!includesPoint('SI')) {\r\n            error = 'Debes confirmar tu asistencia';\r\n        }\r\n\r\n        if (error) {\r\n            alert(error);\r\n            return true;\r\n        };\r\n\r\n        return false;\r\n    }\r\n\r\n    const includesPoint = (pointId) => {\r\n        return points.find(p => p == pointId);\r\n    }\r\n\r\n    const navigateTo = (index) => {\r\n        setActiveIndex(index);\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0);\r\n        setSuccess(false);\r\n    }, [activeIndex]);\r\n\r\n    return (\r\n        <div>\r\n            <HelmetMetaData title={mainTitle + ' - Academia Temple'} description=\"¿Quieres destacar? Aprende C++.\" />\r\n            <Navbar />\r\n            <main className=\"cuerpo-pagina\">\r\n                <div className=\"full-background\" style={{ backgroundImage: `url('${backgroundImg}')` }} />\r\n                <section className='contenedor contenedor-60 section position-relative z-2'>\r\n                    <h2 className='titulo-seccion mb-4 text-left titulo-curso'>{mainTitle}</h2>\r\n                    <p className='descripcion-curso color-dark-blue'>Con {hostName}</p>\r\n                </section>\r\n                <section className='contenedor contenedor-60 position-relative'>\r\n                    <div className='floating-form'>\r\n                        {\r\n                            success\r\n                                ?\r\n                                <div className='form-container text-align-center'>\r\n                                    <Fade bottom>\r\n                                        <FontAwesomeIcon color={'#3DE58D'} icon={faCheckCircle} style={{ fontSize: '8rem' }} />\r\n                                        <h3 className='titulo-seccion mt-2 mb-2'>Listo</h3>\r\n                                    </Fade>\r\n                                    <p className='descripcion-curso m0-auto'>¡No olvides unirte a los grupos del curso!</p>\r\n                                    <FontAwesomeIcon icon={faAngleDown} size='2x' />\r\n\r\n                                    {\r\n                                        joinGroups.map((group, index) => (\r\n                                            <div className={`form-buttons-container ${index == 0 ? 'mt-3' : ''} ${index == joinGroups.length - 1 ? '' : 'mb-3'}`}>\r\n                                                <a href={group.link} className='boton btn-principal m0-auto'>\r\n                                                    <FontAwesomeIcon icon={group.icon} size='1x' />\r\n                                                    {' '}\r\n                                                    <span>\r\n                                                        Unirme\r\n                                                    </span>\r\n                                                </a>\r\n                                            </div>\r\n                                        ))\r\n                                    }\r\n                                </div>\r\n                                :\r\n                                <>\r\n                                    <Steps\r\n                                        activeIndex={activeIndex}\r\n                                        navigateTo={navigateTo}\r\n                                        steps={steps} />\r\n                                    <div className='form-container'>\r\n                                        <form>\r\n                                            <StepManager currentIndex={activeIndex}>\r\n                                                <div className='step-1'>\r\n\r\n                                                    <div className='form-group mb-0'>\r\n                                                        <h2 className='titulo-seccion'>¡Bienvenido(a) al curso!</h2>\r\n                                                        <p className='descripcion-curso no-break'>\r\n                                                            <MainDescription />\r\n                                                            <div className=\"contenedor-curso-profesor mt-5\">\r\n                                                                <div className=\"contenedor-img\">\r\n                                                                    <Avatar img={teacherImg} />\r\n                                                                </div>\r\n                                                                <div className=\"contenedor-descripcion\">\r\n                                                                    <h4>\r\n                                                                        <Link to={`/teacher-detail/?id=${teacherId}`}>\r\n                                                                            {hostName}\r\n                                                                        </Link>\r\n                                                                    </h4>\r\n                                                                    <p className=\"descripcion-curso clamp clamp-2 no-break\">\r\n                                                                        {teacherDescription}\r\n                                                                    </p>\r\n                                                                </div>\r\n                                                            </div>\r\n                                                            <b>*Si te inscribes e incumples, serás retirado del grupo.</b><br /><br />\r\n                                                        </p>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <ul>\r\n                                                            <li><b>Número de sesiones:</b> {numOfSessions}</li>\r\n                                                            <li><b>Horarios:</b> {dateTime}</li>\r\n                                                            <li><b>Profesor:</b> {hostName}</li>\r\n                                                            <li><b>Plataforma:</b> {platform}</li>\r\n                                                        </ul>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <p className='descripcion-curso'>Presiona siguiente para continuar.</p>\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-2'>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNombres\">¿Cuáles son tus nombres completos?</label>\r\n                                                        <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={name} onChange={updName} id=\"txtNombres\" placeholder=\"Ejemplo: Alex Chancón\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtEdad\">¿Qué edad tienes?</label>\r\n                                                        <input type=\"number\" min={10} max={99} value={age} onChange={updAge} id=\"txtEdad\" placeholder=\"Ingresa tu edad\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNumero\">¿Con qué número entrarás? (con código de país)</label>\r\n                                                        <div className='cbo-text'>\r\n                                                            <DropdownImage\r\n                                                                selectedItem={messengerType}\r\n                                                                list={[contactTypes[0]]}\r\n                                                                select={updMessengerType} />\r\n                                                            <input type=\"text\" value={phone} onChange={updPhone} id=\"txtNumero\" placeholder=\"Ej: +51 999 999 999\" />\r\n                                                        </div>\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtCorreo\">Bríndanos tu correo de contacto</label>\r\n                                                        <input minLength=\"6\" maxLength=\"100\" type=\"email\" value={email} onChange={updEmail} id=\"txtCorreo\" placeholder=\"Ingresa tu correo\" />\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-3'>\r\n\r\n                                                    <div className='form-group'>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtProfesion\">¿Cuál es tu profesión o cuál estudias?</label>\r\n                                                            <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={profession} onChange={updProfession} id=\"txtProfesion\" placeholder=\"Ingresa tu profesión\" />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cómo te enteraste del curso?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={fromType}\r\n                                                                list={fromTypes}\r\n                                                                select={updFromType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cuánto conoces del tema a dictar?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={knowLevelType}\r\n                                                                list={knowLevelTypes}\r\n                                                                select={updKnowLevelType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">He leído los horarios y confirmo mi asistencia.</label>\r\n                                                            {\r\n                                                                chkPoints.map(point => {\r\n                                                                    const included = includesPoint(point.id);\r\n                                                                    return (\r\n                                                                        <div key={point.id} onClick={() => selectPoint(point.id)} className={`chkTag ${included ? 'active' : ''}`}>\r\n                                                                            {\r\n                                                                                included\r\n                                                                                    ?\r\n                                                                                    <FontAwesomeIcon color={'white'} icon={faCheck} style={{ fontSize: '1.6rem' }} />\r\n                                                                                    :\r\n                                                                                    <FontAwesomeIcon color={'#adadad'} icon={faDotCircle} style={{ fontSize: '1.6rem' }} />\r\n                                                                            }\r\n                                                                            {' '}\r\n                                                                            {point.name}\r\n                                                                        </div>\r\n                                                                    )\r\n                                                                })\r\n                                                            }\r\n                                                        </div>\r\n                                                    </div>\r\n                                                </div>\r\n                                            </StepManager>\r\n                                            <div className='form-buttons-container'>\r\n                                                {\r\n                                                    canGoBackwards && !loading\r\n                                                    &&\r\n                                                    <button onClick={previous} className='boton btn-principal'>\r\n                                                        <FontAwesomeIcon icon={faAngleLeft} size='xl' />\r\n                                                        {' '}\r\n                                                        <span className='d-none d-md-inline'>\r\n                                                            Anterior\r\n                                                        </span>\r\n                                                    </button>\r\n                                                }\r\n                                                {\r\n                                                    loading\r\n                                                        ?\r\n                                                        <span className='boton btn-principal justify-self-right'>\r\n                                                            Enviando\r\n                                                            {' '}\r\n                                                            <ClipLoader color={'#fff'} loading={true} css={overrideSpinnerInline} size={22} />\r\n                                                        </span>\r\n                                                        :\r\n                                                        isLast\r\n                                                            ?\r\n                                                            <button onClick={send} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Enviar\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faCheck} size='xl' />\r\n                                                            </button>\r\n                                                            :\r\n                                                            <button onClick={next} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Siguiente\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faAngleRight} size='xl' />\r\n                                                            </button>\r\n                                                }\r\n                                            </div>\r\n                                        </form>\r\n                                    </div>\r\n                                </>\r\n                        }\r\n                    </div>\r\n\r\n                </section>\r\n            </main>\r\n            <Footer />\r\n        </div >\r\n    );\r\n}\r\n\r\nexport default Inscripcion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-INGLES-BENAVIDES-1.js",["325","326","327","328","329","330"],"import React, { useState, useEffect } from 'react'\r\nimport Footer from '../../components/footer/footer';\r\nimport Navbar from '../../components/navbar';\r\nimport DropdownImage from '../../components/dropdown-image';\r\nimport ClipLoader from \"react-spinners/ClipLoader\";\r\nimport Steps from '../../components/forms/forms-steps';\r\nimport StepManager from '../../components/forms/step-manager/step-manager';\r\nimport Fade from 'react-reveal/Fade';\r\nimport HelmetMetaData from \"../../components/helmet\";\r\nimport Avatar from \"../../components/avatar\";\r\nimport { aNombre } from '../../helpers/funcionesTexto';\r\nimport { esNombreInvalido, esEdadInvalida, esTelefonoInvalido, esCorreoInvalido, esProfesionInvalida } from '../../helpers/validadores';\r\nimport { guardarInscripcion } from '../../api';\r\nimport { useStepObserver } from '../../hooks/useStepObserver';\r\nimport { css } from \"@emotion/core\";\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faAngleDown, faAngleLeft, faAngleRight, faCheck, faCheckCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { contactTypes, fromTypes, knowLevelTypes } from '../../data/data';\r\nimport { faDiscord, faTelegram, faWhatsapp } from '@fortawesome/free-brands-svg-icons';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\n// EDITAR\r\n\r\n// Título principal del curso\r\nconst mainTitle = 'Aprende inglés';\r\n\r\n// Nombre del profesor\r\nconst hostName = 'Alexander Benavides Cabrera';\r\n\r\n// Imagen de fondo\r\nconst backgroundImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/formularios%2Fpastel-de-fua.jpg?alt=media&token=d0c9b41f-06ab-42d3-ba1d-f9c05c1b9ea3';\r\n\r\n// Id del profesor\r\nconst teacherId = 'th8rfRO62cYIxEFWpSeS';\r\n\r\n// Img del profesor\r\nconst teacherImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2Fth8rfRO62cYIxEFWpSeS?alt=media&token=e6d92d6f-7041-4472-8223-3c61b890fc86';\r\n\r\n// Descripción corta del profesor\r\nconst teacherDescription = 'Bienvenidos a todos, mi nombre es Alexander Benavides Cabrera y tengo experiencia en TOELF exam de inglés.';\r\n\r\n// Grupos a los que se unirán: WSP, TELEGRAM, DISCORD\r\nconst joinGroups = [\r\n    \r\n    \r\n    \r\n    \r\n    {\r\n        type: 'WSP',\r\n        link: 'https://chat.whatsapp.com/B7UxIj8g9vJHPH7EmsB1Ta',\r\n        icon: faWhatsapp\r\n    },\r\n\r\n\r\n];\r\n\r\n// Descripción del curso\r\nconst MainDescription = () => (\r\n    <>\r\n        Si te gusta la tecnología, programación o quieres seguir mejorando en tu ámbito profesional, <b>hoy tienes esa oportunidad.</b><br /><br />\r\n        Inscríbete y aprende el idioma más importante: <b>inglés </b>.Los esperamos :) <br /><br /> \r\n        requisitos previos:  no hay requisitos y solo debes tener ganas de aprender.<br /><br />\r\n        <b>ES GRATIS Y ESPERAMOS TU COMPROMISO POR ASISTIR A CLASES SINO SERÁS RETIRADO.</b>\r\n\r\n    </>\r\n);\r\n//<b>Al final de esta clase,</b> te brindaremos un <b>certificado</b> si logras aprobar <b> el examen que el profesor propondrá al final de la clases</b>\r\n\r\n// Número de sesiones\r\nconst numOfSessions = '1 ciclo';\r\n\r\n// Fecha(s) del evento\r\nconst dateTime = 'Inicio sábado 2 de octubre, Sáb-domingo (7pm a 8pm Hora Lima - Colombia) y miércoles (8p.m-9p.m Hora Lima - Colombia)';\r\n\r\n// Plataforma(s)\r\nconst platform = 'Google Meets';\r\n\r\n////// NO EDITAR - Lógica\r\n\r\nconst steps = ['Inicio', 'Contacto', 'Listo'];\r\nconst chkPoints = [{ id: 'SI', name: 'Sí', abrev: 'Sí' }];\r\n\r\nconst overrideSpinnerInline = css`\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n`;\r\n\r\nconst Inscripcion = () => {\r\n\r\n    const [activeIndex, setActiveIndex] = useState(0);\r\n    const [loading, setLoading] = useState(false); // Determina si se está enviando el form\r\n    const [success, setSuccess] = useState(true); // Determina si se envío el form sin errores\r\n    const { canGoBackwards, isLast } = useStepObserver(activeIndex, steps.length);\r\n\r\n    const [name, setName] = useState('');\r\n    const [age, setAge] = useState('');\r\n    const [phone, setPhone] = useState('');\r\n    const [messengerType, setMessengerType] = useState(contactTypes[0]);\r\n    const [email, setEmail] = useState('');\r\n    const [profession, setProfession] = useState('');\r\n    const [fromType, setFromType] = useState(fromTypes[0]);\r\n    const [knowLevelType, setKnowLevelType] = useState(knowLevelTypes[0]);\r\n    const [points, setPoints] = useState([]);\r\n\r\n    const history = useHistory();\r\n\r\n    const updName = (e) => {\r\n        setName(e.target.value);\r\n    }\r\n\r\n    const updAge = (e) => {\r\n        setAge(e.target.value);\r\n    }\r\n\r\n    const updPhone = (e) => {\r\n        setPhone(e.target.value);\r\n    }\r\n\r\n    const updMessengerType = (val) => {\r\n        setMessengerType(val);\r\n    }\r\n\r\n    const updFromType = (val) => {\r\n        setFromType(val);\r\n    }\r\n\r\n    const updKnowLevelType = (val) => {\r\n        setKnowLevelType(val);\r\n    }\r\n\r\n    const updEmail = (e) => {\r\n        setEmail(e.target.value);\r\n    }\r\n\r\n    const updProfession = (e) => {\r\n        setProfession(e.target.value);\r\n    }\r\n\r\n    const selectPoint = (id) => {\r\n        if (includesPoint(id)) {\r\n            setPoints(points.filter(p => p != id));\r\n        } else {\r\n            setPoints([...points, id]);\r\n        }\r\n    }\r\n\r\n    const previous = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex - 1);\r\n    }\r\n\r\n    const next = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex + 1);\r\n    }\r\n\r\n    const send = async (e) => {\r\n        e.preventDefault();\r\n        if (!checkErrors()) {\r\n            setLoading(true);\r\n            saveChanges();\r\n        }\r\n    }\r\n\r\n    const saveChanges = () => {\r\n\r\n        const idEvento = history.location.pathname.toString().replace(/\\//g, '').replace(/enr-event/g, '');\r\n\r\n        const data = {\r\n            eventId: idEvento,\r\n            eventName: mainTitle,\r\n            name: aNombre(name.trim()),\r\n            age: parseInt(age),\r\n            profession: profession,\r\n            phone: phone.trim(),\r\n            email: email.trim(),\r\n            fromType: fromType.type,\r\n            knowLevelType: knowLevelType.type\r\n        };\r\n\r\n        guardarInscripcion(data).then(() => {\r\n            window.scrollTo(0, 0);\r\n            setLoading(false);\r\n            setSuccess(true);\r\n        });\r\n    }\r\n\r\n    const checkErrors = () => {\r\n\r\n        let error = (esNombreInvalido(name) || esEdadInvalida(age) || esTelefonoInvalido(phone) || esCorreoInvalido(email) || esProfesionInvalida(profession));\r\n\r\n        // Custom errors\r\n        if (!includesPoint('SI')) {\r\n            error = 'Debes confirmar tu asistencia';\r\n        }\r\n\r\n        if (error) {\r\n            alert(error);\r\n            return true;\r\n        };\r\n\r\n        return false;\r\n    }\r\n\r\n    const includesPoint = (pointId) => {\r\n        return points.find(p => p == pointId);\r\n    }\r\n\r\n    const navigateTo = (index) => {\r\n        setActiveIndex(index);\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0);\r\n        setSuccess(false);\r\n    }, [activeIndex]);\r\n\r\n    return (\r\n        <div>\r\n            <HelmetMetaData title={mainTitle + ' - Academia Temple'} description=\"¿Quieres destacar? Aprende C++.\" />\r\n            <Navbar />\r\n            <main className=\"cuerpo-pagina\">\r\n                <div className=\"full-background\" style={{ backgroundImage: `url('${backgroundImg}')` }} />\r\n                <section className='contenedor contenedor-60 section position-relative z-2'>\r\n                    <h2 className='titulo-seccion mb-4 text-left titulo-curso'>{mainTitle}</h2>\r\n                    <p className='descripcion-curso color-dark-blue'>Con {hostName}</p>\r\n                </section>\r\n                <section className='contenedor contenedor-60 position-relative'>\r\n                    <div className='floating-form'>\r\n                        {\r\n                            success\r\n                                ?\r\n                                <div className='form-container text-align-center'>\r\n                                    <Fade bottom>\r\n                                        <FontAwesomeIcon color={'#3DE58D'} icon={faCheckCircle} style={{ fontSize: '8rem' }} />\r\n                                        <h3 className='titulo-seccion mt-2 mb-2'>Listo</h3>\r\n                                    </Fade>\r\n                                    <p className='descripcion-curso m0-auto'>¡No olvides unirte a los grupos del curso!</p>\r\n                                    <FontAwesomeIcon icon={faAngleDown} size='2x' />\r\n\r\n                                    {\r\n                                        joinGroups.map((group, index) => (\r\n                                            <div className={`form-buttons-container ${index == 0 ? 'mt-3' : ''} ${index == joinGroups.length - 1 ? '' : 'mb-3'}`}>\r\n                                                <a href={group.link} className='boton btn-principal m0-auto'>\r\n                                                    <FontAwesomeIcon icon={group.icon} size='1x' />\r\n                                                    {' '}\r\n                                                    <span>\r\n                                                        Unirme\r\n                                                    </span>\r\n                                                </a>\r\n                                            </div>\r\n                                        ))\r\n                                    }\r\n                                </div>\r\n                                :\r\n                                <>\r\n                                    <Steps\r\n                                        activeIndex={activeIndex}\r\n                                        navigateTo={navigateTo}\r\n                                        steps={steps} />\r\n                                    <div className='form-container'>\r\n                                        <form>\r\n                                            <StepManager currentIndex={activeIndex}>\r\n                                                <div className='step-1'>\r\n\r\n                                                    <div className='form-group mb-0'>\r\n                                                        <h2 className='titulo-seccion'>¡Bienvenido(a) al curso!</h2>\r\n                                                        <p className='descripcion-curso no-break'>\r\n                                                            <MainDescription />\r\n                                                            <div className=\"contenedor-curso-profesor mt-5\">\r\n                                                                <div className=\"contenedor-img\">\r\n                                                                    <Avatar img={teacherImg} />\r\n                                                                </div>\r\n                                                                <div className=\"contenedor-descripcion\">\r\n                                                                    <h4>\r\n                                                                        <Link to={`/teacher-detail/?id=${teacherId}`}>\r\n                                                                            {hostName}\r\n                                                                        </Link>\r\n                                                                    </h4>\r\n                                                                    <p className=\"descripcion-curso clamp clamp-2 no-break\">\r\n                                                                        {teacherDescription}\r\n                                                                    </p>\r\n                                                                </div>\r\n                                                            </div>\r\n                                                            <b>*Si te inscribes e incumples, serás retirado del grupo.</b><br /><br />\r\n                                                        </p>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <ul>\r\n                                                            <li><b>Número de sesiones:</b> {numOfSessions}</li>\r\n                                                            <li><b>Horarios:</b> {dateTime}</li>\r\n                                                            <li><b>Profesor:</b> {hostName}</li>\r\n                                                            <li><b>Plataforma:</b> {platform}</li>\r\n                                                        </ul>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <p className='descripcion-curso'>Presiona siguiente para continuar.</p>\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-2'>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNombres\">¿Cuáles son tus nombres completos?</label>\r\n                                                        <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={name} onChange={updName} id=\"txtNombres\" placeholder=\"Ejemplo: Alex Chancón\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtEdad\">¿Qué edad tienes?</label>\r\n                                                        <input type=\"number\" min={10} max={99} value={age} onChange={updAge} id=\"txtEdad\" placeholder=\"Ingresa tu edad\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNumero\">¿Con qué número entrarás? (con código de país)</label>\r\n                                                        <div className='cbo-text'>\r\n                                                            <DropdownImage\r\n                                                                selectedItem={messengerType}\r\n                                                                list={[contactTypes[0]]}\r\n                                                                select={updMessengerType} />\r\n                                                            <input type=\"text\" value={phone} onChange={updPhone} id=\"txtNumero\" placeholder=\"Ej: +51 999 999 999\" />\r\n                                                        </div>\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtCorreo\">Bríndanos tu correo de contacto</label>\r\n                                                        <input minLength=\"6\" maxLength=\"100\" type=\"email\" value={email} onChange={updEmail} id=\"txtCorreo\" placeholder=\"Ingresa tu correo\" />\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-3'>\r\n\r\n                                                    <div className='form-group'>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtProfesion\">¿Cuál es tu profesión o cuál estudias?</label>\r\n                                                            <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={profession} onChange={updProfession} id=\"txtProfesion\" placeholder=\"Ingresa tu profesión\" />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cómo te enteraste del curso?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={fromType}\r\n                                                                list={fromTypes}\r\n                                                                select={updFromType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cuánto conoces del tema a dictar?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={knowLevelType}\r\n                                                                list={knowLevelTypes}\r\n                                                                select={updKnowLevelType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">He leído los horarios y confirmo mi asistencia.</label>\r\n                                                            {\r\n                                                                chkPoints.map(point => {\r\n                                                                    const included = includesPoint(point.id);\r\n                                                                    return (\r\n                                                                        <div key={point.id} onClick={() => selectPoint(point.id)} className={`chkTag ${included ? 'active' : ''}`}>\r\n                                                                            {\r\n                                                                                included\r\n                                                                                    ?\r\n                                                                                    <FontAwesomeIcon color={'white'} icon={faCheck} style={{ fontSize: '1.6rem' }} />\r\n                                                                                    :\r\n                                                                                    <FontAwesomeIcon color={'#adadad'} icon={faDotCircle} style={{ fontSize: '1.6rem' }} />\r\n                                                                            }\r\n                                                                            {' '}\r\n                                                                            {point.name}\r\n                                                                        </div>\r\n                                                                    )\r\n                                                                })\r\n                                                            }\r\n                                                        </div>\r\n                                                    </div>\r\n                                                </div>\r\n                                            </StepManager>\r\n                                            <div className='form-buttons-container'>\r\n                                                {\r\n                                                    canGoBackwards && !loading\r\n                                                    &&\r\n                                                    <button onClick={previous} className='boton btn-principal'>\r\n                                                        <FontAwesomeIcon icon={faAngleLeft} size='xl' />\r\n                                                        {' '}\r\n                                                        <span className='d-none d-md-inline'>\r\n                                                            Anterior\r\n                                                        </span>\r\n                                                    </button>\r\n                                                }\r\n                                                {\r\n                                                    loading\r\n                                                        ?\r\n                                                        <span className='boton btn-principal justify-self-right'>\r\n                                                            Enviando\r\n                                                            {' '}\r\n                                                            <ClipLoader color={'#fff'} loading={true} css={overrideSpinnerInline} size={22} />\r\n                                                        </span>\r\n                                                        :\r\n                                                        isLast\r\n                                                            ?\r\n                                                            <button onClick={send} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Enviar\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faCheck} size='xl' />\r\n                                                            </button>\r\n                                                            :\r\n                                                            <button onClick={next} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Siguiente\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faAngleRight} size='xl' />\r\n                                                            </button>\r\n                                                }\r\n                                            </div>\r\n                                        </form>\r\n                                    </div>\r\n                                </>\r\n                        }\r\n                    </div>\r\n\r\n                </section>\r\n            </main>\r\n            <Footer />\r\n        </div >\r\n    );\r\n}\r\n\r\nexport default Inscripcion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-PYTHON-RODRIGO-1.js",["331","332","333","334","335","336"],"import React, { useState, useEffect } from 'react'\r\nimport Footer from '../../components/footer/footer';\r\nimport Navbar from '../../components/navbar';\r\nimport DropdownImage from '../../components/dropdown-image';\r\nimport ClipLoader from \"react-spinners/ClipLoader\";\r\nimport Steps from '../../components/forms/forms-steps';\r\nimport StepManager from '../../components/forms/step-manager/step-manager';\r\nimport Fade from 'react-reveal/Fade';\r\nimport HelmetMetaData from \"../../components/helmet\";\r\nimport Avatar from \"../../components/avatar\";\r\nimport { aNombre } from '../../helpers/funcionesTexto';\r\nimport { esNombreInvalido, esEdadInvalida, esTelefonoInvalido, esCorreoInvalido, esProfesionInvalida } from '../../helpers/validadores';\r\nimport { guardarInscripcion } from '../../api';\r\nimport { useStepObserver } from '../../hooks/useStepObserver';\r\nimport { css } from \"@emotion/core\";\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faAngleDown, faAngleLeft, faAngleRight, faCheck, faCheckCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { contactTypes, fromTypes, knowLevelTypes } from '../../data/data';\r\nimport { faDiscord, faTelegram, faWhatsapp } from '@fortawesome/free-brands-svg-icons';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\n// EDITAR\r\n\r\n// Título principal del curso\r\nconst mainTitle = 'Introducción a Python';\r\n\r\n// Nombre del profesor\r\nconst hostName = 'Rodrigo Suárez';\r\n\r\n// Imagen de fondo\r\nconst backgroundImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/formularios%2Fpastel-de-fua.jpg?alt=media&token=d0c9b41f-06ab-42d3-ba1d-f9c05c1b9ea3';\r\n\r\n// Id del profesor\r\nconst teacherId = 'dXu1MzttIxa0tsTaEQV2';\r\n\r\n// Img del profesor\r\nconst teacherImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2FdXu1MzttIxa0tsTaEQV2?alt=media&token=91f04c7d-fc1b-4581-a843-2f4b4b6597b3';\r\n\r\n// Descripción corta del profesor\r\nconst teacherDescription = 'Bienvenidos a todos, Mi nombre es Rodrigo Suárez. Soy bachiller en Ciencias con mención en Ingeniería Informática por la PUCP con ganas de aprender constantemente y enseñar :). ';\r\n\r\n// Grupos a los que se unirán: WSP, TELEGRAM, DISCORD\r\nconst joinGroups = [\r\n    {\r\n        type: 'WSP',\r\n        link: 'https://chat.whatsapp.com/HORNWY3qmcdCkOldAmhkYI',\r\n        icon: faWhatsapp\r\n    },\r\n    \r\n];\r\n\r\n// Descripción del curso\r\nconst MainDescription = () => (\r\n    <>\r\n        Si te gusta la tecnología y programación para crear cosas de tu imaginación, <b>hoy tienes esa oportunidad.</b><br /><br />\r\n        Inscríbete y aprende <b>Python</b>.Los esperamos :). <br /><br /> \r\n        <b>Requisitos previos:  no hay requisitos y solo debes tener ganas de aprender. </b><br /><br />\r\n        <b>Daremos certificado si asisten a la clase completa de manera puntual y entran al grupo de Whatsapp de solo python</b>.\r\n    </>\r\n);\r\n//<b>Al final de esta clase,</b> te brindaremos un <b>certificado</b> si logras aprobar <b> el examen que el profesor propondrá al final de la clases</b>\r\n\r\n// Número de sesiones\r\nconst numOfSessions = 1;\r\n\r\n// Fecha(s) del evento\r\nconst dateTime = '30 de setiembre, de 7pm a 9pm (Hora Lima - Colombia)';\r\n\r\n// Plataforma(s)\r\nconst platform = 'Google Meets y/o Discord';\r\n\r\n////// NO EDITAR - Lógica\r\n\r\nconst steps = ['Inicio', 'Contacto', 'Listo'];\r\nconst chkPoints = [{ id: 'SI', name: 'Sí', abrev: 'Sí' }];\r\n\r\nconst overrideSpinnerInline = css`\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n`;\r\n\r\nconst Inscripcion = () => {\r\n\r\n    const [activeIndex, setActiveIndex] = useState(0);\r\n    const [loading, setLoading] = useState(false); // Determina si se está enviando el form\r\n    const [success, setSuccess] = useState(true); // Determina si se envío el form sin errores\r\n    const { canGoBackwards, isLast } = useStepObserver(activeIndex, steps.length);\r\n\r\n    const [name, setName] = useState('');\r\n    const [age, setAge] = useState('');\r\n    const [phone, setPhone] = useState('');\r\n    const [messengerType, setMessengerType] = useState(contactTypes[0]);\r\n    const [email, setEmail] = useState('');\r\n    const [profession, setProfession] = useState('');\r\n    const [fromType, setFromType] = useState(fromTypes[0]);\r\n    const [knowLevelType, setKnowLevelType] = useState(knowLevelTypes[0]);\r\n    const [points, setPoints] = useState([]);\r\n\r\n    const history = useHistory();\r\n\r\n    const updName = (e) => {\r\n        setName(e.target.value);\r\n    }\r\n\r\n    const updAge = (e) => {\r\n        setAge(e.target.value);\r\n    }\r\n\r\n    const updPhone = (e) => {\r\n        setPhone(e.target.value);\r\n    }\r\n\r\n    const updMessengerType = (val) => {\r\n        setMessengerType(val);\r\n    }\r\n\r\n    const updFromType = (val) => {\r\n        setFromType(val);\r\n    }\r\n\r\n    const updKnowLevelType = (val) => {\r\n        setKnowLevelType(val);\r\n    }\r\n\r\n    const updEmail = (e) => {\r\n        setEmail(e.target.value);\r\n    }\r\n\r\n    const updProfession = (e) => {\r\n        setProfession(e.target.value);\r\n    }\r\n\r\n    const selectPoint = (id) => {\r\n        if (includesPoint(id)) {\r\n            setPoints(points.filter(p => p != id));\r\n        } else {\r\n            setPoints([...points, id]);\r\n        }\r\n    }\r\n\r\n    const previous = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex - 1);\r\n    }\r\n\r\n    const next = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex + 1);\r\n    }\r\n\r\n    const send = async (e) => {\r\n        e.preventDefault();\r\n        if (!checkErrors()) {\r\n            setLoading(true);\r\n            saveChanges();\r\n        }\r\n    }\r\n\r\n    const saveChanges = () => {\r\n\r\n        const idEvento = history.location.pathname.toString().replace(/\\//g, '').replace(/enr-event/g, '');\r\n\r\n        const data = {\r\n            eventId: idEvento,\r\n            eventName: mainTitle,\r\n            name: aNombre(name.trim()),\r\n            age: parseInt(age),\r\n            profession: profession,\r\n            phone: phone.trim(),\r\n            email: email.trim(),\r\n            fromType: fromType.type,\r\n            knowLevelType: knowLevelType.type\r\n        };\r\n\r\n        guardarInscripcion(data).then(() => {\r\n            window.scrollTo(0, 0);\r\n            setLoading(false);\r\n            setSuccess(true);\r\n        });\r\n    }\r\n\r\n    const checkErrors = () => {\r\n\r\n        let error = (esNombreInvalido(name) || esEdadInvalida(age) || esTelefonoInvalido(phone) || esCorreoInvalido(email) || esProfesionInvalida(profession));\r\n\r\n        // Custom errors\r\n        if (!includesPoint('SI')) {\r\n            error = 'Debes confirmar tu asistencia';\r\n        }\r\n\r\n        if (error) {\r\n            alert(error);\r\n            return true;\r\n        };\r\n\r\n        return false;\r\n    }\r\n\r\n    const includesPoint = (pointId) => {\r\n        return points.find(p => p == pointId);\r\n    }\r\n\r\n    const navigateTo = (index) => {\r\n        setActiveIndex(index);\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0);\r\n        setSuccess(false);\r\n    }, [activeIndex]);\r\n\r\n    return (\r\n        <div>\r\n            <HelmetMetaData title={mainTitle + ' - Academia Temple'} description=\"¿Quieres destacar? Aprende C++.\" />\r\n            <Navbar />\r\n            <main className=\"cuerpo-pagina\">\r\n                <div className=\"full-background\" style={{ backgroundImage: `url('${backgroundImg}')` }} />\r\n                <section className='contenedor contenedor-60 section position-relative z-2'>\r\n                    <h2 className='titulo-seccion mb-4 text-left titulo-curso'>{mainTitle}</h2>\r\n                    <p className='descripcion-curso color-dark-blue'>Con {hostName}</p>\r\n                </section>\r\n                <section className='contenedor contenedor-60 position-relative'>\r\n                    <div className='floating-form'>\r\n                        {\r\n                            success\r\n                                ?\r\n                                <div className='form-container text-align-center'>\r\n                                    <Fade bottom>\r\n                                        <FontAwesomeIcon color={'#3DE58D'} icon={faCheckCircle} style={{ fontSize: '8rem' }} />\r\n                                        <h3 className='titulo-seccion mt-2 mb-2'>Listo</h3>\r\n                                    </Fade>\r\n                                    <p className='descripcion-curso m0-auto'>¡No olvides unirte a los grupos del curso!</p>\r\n                                    <FontAwesomeIcon icon={faAngleDown} size='2x' />\r\n\r\n                                    {\r\n                                        joinGroups.map((group, index) => (\r\n                                            <div className={`form-buttons-container ${index == 0 ? 'mt-3' : ''} ${index == joinGroups.length - 1 ? '' : 'mb-3'}`}>\r\n                                                <a href={group.link} className='boton btn-principal m0-auto'>\r\n                                                    <FontAwesomeIcon icon={group.icon} size='1x' />\r\n                                                    {' '}\r\n                                                    <span>\r\n                                                        Unirme\r\n                                                    </span>\r\n                                                </a>\r\n                                            </div>\r\n                                        ))\r\n                                    }\r\n                                </div>\r\n                                :\r\n                                <>\r\n                                    <Steps\r\n                                        activeIndex={activeIndex}\r\n                                        navigateTo={navigateTo}\r\n                                        steps={steps} />\r\n                                    <div className='form-container'>\r\n                                        <form>\r\n                                            <StepManager currentIndex={activeIndex}>\r\n                                                <div className='step-1'>\r\n\r\n                                                    <div className='form-group mb-0'>\r\n                                                        <h2 className='titulo-seccion'>¡Bienvenido(a) al curso!</h2>\r\n                                                        <p className='descripcion-curso no-break'>\r\n                                                            <MainDescription />\r\n                                                            <div className=\"contenedor-curso-profesor mt-5\">\r\n                                                                <div className=\"contenedor-img\">\r\n                                                                    <Avatar img={teacherImg} />\r\n                                                                </div>\r\n                                                                <div className=\"contenedor-descripcion\">\r\n                                                                    <h4>\r\n                                                                        <Link to={`/teacher-detail/?id=${teacherId}`}>\r\n                                                                            {hostName}\r\n                                                                        </Link>\r\n                                                                    </h4>\r\n                                                                    <p className=\"descripcion-curso clamp clamp-2 no-break\">\r\n                                                                        {teacherDescription}\r\n                                                                    </p>\r\n                                                                </div>\r\n                                                            </div>\r\n                                                            <b>*Si te inscribes e incumples, serás retirado del grupo.</b><br /><br />\r\n                                                        </p>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <ul>\r\n                                                            <li><b>Número de sesiones:</b> {numOfSessions}</li>\r\n                                                            <li><b>Horarios:</b> {dateTime}</li>\r\n                                                            <li><b>Profesor:</b> {hostName}</li>\r\n                                                            <li><b>Plataforma:</b> {platform}</li>\r\n                                                        </ul>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <p className='descripcion-curso'>Presiona siguiente para continuar.</p>\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-2'>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNombres\">¿Cuáles son tus nombres completos?</label>\r\n                                                        <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={name} onChange={updName} id=\"txtNombres\" placeholder=\"Ejemplo: Alex Chancón\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtEdad\">¿Qué edad tienes?</label>\r\n                                                        <input type=\"number\" min={10} max={99} value={age} onChange={updAge} id=\"txtEdad\" placeholder=\"Ingresa tu edad\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNumero\">¿Con qué número entrarás? (con código de país)</label>\r\n                                                        <div className='cbo-text'>\r\n                                                            <DropdownImage\r\n                                                                selectedItem={messengerType}\r\n                                                                list={[contactTypes[0]]}\r\n                                                                select={updMessengerType} />\r\n                                                            <input type=\"text\" value={phone} onChange={updPhone} id=\"txtNumero\" placeholder=\"Ej: +51 999 999 999\" />\r\n                                                        </div>\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtCorreo\">Bríndanos tu correo de contacto</label>\r\n                                                        <input minLength=\"6\" maxLength=\"100\" type=\"email\" value={email} onChange={updEmail} id=\"txtCorreo\" placeholder=\"Ingresa tu correo\" />\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-3'>\r\n\r\n                                                    <div className='form-group'>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtProfesion\">¿Cuál es tu profesión o cuál estudias?</label>\r\n                                                            <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={profession} onChange={updProfession} id=\"txtProfesion\" placeholder=\"Ingresa tu profesión\" />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cómo te enteraste del curso?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={fromType}\r\n                                                                list={fromTypes}\r\n                                                                select={updFromType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cuánto conoces del tema a dictar?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={knowLevelType}\r\n                                                                list={knowLevelTypes}\r\n                                                                select={updKnowLevelType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">He leído los horarios y confirmo mi asistencia.</label>\r\n                                                            {\r\n                                                                chkPoints.map(point => {\r\n                                                                    const included = includesPoint(point.id);\r\n                                                                    return (\r\n                                                                        <div key={point.id} onClick={() => selectPoint(point.id)} className={`chkTag ${included ? 'active' : ''}`}>\r\n                                                                            {\r\n                                                                                included\r\n                                                                                    ?\r\n                                                                                    <FontAwesomeIcon color={'white'} icon={faCheck} style={{ fontSize: '1.6rem' }} />\r\n                                                                                    :\r\n                                                                                    <FontAwesomeIcon color={'#adadad'} icon={faDotCircle} style={{ fontSize: '1.6rem' }} />\r\n                                                                            }\r\n                                                                            {' '}\r\n                                                                            {point.name}\r\n                                                                        </div>\r\n                                                                    )\r\n                                                                })\r\n                                                            }\r\n                                                        </div>\r\n                                                    </div>\r\n                                                </div>\r\n                                            </StepManager>\r\n                                            <div className='form-buttons-container'>\r\n                                                {\r\n                                                    canGoBackwards && !loading\r\n                                                    &&\r\n                                                    <button onClick={previous} className='boton btn-principal'>\r\n                                                        <FontAwesomeIcon icon={faAngleLeft} size='xl' />\r\n                                                        {' '}\r\n                                                        <span className='d-none d-md-inline'>\r\n                                                            Anterior\r\n                                                        </span>\r\n                                                    </button>\r\n                                                }\r\n                                                {\r\n                                                    loading\r\n                                                        ?\r\n                                                        <span className='boton btn-principal justify-self-right'>\r\n                                                            Enviando\r\n                                                            {' '}\r\n                                                            <ClipLoader color={'#fff'} loading={true} css={overrideSpinnerInline} size={22} />\r\n                                                        </span>\r\n                                                        :\r\n                                                        isLast\r\n                                                            ?\r\n                                                            <button onClick={send} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Enviar\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faCheck} size='xl' />\r\n                                                            </button>\r\n                                                            :\r\n                                                            <button onClick={next} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Siguiente\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faAngleRight} size='xl' />\r\n                                                            </button>\r\n                                                }\r\n                                            </div>\r\n                                        </form>\r\n                                    </div>\r\n                                </>\r\n                        }\r\n                    </div>\r\n\r\n                </section>\r\n            </main>\r\n            <Footer />\r\n        </div >\r\n    );\r\n}\r\n\r\nexport default Inscripcion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-CPP-LOPEZ-1.js",["337","338","339","340"],"import React, { useState, useEffect } from 'react'\r\nimport Footer from '../../components/footer/footer';\r\nimport Navbar from '../../components/navbar';\r\nimport DropdownImage from '../../components/dropdown-image';\r\nimport ClipLoader from \"react-spinners/ClipLoader\";\r\nimport Steps from '../../components/forms/forms-steps';\r\nimport StepManager from '../../components/forms/step-manager/step-manager';\r\nimport Fade from 'react-reveal/Fade';\r\nimport HelmetMetaData from \"../../components/helmet\";\r\nimport Avatar from \"../../components/avatar\";\r\nimport { aNombre } from '../../helpers/funcionesTexto';\r\nimport { esNombreInvalido, esEdadInvalida, esTelefonoInvalido, esCorreoInvalido, esProfesionInvalida } from '../../helpers/validadores';\r\nimport { guardarInscripcion } from '../../api';\r\nimport { useStepObserver } from '../../hooks/useStepObserver';\r\nimport { css } from \"@emotion/core\";\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faAngleDown, faAngleLeft, faAngleRight, faCheck, faCheckCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { contactTypes, fromTypes, knowLevelTypes } from '../../data/data';\r\nimport { faDiscord, faTelegram, faWhatsapp } from '@fortawesome/free-brands-svg-icons';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\n// EDITAR\r\n\r\n// Título principal del curso\r\nconst mainTitle = 'Aprende C++: Una introducción';\r\n\r\n// Nombre del profesor\r\nconst hostName = 'Rodrigo López';\r\n\r\n// Imagen de fondo\r\nconst backgroundImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/formularios%2Fpastel-de-fua.jpg?alt=media&token=d0c9b41f-06ab-42d3-ba1d-f9c05c1b9ea3';\r\n\r\n\r\n// Id del profesor\r\nconst teacherId = 'ZGgdEwJNZjgbZ59IcEGs';\r\n\r\n// Img del profesor\r\nconst teacherImg = 'https://firebasestorage.googleapis.com/v0/b/academia-temple.appspot.com/o/profesores%2FZGgdEwJNZjgbZ59IcEGs?alt=media&token=36eac6d3-99c9-4045-8799-86ed8a05524f';\r\n\r\n// Descripción corta del profesor\r\nconst teacherDescription = ' Bienvenidos a todos, mi nombre es Rodrigo López y soy integrante de la comunidad PUCP. Mi pasión es enseñar y hacer de este mundo un lugar mejor.';\r\n\r\n// Grupos a los que se unirán: WSP, TELEGRAM, DISCORD\r\nconst joinGroups = [\r\n    {\r\n        type: 'WSP',\r\n        link: 'https://chat.whatsapp.com/HML2Rfk2A6y5aSdrQr5LzW',\r\n        icon: faWhatsapp\r\n    },\r\n    {\r\n        type: 'TELEGRAM',\r\n        link: 'link-de-telegram',\r\n        icon: faTelegram\r\n    },\r\n    {\r\n        type: 'DISCORD',\r\n        link: 'link de discord',\r\n        icon: faDiscord\r\n    }\r\n];\r\n\r\n// Descripción del curso\r\nconst MainDescription = () => (\r\n    <>\r\n        Cuando existe muy poco de <b>algo,</b> su valor tiende a subir. Si te gusta la programación, <b>hoy tienes esa oportunidad.</b><br />\r\n        Inscríbete y aprende a un lenguaje <b> que el común de las personas no sabe: C++</b>.<br />\r\n        Haz la diferencia y agrega un conocimiento adicional a tu repertorio.<br /><br />\r\n        <b>Al final de tu inscripción, tendrás acceso a los grupos del curso. No olvides unirte.</b>\r\n    </>\r\n);\r\n//<b>Al final de esta clase,</b> te brindaremos un <b>certificado</b> si logras aprobar <b> el examen que el profesor propondrá al final de la clases</b>\r\n\r\n// Número de sesiones\r\nconst numOfSessions = 1;\r\n\r\n// Fecha(s) del evento\r\nconst dateTime = '19 de junio, de 3pm a 6pm (Hora Lima - Colombia)';\r\n\r\n// Plataforma(s)\r\nconst platform = 'Google Meets';\r\n\r\n////// NO EDITAR - Lógica\r\n\r\nconst steps = ['Inicio', 'Contacto', 'Listo'];\r\nconst chkPoints = [{ id: 'SI', name: 'Sí', abrev: 'Sí' }];\r\n\r\nconst overrideSpinnerInline = css`\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n`;\r\n\r\nconst Inscripcion = () => {\r\n\r\n    const [activeIndex, setActiveIndex] = useState(0);\r\n    const [loading, setLoading] = useState(false); // Determina si se está enviando el form\r\n    const [success, setSuccess] = useState(true); // Determina si se envío el form sin errores\r\n    const { canGoBackwards, isLast } = useStepObserver(activeIndex, steps.length);\r\n\r\n    const [name, setName] = useState('');\r\n    const [age, setAge] = useState('');\r\n    const [phone, setPhone] = useState('');\r\n    const [messengerType, setMessengerType] = useState(contactTypes[0]);\r\n    const [email, setEmail] = useState('');\r\n    const [profession, setProfession] = useState('');\r\n    const [fromType, setFromType] = useState(fromTypes[0]);\r\n    const [knowLevelType, setKnowLevelType] = useState(knowLevelTypes[0]);\r\n    const [points, setPoints] = useState([]);\r\n\r\n    const history = useHistory();\r\n\r\n    const updName = (e) => {\r\n        setName(e.target.value);\r\n    }\r\n\r\n    const updAge = (e) => {\r\n        setAge(e.target.value);\r\n    }\r\n\r\n    const updPhone = (e) => {\r\n        setPhone(e.target.value);\r\n    }\r\n\r\n    const updMessengerType = (val) => {\r\n        setMessengerType(val);\r\n    }\r\n\r\n    const updFromType = (val) => {\r\n        setFromType(val);\r\n    }\r\n\r\n    const updKnowLevelType = (val) => {\r\n        setKnowLevelType(val);\r\n    }\r\n\r\n    const updEmail = (e) => {\r\n        setEmail(e.target.value);\r\n    }\r\n\r\n    const updProfession = (e) => {\r\n        setProfession(e.target.value);\r\n    }\r\n\r\n    const selectPoint = (id) => {\r\n        if (includesPoint(id)) {\r\n            setPoints(points.filter(p => p != id));\r\n        } else {\r\n            setPoints([...points, id]);\r\n        }\r\n    }\r\n\r\n    const previous = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex - 1);\r\n    }\r\n\r\n    const next = (e) => {\r\n        e.preventDefault();\r\n        navigateTo(activeIndex + 1);\r\n    }\r\n\r\n    const send = async (e) => {\r\n        e.preventDefault();\r\n        if (!checkErrors()) {\r\n            setLoading(true);\r\n            saveChanges();\r\n        }\r\n    }\r\n\r\n    const saveChanges = () => {\r\n\r\n        const idEvento = history.location.pathname.toString().replace(/\\//g, '').replace(/enr-event/g, '');\r\n\r\n        const data = {\r\n            eventId: idEvento,\r\n            eventName: mainTitle,\r\n            name: aNombre(name.trim()),\r\n            age: parseInt(age),\r\n            profession: profession,\r\n            phone: phone.trim(),\r\n            email: email.trim(),\r\n            fromType: fromType.type,\r\n            knowLevelType: knowLevelType.type\r\n        };\r\n\r\n        guardarInscripcion(data).then(() => {\r\n            window.scrollTo(0, 0);\r\n            setLoading(false);\r\n            setSuccess(true);\r\n        });\r\n    }\r\n\r\n    const checkErrors = () => {\r\n\r\n        let error = (esNombreInvalido(name) || esEdadInvalida(age) || esTelefonoInvalido(phone) || esCorreoInvalido(email) || esProfesionInvalida(profession));\r\n\r\n        // Custom errors\r\n        if (!includesPoint('SI')) {\r\n            error = 'Debes confirmar tu asistencia';\r\n        }\r\n\r\n        if (error) {\r\n            alert(error);\r\n            return true;\r\n        };\r\n\r\n        return false;\r\n    }\r\n\r\n    const includesPoint = (pointId) => {\r\n        return points.find(p => p == pointId);\r\n    }\r\n\r\n    const navigateTo = (index) => {\r\n        setActiveIndex(index);\r\n    }\r\n\r\n    useEffect(() => {\r\n        window.scrollTo(0, 0);\r\n        setSuccess(false);\r\n    }, [activeIndex]);\r\n\r\n    return (\r\n        <div>\r\n            <HelmetMetaData title={mainTitle + ' - Academia Temple'} description=\"¿Quieres destacar? Aprende C++.\" />\r\n            <Navbar />\r\n            <main className=\"cuerpo-pagina\">\r\n                <div className=\"full-background\" style={{ backgroundImage: `url('${backgroundImg}')` }} />\r\n                <section className='contenedor contenedor-60 section position-relative z-2'>\r\n                    <h2 className='titulo-seccion mb-4 text-left titulo-curso'>{mainTitle}</h2>\r\n                    <p className='descripcion-curso color-dark-blue'>Con {hostName}</p>\r\n                </section>\r\n                <section className='contenedor contenedor-60 position-relative'>\r\n                    <div className='floating-form'>\r\n                        {\r\n                            success\r\n                                ?\r\n                                <div className='form-container text-align-center'>\r\n                                    <Fade bottom>\r\n                                        <FontAwesomeIcon color={'#3DE58D'} icon={faCheckCircle} style={{ fontSize: '8rem' }} />\r\n                                        <h3 className='titulo-seccion mt-2 mb-2'>Listo</h3>\r\n                                    </Fade>\r\n                                    <p className='descripcion-curso m0-auto'>¡No olvides unirte a los grupos del curso!</p>\r\n                                    <FontAwesomeIcon icon={faAngleDown} size='2x' />\r\n\r\n                                    {\r\n                                        joinGroups.map((group, index) => (\r\n                                            <div className={`form-buttons-container ${index == 0 ? 'mt-3' : ''} ${index == joinGroups.length - 1 ? '' : 'mb-3'}`}>\r\n                                                <a href={group.link} className='boton btn-principal m0-auto'>\r\n                                                    <FontAwesomeIcon icon={group.icon} size='1x' />\r\n                                                    {' '}\r\n                                                    <span>\r\n                                                        Unirme\r\n                                                    </span>\r\n                                                </a>\r\n                                            </div>\r\n                                        ))\r\n                                    }\r\n                                </div>\r\n                                :\r\n                                <>\r\n                                    <Steps\r\n                                        activeIndex={activeIndex}\r\n                                        navigateTo={navigateTo}\r\n                                        steps={steps} />\r\n                                    <div className='form-container'>\r\n                                        <form>\r\n                                            <StepManager currentIndex={activeIndex}>\r\n                                                <div className='step-1'>\r\n\r\n                                                    <div className='form-group mb-0'>\r\n                                                        <h2 className='titulo-seccion'>¡Bienvenido(a) al curso!</h2>\r\n                                                        <p className='descripcion-curso no-break'>\r\n                                                            <MainDescription />\r\n                                                            <div className=\"contenedor-curso-profesor mt-5\">\r\n                                                                <div className=\"contenedor-img\">\r\n                                                                    <Avatar img={teacherImg} />\r\n                                                                </div>\r\n                                                                <div className=\"contenedor-descripcion\">\r\n                                                                    <h4>\r\n                                                                        <Link to={`/teacher-detail/?id=${teacherId}`}>\r\n                                                                            {hostName}\r\n                                                                        </Link>\r\n                                                                    </h4>\r\n                                                                    <p className=\"descripcion-curso clamp clamp-2 no-break\">\r\n                                                                        {teacherDescription}\r\n                                                                    </p>\r\n                                                                </div>\r\n                                                            </div>\r\n                                                            <b>*Si te inscribes e incumples, serás retirado del grupo.</b><br /><br />\r\n                                                        </p>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <ul>\r\n                                                            <li><b>Número de sesiones:</b> {numOfSessions}</li>\r\n                                                            <li><b>Horarios:</b> {dateTime}</li>\r\n                                                            <li><b>Profesor:</b> {hostName}</li>\r\n                                                            <li><b>Plataforma:</b> {platform}</li>\r\n                                                        </ul>\r\n                                                    </div>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <p className='descripcion-curso'>Presiona siguiente para continuar.</p>\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-2'>\r\n\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNombres\">¿Cuáles son tus nombres completos?</label>\r\n                                                        <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={name} onChange={updName} id=\"txtNombres\" placeholder=\"Ejemplo: Alex Chancón\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtEdad\">¿Qué edad tienes?</label>\r\n                                                        <input type=\"number\" min={10} max={99} value={age} onChange={updAge} id=\"txtEdad\" placeholder=\"Ingresa tu edad\" />\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtNumero\">¿Con qué número entrarás? (con código de país)</label>\r\n                                                        <div className='cbo-text'>\r\n                                                            <DropdownImage\r\n                                                                selectedItem={messengerType}\r\n                                                                list={[contactTypes[0]]}\r\n                                                                select={updMessengerType} />\r\n                                                            <input type=\"text\" value={phone} onChange={updPhone} id=\"txtNumero\" placeholder=\"Ej: +51 999 999 999\" />\r\n                                                        </div>\r\n                                                    </div>\r\n                                                    <div className='form-group'>\r\n                                                        <label htmlFor=\"txtCorreo\">Bríndanos tu correo de contacto</label>\r\n                                                        <input minLength=\"6\" maxLength=\"100\" type=\"email\" value={email} onChange={updEmail} id=\"txtCorreo\" placeholder=\"Ingresa tu correo\" />\r\n                                                    </div>\r\n\r\n                                                </div>\r\n                                                <div className='step-3'>\r\n\r\n                                                    <div className='form-group'>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtProfesion\">¿Cuál es tu profesión o cuál estudias?</label>\r\n                                                            <input minLength=\"1\" maxLength=\"50\" type=\"text\" value={profession} onChange={updProfession} id=\"txtProfesion\" placeholder=\"Ingresa tu profesión\" />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cómo te enteraste del curso?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={fromType}\r\n                                                                list={fromTypes}\r\n                                                                select={updFromType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">¿Cuánto conoces del tema a dictar?</label>\r\n                                                            <DropdownImage\r\n                                                                stretch\r\n                                                                selectedItem={knowLevelType}\r\n                                                                list={knowLevelTypes}\r\n                                                                select={updKnowLevelType} />\r\n                                                        </div>\r\n\r\n                                                        <div className='form-group'>\r\n                                                            <label htmlFor=\"txtLink\">He leído los horarios y confirmo mi asistencia.</label>\r\n                                                            {\r\n                                                                chkPoints.map(point => {\r\n                                                                    const included = includesPoint(point.id);\r\n                                                                    return (\r\n                                                                        <div key={point.id} onClick={() => selectPoint(point.id)} className={`chkTag ${included ? 'active' : ''}`}>\r\n                                                                            {\r\n                                                                                included\r\n                                                                                    ?\r\n                                                                                    <FontAwesomeIcon color={'white'} icon={faCheck} style={{ fontSize: '1.6rem' }} />\r\n                                                                                    :\r\n                                                                                    <FontAwesomeIcon color={'#adadad'} icon={faDotCircle} style={{ fontSize: '1.6rem' }} />\r\n                                                                            }\r\n                                                                            {' '}\r\n                                                                            {point.name}\r\n                                                                        </div>\r\n                                                                    )\r\n                                                                })\r\n                                                            }\r\n                                                        </div>\r\n                                                    </div>\r\n                                                </div>\r\n                                            </StepManager>\r\n                                            <div className='form-buttons-container'>\r\n                                                {\r\n                                                    canGoBackwards && !loading\r\n                                                    &&\r\n                                                    <button onClick={previous} className='boton btn-principal'>\r\n                                                        <FontAwesomeIcon icon={faAngleLeft} size='xl' />\r\n                                                        {' '}\r\n                                                        <span className='d-none d-md-inline'>\r\n                                                            Anterior\r\n                                                        </span>\r\n                                                    </button>\r\n                                                }\r\n                                                {\r\n                                                    loading\r\n                                                        ?\r\n                                                        <span className='boton btn-principal justify-self-right'>\r\n                                                            Enviando\r\n                                                            {' '}\r\n                                                            <ClipLoader color={'#fff'} loading={true} css={overrideSpinnerInline} size={22} />\r\n                                                        </span>\r\n                                                        :\r\n                                                        isLast\r\n                                                            ?\r\n                                                            <button onClick={send} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Enviar\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faCheck} size='xl' />\r\n                                                            </button>\r\n                                                            :\r\n                                                            <button onClick={next} className='boton btn-principal justify-self-right'>\r\n                                                                <span className='d-none d-md-inline'>\r\n                                                                    Siguiente\r\n                                                                </span>\r\n                                                                {' '}\r\n                                                                <FontAwesomeIcon icon={faAngleRight} size='xl' />\r\n                                                            </button>\r\n                                                }\r\n                                            </div>\r\n                                        </form>\r\n                                    </div>\r\n                                </>\r\n                        }\r\n                    </div>\r\n\r\n                </section>\r\n            </main>\r\n            <Footer />\r\n        </div >\r\n    );\r\n}\r\n\r\nexport default Inscripcion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\pages\\enr_events\\APRENDE-REACT-RAZIEL-2022.js",["341","342","343","344"],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\tabla\\docentes.js",["345","346","347","348","349","350","351"],"import React, { useState, useEffect } from 'react'\r\nimport ModalEdicion from '../../components/modal/edicionProfesor'\r\nimport ModalConfirmacion from '../../components/modal/confirmacion'\r\nimport { obtRegistrosPaginadosAdmin, actEstadoProfesorAdmin } from '../../api'\r\n\r\nconst regMaximo = 10;\r\nconst coleccion = 'docentes';\r\nconst campo = 'nombres';\r\n\r\nconst Docentes = () => {\r\n\r\n    const [pagina, estPagina] = useState(1);\r\n    const [profesores, estProfesores] = useState([]);\r\n    const [cargando, estCargando] = useState(false);\r\n    const [registro, estRegistro] = useState(null); // Establece el registro seleecionado para hacer ediciones o eliminaciones\r\n    const [modo, estModo] = useState(null); // Establece si se está editando o creando un registro\r\n    const [haySiguiente, estHaySiguiente] = useState(false); // Para la paginación\r\n\r\n    // Modal\r\n    const [mostrarEdicion, estMostrarEdicion] = useState(false);\r\n    const [mostrarConfirmacion, estmostrarConfirmacion] = useState(false);\r\n\r\n    useEffect(() => {\r\n        estCargando(true);\r\n        obtenerProfesores();\r\n    }, []);\r\n\r\n    const obtenerProfesores = (reinicio) => {\r\n        // El parámetro reinicio se usa después de editar o crear un registro, para que empiece\r\n        // a mostrar todo desde la primera página\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, null, reinicio ? null : profesores[0], true) // Este parámetro true es para que no se cambien las posiciones cuando haga un cambio de estado\r\n            .then(({ lista, haySiguiente }) => {\r\n                if (reinicio) {\r\n                    estPagina(1);\r\n                }\r\n                estHaySiguiente(haySiguiente);\r\n                estProfesores(lista);\r\n                estCargando(false);\r\n            })\r\n    }\r\n\r\n    // Modal creación/edicion\r\n    const abrirModalEdicion = (registro) => {\r\n        estRegistro(registro);\r\n        estModo('EDICION');\r\n        estMostrarEdicion(true);\r\n    }\r\n    const cerrarModalEdicion = () => {\r\n        estMostrarEdicion(false);\r\n    }\r\n    const abrirModalCreacion = (e) => {\r\n        e.preventDefault();\r\n        estRegistro(undefined);\r\n        estModo('CREACION');\r\n        estMostrarEdicion(true);\r\n    }\r\n    const guardarCambiosEdicion = () => {\r\n        cerrarModalEdicion();\r\n        obtenerProfesores(true);\r\n    }\r\n\r\n    // Modal confirmación\r\n    const abrirModalConfirmacion = (registro) => {\r\n        estRegistro(registro);\r\n        estmostrarConfirmacion(true);\r\n    }\r\n\r\n    const cerrarModalConfirmacion = () => {\r\n        estmostrarConfirmacion(false);\r\n    }\r\n\r\n    const actualizarEstado = () => {\r\n        cerrarModalConfirmacion();\r\n        const nuevoEstado = registro.activo ? 0 : 1;\r\n        actEstadoProfesorAdmin(registro.id, nuevoEstado).then(() => {\r\n            obtenerProfesores();\r\n        });\r\n    }\r\n\r\n    const retroceder = () => {\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, profesores[0])\r\n            .then(({ lista }) => {\r\n                estHaySiguiente(true); // Si retrocedo, es porque siempre hay un siguiente\r\n                estProfesores(lista);\r\n                estPagina(pagina - 1);\r\n            })\r\n    }\r\n\r\n    const avanzar = () => {\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, null, profesores[profesores.length - 1])\r\n            .then(({ lista, haySiguiente }) => {\r\n                estHaySiguiente(haySiguiente);\r\n                estProfesores(lista);\r\n                estPagina(pagina + 1);\r\n            })\r\n    }\r\n\r\n    return (\r\n        <div>\r\n            {\r\n                mostrarConfirmacion\r\n                &&\r\n                <ModalConfirmacion\r\n                    mostrar={mostrarConfirmacion}\r\n                    texto={`¿Quieres ${registro?.activo ? ' desactivar' : ' activar'} este profesor?`}\r\n                    confirmar={actualizarEstado}\r\n                    cancelar={cerrarModalConfirmacion} />\r\n            }\r\n\r\n            {\r\n                mostrarEdicion\r\n                &&\r\n                <ModalEdicion\r\n                    mostrar={mostrarEdicion}\r\n                    modo={modo}\r\n                    data={registro}\r\n                    guardarCambios={guardarCambiosEdicion}\r\n                    cancelar={cerrarModalEdicion} />\r\n            }\r\n\r\n            <div className=\"table-responsive-md\">\r\n                <table className=\"table table-hover\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th scope=\"col\">#</th>\r\n                            <th scope=\"col\">Nombres</th>\r\n                            <th scope=\"col\">Apellidos</th>\r\n                            <th scope=\"col\">Activo</th>\r\n                            <th scope=\"col\">Acciones</th>\r\n                        </tr>\r\n                    </thead>\r\n                    <tbody>\r\n                        {\r\n                            profesores.map((profesor, indice) => (\r\n                                <tr key={profesor.id} className={profesor.activo ? '' : 'table-danger'}>\r\n                                    <th scope=\"row\">{indice + 1}</th>\r\n                                    <td>{profesor.nombres}</td>\r\n                                    <td>{profesor.apellidos}</td>\r\n                                    <td>{profesor.activo ? 'Sí' : 'No'}</td>\r\n                                    <td>\r\n                                        <button onClick={() => abrirModalEdicion(profesor)} className='btn btn-secondary'>\r\n                                            <i className='fa fa-edit'></i>\r\n                                        </button>\r\n                                        {\r\n                                            profesor.activo\r\n                                                ?\r\n                                                <button onClick={() => abrirModalConfirmacion(profesor)} className='btn btn-danger ml-3'>\r\n                                                    <i className='fa fa-power-off'></i>\r\n                                                </button>\r\n                                                :\r\n                                                <button onClick={() => abrirModalConfirmacion(profesor)} className='btn btn-success ml-3'>\r\n                                                    <i className='fa fa-power-off'></i>\r\n                                                </button>\r\n                                        }\r\n                                    </td>\r\n                                </tr>\r\n                            ))\r\n                        }\r\n                    </tbody>\r\n                </table>\r\n            </div>\r\n            <a onClick={abrirModalCreacion} className=\"boton btn-principal d-block mt-4\">\r\n                {'Agregar '}<i className=\"fas fa-plus\" style={{ fontSize: '12px' }}></i>\r\n            </a>\r\n            <ul className=\"pagination pagination-lg justify-content-center mt-4\">\r\n                {\r\n                    pagina > 1 &&\r\n                    <li className=\"page-item\"><a className=\"page-link\" onClick={retroceder}>Anterior</a></li>\r\n                }\r\n                <li className=\"page-item active\"><a className=\"page-link\" href=\"javascript:void(0);\">{pagina}</a></li>\r\n                {\r\n                    haySiguiente\r\n                    &&\r\n                    <li className=\"page-item\"><a className=\"page-link\" onClick={avanzar}>Siguiente</a></li>\r\n                }\r\n            </ul>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Docentes;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\tabla\\cursos.js",["352","353","354","355","356","357","358"],"import React, { useState, useEffect } from 'react'\r\nimport ModalEdicion from '../../components/modal/edicionCurso'\r\nimport ModalConfirmacion from '../../components/modal/confirmacion'\r\nimport ModalClases from '../../components/modal/edicionClases'\r\nimport { obtClasesCurso, obtRegistrosPaginadosAdmin, actEstadoCursoAdmin } from '../../api'\r\n\r\nconst regMaximo = 10;\r\nconst coleccion = 'cursos';\r\nconst campo = 'titulo';\r\n\r\nconst Cursos = () => {\r\n\r\n    // Página\r\n    const [pagina, estPagina] = useState(1);\r\n\r\n    // Cursos\r\n    const [cursos, estCursos] = useState([]);\r\n    const [cargando, estCargando] = useState(false);\r\n\r\n    // Clases por curso\r\n    const [clases, estClases] = useState([]);\r\n    const [cargandoClases, estCargandoClases] = useState(false);\r\n\r\n    const [registro, estRegistro] = useState(null); // Establece el registro seleecionado para hacer ediciones o eliminaciones\r\n    const [modo, estModo] = useState(null); // Establece si se está editando o creando un registro\r\n    const [haySiguiente, estHaySiguiente] = useState(false); // Para la paginación\r\n\r\n    // Refs\r\n    // Modal\r\n    const [mostrarEdicion, estMostrarEdicion] = useState(false);\r\n    const [mostrarConfirmacion, estmostrarConfirmacion] = useState(false);\r\n    const [mostrarClases, estMostrarClases] = useState(false);\r\n\r\n    useEffect(() => {\r\n        estCargando(true);\r\n        obtenerCursos();\r\n    }, []);\r\n\r\n    const actualizarEstado = () => {\r\n        cerrarModalConfirmacion();\r\n        const nuevoEstado = registro.activo ? 0 : 1;\r\n        actEstadoCursoAdmin(registro.id, nuevoEstado).then(() => {\r\n            obtenerCursos();\r\n        });\r\n    }\r\n\r\n    const retroceder = () => {\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, cursos[0])\r\n            .then(({ lista }) => {\r\n                estHaySiguiente(true); // Si retrocedo, es porque siempre hay un siguiente\r\n                estCursos(lista);\r\n                estPagina(pagina - 1);\r\n            })\r\n    }\r\n\r\n    const obtenerCursos = (reinicio) => {\r\n        // El parámetro reinicio se usa después de editar o crear un registro, para que empiece\r\n        // a mostrar todo desde la primera página\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, null, reinicio ? null : cursos[0], true) // Este parámetro true es para que no se cambien las posiciones cuando haga un cambio de estado\r\n            .then(({ lista, haySiguiente }) => {\r\n                if (reinicio) {\r\n                    estPagina(1);\r\n                }\r\n                estHaySiguiente(haySiguiente);\r\n                estCursos(lista);\r\n                estCargando(false);\r\n            })\r\n    }\r\n\r\n    const obtClases = (curso) => {\r\n        estCargandoClases(true);\r\n        obtClasesCurso(curso.id)\r\n            .then(clases => {\r\n                estClases(clases);\r\n                estCargandoClases(false);\r\n            })\r\n            .catch(error => {\r\n                estClases([]);\r\n                estCargandoClases(false);\r\n            })\r\n    }\r\n\r\n    // Modal creación/edicion\r\n    const abrirModalEdicion = (registro) => {\r\n        estRegistro(registro);\r\n        estModo('EDICION');\r\n        estMostrarEdicion(true);\r\n    }\r\n    const cerrarModalEdicion = () => {\r\n        estMostrarEdicion(false);\r\n    }\r\n    const abrirModalCreacion = (e) => {\r\n        e.preventDefault();\r\n        estRegistro(undefined);\r\n        estModo('CREACION');\r\n        estMostrarEdicion(true);\r\n    }\r\n    const guardarCambiosEdicion = () => {\r\n        cerrarModalEdicion();\r\n        obtenerCursos(true);\r\n    }\r\n\r\n    // Modal confirmación\r\n    const abrirModalConfirmacion = (registro) => {\r\n        estRegistro(registro);\r\n        estmostrarConfirmacion(true);\r\n    }\r\n\r\n    const cerrarModalConfirmacion = () => {\r\n        estmostrarConfirmacion(false);\r\n    }\r\n\r\n    // Modal clases\r\n    const abrirModalClases = (curso) => {\r\n        estRegistro(curso);\r\n        obtClases(curso);\r\n        estMostrarClases(true);\r\n    }\r\n\r\n    const cerrarModalClases = (e) => {\r\n        estMostrarClases(false);\r\n    }\r\n\r\n    const guardarCambiosClases = () => {\r\n        obtClases(registro);\r\n    }\r\n\r\n    // Funciones\r\n    const avanzar = () => {\r\n        obtRegistrosPaginadosAdmin(coleccion, campo, regMaximo, null, cursos[cursos.length - 1])\r\n            .then(({ lista, haySiguiente }) => {\r\n                estHaySiguiente(haySiguiente);\r\n                estCursos(lista);\r\n                estPagina(pagina + 1);\r\n            })\r\n    }\r\n\r\n    return (\r\n        <div>\r\n            {\r\n                mostrarConfirmacion\r\n                &&\r\n                <ModalConfirmacion\r\n                    mostrar={mostrarConfirmacion}\r\n                    texto={`¿Quieres ${registro?.activo ? ' desactivar' : ' activar'} este curso?`}\r\n                    confirmar={actualizarEstado}\r\n                    cancelar={cerrarModalConfirmacion} />\r\n            }\r\n            {\r\n                mostrarEdicion\r\n                &&\r\n                <ModalEdicion\r\n                    mostrar={mostrarEdicion}\r\n                    modo={modo}\r\n                    data={registro}\r\n                    guardarCambios={guardarCambiosEdicion}\r\n                    cancelar={cerrarModalEdicion} />\r\n            }\r\n            {\r\n                mostrarClases\r\n                &&\r\n                <ModalClases\r\n                    mostrar={mostrarClases}\r\n                    idCurso={registro?.id}\r\n                    clases={clases}\r\n                    cargandoClases={cargandoClases}\r\n                    guardarCambios={guardarCambiosClases}\r\n                    cancelar={cerrarModalClases} />\r\n            }\r\n\r\n\r\n            <div className=\"table-responsive-md\">\r\n                <table className=\"table table-hover\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th scope=\"col\">#</th>\r\n                            <th scope=\"col\">Título</th>\r\n                            <th scope=\"col\">Días</th>\r\n                            <th scope=\"col\">Horas</th>\r\n                            <th scope=\"col\">Activo</th>\r\n                            <th scope=\"col\">Acciones</th>\r\n                        </tr>\r\n                    </thead>\r\n                    <tbody>\r\n                        {\r\n                            cursos.map((curso, indice) => (\r\n                                <tr key={curso.id} className={curso.activo ? '' : 'table-danger'}>\r\n                                    <th scope=\"row\">{indice + 1}</th>\r\n                                    <td>{curso.titulo}</td>\r\n                                    <td>{curso.dias.join(', ')}</td>\r\n                                    <td>{curso.hInicioFin.join(' a ')}</td>\r\n                                    <td>{curso.activo ? 'Sí' : 'No'}</td>\r\n                                    <td>\r\n                                        <button onClick={() => abrirModalEdicion(curso)} className='btn btn-secondary'>\r\n                                            <i className='fa fa-edit'></i>\r\n                                        </button>\r\n                                        <button onClick={() => abrirModalClases(curso)} className='btn btn-primary ml-3'>\r\n                                            <i className='fas fa-video'></i>\r\n                                        </button>\r\n                                        {\r\n                                            curso.activo\r\n                                                ?\r\n                                                <button onClick={() => abrirModalConfirmacion(curso)} className='btn btn-danger ml-3'>\r\n                                                    <i className='fa fa-power-off'></i>\r\n                                                </button>\r\n                                                :\r\n                                                <button onClick={() => abrirModalConfirmacion(curso)} className='btn btn-success ml-3'>\r\n                                                    <i className='fa fa-power-off'></i>\r\n                                                </button>\r\n                                        }\r\n                                    </td>\r\n                                </tr>\r\n                            ))\r\n                        }\r\n                    </tbody>\r\n                </table>\r\n            </div>\r\n            <a onClick={abrirModalCreacion} className=\"boton btn-principal d-block mt-4\">\r\n                {'Agregar '}<i className=\"fas fa-plus\" style={{ fontSize: '12px' }}></i>\r\n            </a>\r\n            <ul className=\"pagination pagination-lg justify-content-center mt-4\">\r\n                {\r\n                    pagina > 1 &&\r\n                    <li className=\"page-item\"><a className=\"page-link\" onClick={retroceder}>Anterior</a></li>\r\n                }\r\n                <li className=\"page-item active\"><a className=\"page-link\" href=\"javascript:void(0);\">{pagina}</a></li>\r\n                {\r\n                    haySiguiente\r\n                    &&\r\n                    <li className=\"page-item\"><a className=\"page-link\" onClick={avanzar}>Siguiente</a></li>\r\n                }\r\n            </ul>\r\n        </div >\r\n    )\r\n}\r\n\r\nexport default Cursos;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\firebase.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\navbar\\navbar.jsx",["359","360"],"import React, { useState, useEffect } from \"react\"\r\nimport { Link, useHistory } from \"react-router-dom\"\r\nimport { obtUsuarioStorage } from '../../helpers/almUsuario'\r\nimport { cerrarSesion } from \"../../api\"\r\nimport Logo from \"../../img/logo.png\"\r\nimport \"./navbar.css\"\r\n\r\nconst Navbar = ({ usarTransparencia, currentPage }) => {\r\n\r\n  const [scrolled, setScrolled] = React.useState(false);\r\n  const [usuario] = useState(obtUsuarioStorage());\r\n  let history = useHistory();\r\n\r\n  useEffect(() => {\r\n    window.addEventListener(\"scroll\", handleScroll)\r\n    return () => window.removeEventListener(\"scroll\", handleScroll)\r\n  }, [scrolled])\r\n  let x = [\"fixed-top\"]\r\n  if (!usarTransparencia || scrolled) {\r\n    x.push(\"scrolled\")\r\n  }\r\n\r\n  const handleScroll = () => {\r\n    const offset = window.scrollY\r\n    if (offset > 20) {\r\n      setScrolled(true)\r\n    } else {\r\n      setScrolled(false)\r\n    }\r\n  }\r\n\r\n  const salir = (e) => {\r\n    e.preventDefault();\r\n    cerrarSesion()\r\n      .then(res => {\r\n        if (res) {\r\n          localStorage.removeItem('usuario');\r\n          history.push('/login');\r\n        }\r\n      })\r\n  }\r\n\r\n  return (\r\n    <div className={x.join(\" \")}>\r\n      <div className=\"contenedor contenedor-navbar\">\r\n        <nav className=\"navbar navbar-expand-md navbar-dark\">\r\n          <Link className=\"navbar-brand logo\" to=\"/\">\r\n            <img src={Logo} alt=\"Logo\" title=\"Logo\" />\r\n          </Link>\r\n          <button\r\n            className=\"navbar-toggler\"\r\n            type=\"button\"\r\n            data-toggle=\"collapse\"\r\n            data-target=\"#collapsibleNavbar\">\r\n            <span className=\"navbar-toggler-icon\"></span>\r\n          </button>\r\n\r\n          <div className=\"collapse navbar-collapse\" id=\"collapsibleNavbar\">\r\n            <ul className=\"navbar-nav ml-auto mr-5\">\r\n              {\r\n                usuario && currentPage && currentPage == '/admin'\r\n                  ?\r\n                  <li className=\"nav-item\">\r\n                    <a onClick={salir}>Salir</a>\r\n                  </li>\r\n                  :\r\n                  <>\r\n                    <li className=\"nav-item\">\r\n                      <Link to=\"/\">Inicio</Link>\r\n                    </li>\r\n                    <li className=\"nav-item\">\r\n                      <Link to=\"/courses\">Cursos</Link>\r\n                    </li>\r\n                    <li className=\"nav-item\">\r\n                      <Link to=\"/teachers\">Docentes</Link>\r\n                    </li>\r\n                    <li className=\"nav-item\">\r\n                      <Link to=\"/login\">Login</Link>\r\n                    </li>\r\n                  </>\r\n              }\r\n            </ul>\r\n          </div>\r\n        </nav>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default Navbar\r\n","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\footer\\footer.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\estadisticas\\estadisticas.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\testimonios\\testimonios.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\nuestroscursos\\nuestroscursos.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\course_teacher\\course_teacher.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\parrafo_teacher\\parrafo_teacher.jsx",["361"],"import React, { useState } from \"react\"\r\nimport \"./parrafo_teacher.css\"\r\n\r\nexport default prop => {\r\n  const [mostrarMas, setMostrarMas] = useState(true);\r\n  const [mostrarMenos, setMostrarMenos] = useState(false);\r\n\r\n  return (\r\n    <div className=\"container-info\">\r\n      <div className=\"container-title\">\r\n        <h2 className=\"titulo-docente\">\r\n          {prop.titulo}\r\n          {prop.parrafo && (\r\n            <div className=\"Detalle\">\r\n              <span\r\n                className={!mostrarMas ? \"Ocultar\" : \"\"}\r\n                onClick={() => {\r\n                  setMostrarMas(false)\r\n                  setMostrarMenos(true)\r\n                }}\r\n              >\r\n                <i className=\"fa fa-angle-down\"></i>\r\n              </span>\r\n              <span\r\n                className={!mostrarMenos ? \"Ocultar\" : \"\"}\r\n                onClick={() => {\r\n                  setMostrarMas(true)\r\n                  setMostrarMenos(false)\r\n                }}>\r\n                <i className=\"fa fa-angle-up\"></i>\r\n              </span>\r\n            </div>\r\n          )}\r\n        </h2>\r\n      </div>\r\n      {prop.parrafo && (\r\n        <div>\r\n          <p\r\n            className={\r\n              !mostrarMenos ? \"Semi-Oculto text-content\" : \"text-content\"\r\n            }>\r\n            {prop.parrafo}\r\n          </p>          \r\n        </div>\r\n      )}\r\n    </div>\r\n  )\r\n}\r\n","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\episodio\\acordeon_episodios.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\cursos\\card\\card.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\cursos\\cursos-data.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\docentes\\card\\card_teacher.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\panoramaInicio\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\calendario\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\avatar\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\pestanas\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\navbar\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\footer\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\validadores.js",["362"],"import { extraerLink } from './funcionesTexto';\r\n\r\nexport const esNombreInvalido = (name, notRequired) => {\r\n    if (!name && !notRequired) {\r\n        return 'El nombre está vacío';\r\n    }\r\n    else if (!name && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,50}/.test(name))) {\r\n        return 'Tu nombre debe tener de 1 a 50 caracteres';\r\n    }\r\n    else if (!(/^[a-zA-Z\\sáéíóúñÑ]*$/.test(name))) {\r\n        return 'Tu nombre no puede tener caracteres especiales';\r\n    }\r\n}\r\n\r\nexport const esEdadInvalida = (age, notRequired) => {\r\n    if (!age && !notRequired) {\r\n        return 'La edad está vacía';\r\n    }\r\n    else if (!age && notRequired) {\r\n        return null;\r\n    }\r\n    else if (age < 10 || age > 99) {\r\n        return 'Introduce una edad válida';\r\n    }\r\n}\r\n\r\nexport const esTelefonoInvalido = (phone, notRequired) => {\r\n    if (!phone && !notRequired) {\r\n        return 'El teléfono está vacío';\r\n    }\r\n    else if (!phone && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/(^\\s*$)|(^[+]?[0-9 ]{7,20}$)/).test(phone)) {\r\n        return 'Introduce un teléfono válido';\r\n    }\r\n}\r\n\r\nexport const esCorreoInvalido = (email, notRequired) => {\r\n    if (!email && !notRequired) {\r\n        return 'El correo está vacío';\r\n    }\r\n    else if (!email && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{6,100}/.test(email))) {\r\n        return 'Tu correo debe tener de 6 a 100 caracteres';\r\n    }\r\n    else if (!(/^[\\w-\\.]+@([\\w-]+\\.)+[\\w-]{2,4}$/).test(email)) {\r\n        return 'Introduce un correo válido';\r\n    }\r\n}\r\n\r\nexport const esLinkInvalido = (link, notRequired) => {\r\n    if (!link && !notRequired) {\r\n        return 'El link está vacío';\r\n    }\r\n    else if (!link && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,500}/.test(link))) {\r\n        return 'Tu link debe tener de 1 a 500 caracteres';\r\n    } else if (!extraerLink(link.trim())) {\r\n        return 'Parece que ese link no es válido. Revísalo bien';\r\n    }\r\n}\r\n\r\nexport const esTituloInvalido = (title, notRequired) => {\r\n    if (!title && !notRequired) {\r\n        return 'El título está vacío';\r\n    }\r\n    else if (!title && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,100}/.test(title))) {\r\n        return 'Tu título debe tener de 1 a 100 caracteres';\r\n    }\r\n}\r\n\r\nexport const esAutorInvalido = (author, notRequired) => {\r\n    if (!author && !notRequired) {\r\n        return 'El autor está vacío';\r\n    }\r\n    else if (!author && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,100}/.test(author))) {\r\n        return 'Tu pseudónimo debe tener de 1 a 100 caracteres';\r\n    }\r\n}\r\n\r\nexport const esIntencionInvalida = (intention, notRequired) => {\r\n    if (!intention && !notRequired) {\r\n        return 'La intención está vacía';\r\n    }\r\n    else if (!intention && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,1000}/.test(intention))) {\r\n        return 'Lo que quieres transmitir debe tener de 1 a 1000 caracteres';\r\n    }\r\n}\r\n\r\nexport const isSobreInvalido = (about, notRequired) => {\r\n    if (!about && !notRequired) {\r\n        return 'El resumen de tu historía está vacío';\r\n    }\r\n    else if (!about && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,1000}/.test(about))) {\r\n        return 'El resumen de tu historia debe contener de 1 a 1000 caracteres';\r\n    }\r\n}\r\n\r\nexport const esProfesionInvalida = (profession, notRequired) => {\r\n    if (!profession && !notRequired) {\r\n        return 'La profesión está vacía';\r\n    }\r\n    else if (!profession && notRequired) {\r\n        return null;\r\n    }\r\n    else if (!(/^(?!\\s*$).{1,50}/.test(profession))) {\r\n        return 'Tu profesión debe tener de 1 a 50 caracteres';\r\n    }\r\n    else if (!(/^[a-zA-Z\\sáéíóúñÑ]*$/.test(profession))) {\r\n        return 'Tu profesión no puede tener caracteres especiales';\r\n    }\r\n}","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\step-manager\\step-manager.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\hooks\\useStepObserver.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\data\\data.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionClases.js",["363"],"import React, { useState, useEffect } from 'react'\r\nimport TarjetaEdicion from './tarjeta_edicion_clase'\r\nimport GridLoader from \"react-spinners/GridLoader\"\r\nimport { css } from \"@emotion/core\"\r\nimport { guardarClaseAdmin, actClaseAdmin, eliminarClaseAdmin } from '../../api'\r\nimport PropTypes from 'prop-types';\r\nimport Modal from 'react-bootstrap/Modal'\r\n\r\nconst override = css`\r\n  display: block;\r\n  margin: 50px auto;\r\n  background-color: 'green';\r\n`;\r\n\r\nconst Edicion = (props) => {\r\n\r\n    const [clases, estClases] = useState([]);\r\n    const [ordenCorrelativo, estOrdenCorrelativo] = useState(0);\r\n\r\n    const obtenerOrdenCorrelativo = (clases) => {\r\n        if (clases) {\r\n            let max = 0;\r\n            clases.map(clase => {\r\n                if (clase.orden > max) {\r\n                    max = clase.orden;\r\n                }\r\n            })\r\n            return max + 1;\r\n        }\r\n        return 0;\r\n    }\r\n\r\n    useEffect(() => {\r\n        estClases(props.clases);\r\n        estOrdenCorrelativo(obtenerOrdenCorrelativo(props.clases));\r\n    }, [props.clases]);\r\n\r\n    const agregar = (clase) => {\r\n        guardarClaseAdmin(clase)\r\n            .then(() => {\r\n                props.guardarCambios();\r\n            });\r\n    }\r\n\r\n    const actualizar = (clase) => {\r\n        actClaseAdmin(clase)\r\n            .then(() => {\r\n                props.guardarCambios();\r\n            });\r\n    }\r\n\r\n    const eliminar = (id) => {\r\n        eliminarClaseAdmin(id)\r\n            .then(() => {\r\n                props.guardarCambios();\r\n            })\r\n    }\r\n\r\n    return (\r\n        <Modal show={props.mostrar} onHide={props.cancelar} backdrop={'static'} keyboard={false} size={'xl'}>\r\n            <Modal.Header closeButton>\r\n                <Modal.Title>Editar clases</Modal.Title>\r\n            </Modal.Header>\r\n            <Modal.Body>\r\n                {\r\n                    props.cargandoClases\r\n                        ?\r\n                        <GridLoader css={override} loading={props.cargandoClases} size={10} />\r\n                        :\r\n                        props.clases && props.clases.length > 0\r\n                            ?\r\n                            <>\r\n                                <TarjetaEdicion\r\n                                    idCurso={props.idCurso}\r\n                                    agregar={agregar}\r\n                                    correlativo={ordenCorrelativo}\r\n                                    nueva />\r\n                                {\r\n                                    clases.map(clase => (\r\n                                        <TarjetaEdicion\r\n                                            idCurso={props.idCurso}\r\n                                            actualizar={actualizar}\r\n                                            eliminar={eliminar}\r\n                                            clase={clase}\r\n                                            key={clase.id} />\r\n                                    ))\r\n                                }\r\n                            </>\r\n                            :\r\n                            <>\r\n                                <TarjetaEdicion\r\n                                    idCurso={props.idCurso}\r\n                                    agregar={agregar}\r\n                                    correlativo={1}\r\n                                    nueva />\r\n                                <p>No hay clases registradas</p>\r\n                            </>\r\n                }\r\n            </Modal.Body>\r\n            <Modal.Footer>\r\n                <button type=\"button\" className=\"btn btn-danger\" onClick={props.cancelar}>Cerrar</button>\r\n            </Modal.Footer>\r\n        </Modal>\r\n    )\r\n}\r\n\r\nEdicion.propTypes = {\r\n    data: PropTypes.shape({\r\n        id: PropTypes.string,\r\n        titulo: PropTypes.string,\r\n        ulrImg: PropTypes.string,\r\n        urlInscripcion: PropTypes.string,\r\n        objetivo: PropTypes.string,\r\n        descBreve: PropTypes.string,\r\n        descExtendida: PropTypes.string,\r\n        requisitos: PropTypes.arrayOf(PropTypes.string),\r\n        dias: PropTypes.arrayOf(PropTypes.string),\r\n        fInicioFin: PropTypes.arrayOf(PropTypes.string),\r\n        hInicioFin: PropTypes.arrayOf(PropTypes.string),\r\n        excepciones: PropTypes.arrayOf(PropTypes.string),\r\n        cancelaciones: PropTypes.arrayOf(PropTypes.string),\r\n        idProfesor: PropTypes.string,\r\n        clases: PropTypes.arrayOf(PropTypes.object)\r\n    })\r\n}\r\n\r\nEdicion.defaultProps = {\r\n    data: {\r\n        id: null,\r\n        titulo: '',\r\n        urlImg: '',\r\n        urlInscripcion: '',\r\n        objetivo: '',\r\n        descBreve: '',\r\n        descExtendida: '',\r\n        requisitos: [],\r\n        dias: [],\r\n        fInicioFin: [],\r\n        hInicioFin: [],\r\n        excepciones: [],\r\n        cancelaciones: [],\r\n        idProfesor: '',\r\n        clases: []\r\n    }\r\n}\r\n\r\nexport default Edicion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionCurso.js",["364","365"],"import React, { useRef, useState, useEffect } from 'react'\r\nimport { actCursoAdmin, obtProfesoresCombo, subirImagen, obtIdGenerado } from '../../api'\r\nimport { arrayToStringList, stringToArray } from '../../helpers/funcionesArreglo'\r\nimport PropTypes from 'prop-types';\r\nimport Modal from 'react-bootstrap/Modal'\r\n\r\nconst Edicion = (props) => {\r\n\r\n    let refTxtTitulo = useRef();\r\n\r\n    const [profesores, estProfesores] = useState([]);\r\n\r\n    const [titulo, estTitulo] = useState('');\r\n    const [img, estImg] = useState(null);\r\n    const [urlInscripcion, estUrlInscripcion] = useState('');\r\n    const [objetivo, estObjetivo] = useState('');\r\n    const [descBreve, estDescBreve] = useState('');\r\n    const [descExtendida, estDescExtendida] = useState('');\r\n    const [requisitos, estRequisitos] = useState('');\r\n\r\n    const [dias, estDias] = useState('');\r\n    const [fInicioFin, estFInicioFin] = useState('');\r\n    const [hInicioFin, estHInicioFin] = useState('');\r\n    const [excepciones, estExcepciones] = useState('');\r\n    const [cancelaciones, estCancelaciones] = useState('');\r\n    const [idProfesor, estIdProfesor] = useState('');\r\n\r\n    useEffect(() => {\r\n        refTxtTitulo.current?.focus();\r\n        obtProfesoresCombo().then((profesores) => {\r\n            estProfesores(profesores);\r\n            estIdProfesor(profesores[0].id);\r\n        })\r\n    }, [])\r\n\r\n    useEffect(() => {\r\n        estTitulo(props.data?.titulo);\r\n        estUrlInscripcion(props.data?.urlInscripcion);\r\n        estObjetivo(props.data?.objetivo);\r\n        estDescBreve(props.data?.descBreve);\r\n        estDescExtendida(props.data?.descExtendida);\r\n        estRequisitos(arrayToStringList(props.data?.requisitos));\r\n        estDias(arrayToStringList(props.data?.dias));\r\n        estFInicioFin(arrayToStringList(props.data?.fInicioFin));\r\n        estHInicioFin(arrayToStringList(props.data?.hInicioFin));\r\n        estExcepciones(arrayToStringList(props.data?.excepciones));\r\n        estCancelaciones(arrayToStringList(props.data?.cancelaciones));\r\n        estIdProfesor(props.data?.idProfesor);\r\n    }, [props.data]);\r\n\r\n    const actTitulo = (ev) => {\r\n        estTitulo(ev.target.value);\r\n    }\r\n    const actImg = (ev) => {\r\n        estImg(ev.target.files[ev.target.files.length - 1]);\r\n    }\r\n    const actUrlInscripcion = (ev) => {\r\n        estUrlInscripcion(ev.target.value);\r\n    }\r\n    const actObjetivos = (ev) => {\r\n        estObjetivo(ev.target.value);\r\n    }\r\n    const actDescBreve = (ev) => {\r\n        estDescBreve(ev.target.value);\r\n    }\r\n    const actDescExtendida = (ev) => {\r\n        estDescExtendida(ev.target.value);\r\n    }\r\n    const actRequisitos = (ev) => {\r\n        estRequisitos(ev.target.value);\r\n    }\r\n    const actDias = (ev) => {\r\n        estDias(ev.target.value);\r\n    }\r\n    const actFinicioFin = (ev) => {\r\n        estFInicioFin(ev.target.value);\r\n    }\r\n    const actHInicioFin = (ev) => {\r\n        estHInicioFin(ev.target.value);\r\n    }\r\n    const actExcepciones = (ev) => {\r\n        estExcepciones(ev.target.value);\r\n    }\r\n    const actCancelaciones = (ev) => {\r\n        estCancelaciones(ev.target.value);\r\n    }\r\n    const actIdProfesor = (ev) => {\r\n        estIdProfesor(ev.target.value);\r\n    }\r\n\r\n    const guardarCurso = (url, idGenerado) => {\r\n        const dataNueva = {\r\n            titulo,\r\n            urlImg: url,\r\n            urlInscripcion,\r\n            objetivo,\r\n            descBreve,\r\n            descExtendida,\r\n            requisitos: stringToArray(requisitos),\r\n            dias: stringToArray(dias),\r\n            fInicioFin: stringToArray(fInicioFin),\r\n            hInicioFin: stringToArray(hInicioFin),\r\n            excepciones: stringToArray(excepciones),\r\n            cancelaciones: stringToArray(cancelaciones),\r\n            idProfesor: idProfesor ? idProfesor : profesores[0].id\r\n        };\r\n\r\n        switch (props.modo) {\r\n            case 'CREACION':\r\n                actCursoAdmin({ ...dataNueva, id: idGenerado, activo: 1 }).then(() => {\r\n                    props.guardarCambios();\r\n                })\r\n                break;\r\n\r\n            case 'EDICION':\r\n                actCursoAdmin({\r\n                    ...props.data,\r\n                    ...dataNueva\r\n                }).then(() => {\r\n                    props.guardarCambios();\r\n                })\r\n                break;\r\n        }\r\n    }\r\n\r\n    const guardarCambios = () => {\r\n        if (titulo && urlInscripcion && objetivo && descBreve && descExtendida && dias && fInicioFin && hInicioFin && idProfesor) {\r\n            const idGenerado = props.data.id || obtIdGenerado('cursos');\r\n            if (img) {\r\n                subirImagen('cursos', idGenerado, img)\r\n                    .then(url => {\r\n                        guardarCurso(url, idGenerado);\r\n                    })\r\n                    .catch(error => {\r\n                        alert('Error al subir la imagen. Reintente')\r\n                        console.log(error);\r\n                    })\r\n            } else {\r\n                guardarCurso(props.data.urlImg, idGenerado);\r\n            }\r\n        } else {\r\n            alert('Hay campos obligatorios inválidos');\r\n        }\r\n    }\r\n\r\n    const encabezado = props.modo == 'CREACION' ? 'Crear curso' : 'Editar curso';\r\n\r\n    return (\r\n        <Modal show={props.mostrar} onHide={props.cancelar} backdrop={'static'} keyboard={false} size={'xl'}>\r\n            <Modal.Header closeButton>\r\n                <Modal.Title>\r\n                    {encabezado}\r\n                </Modal.Title>\r\n            </Modal.Header>\r\n            <Modal.Body>\r\n                <form>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtTitulo\">Título*</label>\r\n                        <input ref={refTxtTitulo} type=\"text\" value={titulo} onChange={actTitulo} className=\"form-control form-control-lg\" id=\"txtTitulo\" placeholder=\"Ingresa el título\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"imgCurso\">Imagen curso</label>\r\n                        <input type=\"file\" accept=\"image/*\" onChange={actImg} className=\"form-control-file\" id=\"imgCurso\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtUrlInscripcion\">URL inscripción*</label>\r\n                        <input type=\"text\" value={urlInscripcion} onChange={actUrlInscripcion} className=\"form-control form-control-lg\" id=\"txtUrlInscripcion\" placeholder=\"htpps://docs.google...\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtObjetivo\">Objetivo*</label>\r\n                        <input type=\"text\" value={objetivo} onChange={actObjetivos} className=\"form-control form-control-lg\" id=\"txtObjetivo\" placeholder=\"Ingresa solo un objetivo\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtDescBreve\">Descripción breve*</label>\r\n                        <textarea value={descBreve} onChange={actDescBreve} className=\"form-control\" id=\"txtDescBreve\" rows=\"3\"></textarea>\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtDescExtendida\">Descripción extendida*</label>\r\n                        <textarea value={descExtendida} onChange={actDescExtendida} className=\"form-control\" id=\"txtDescExtendida\" rows=\"3\"></textarea>\r\n                    </div>\r\n                    <legend class=\"col-form-label mt-4 mb-4\">Horarios</legend>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtRequisitos\">Requisitos</label>\r\n                        <input type=\"text\" value={requisitos} onChange={actRequisitos} className=\"form-control form-control-lg\" id=\"txtRequisitos\" placeholder=\"Requisito 1, requisito 2\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtDias\">Días*</label>\r\n                        <input type=\"text\" value={dias} onChange={actDias} className=\"form-control form-control-lg\" id=\"txtDias\" placeholder=\"LU, MA, MI, JU, VI, SA, DO\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtFInicioFin\">Fecha inicio y fin*</label>\r\n                        <input type=\"text\" value={fInicioFin} onChange={actFinicioFin} className=\"form-control form-control-lg\" id=\"txtFInicioFin\" placeholder=\"dd/mm/yyyy, dd/mm/yyyy\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtHInicioFin\">Hora inicio y fin (Formato 24h)*</label>\r\n                        <input type=\"text\" value={hInicioFin} onChange={actHInicioFin} className=\"form-control form-control-lg\" id=\"txtHInicioFin\" placeholder=\"hh:mm, hh:mm\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtExcepciones\">Fechas excepciones</label>\r\n                        <input type=\"text\" value={excepciones} onChange={actExcepciones} className=\"form-control form-control-lg\" id=\"txtExcepciones\" placeholder=\"dd/mm/yyyy, dd/mm/yyyy, dd/mm/yyyy, etc\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtCancelaciones\">Fechas cancelaciones</label>\r\n                        <input type=\"text\" value={cancelaciones} onChange={actCancelaciones} className=\"form-control form-control-lg\" id=\"txtCancelaciones\" placeholder=\"dd/mm/yyyy, dd/mm/yyyy, dd/mm/yyyy, etc\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"cboProfesores\">Profesor*</label>\r\n                        <select onChange={actIdProfesor} value={idProfesor} class=\"form-control form-control-lg\" id=\"cboProfesores\">\r\n                            {\r\n                                profesores.map(profesor => (\r\n                                    <option value={profesor.id}>{profesor.nombres + ' ' + profesor.apellidos}</option>\r\n                                ))\r\n                            }\r\n                        </select>\r\n                    </div>\r\n                </form>\r\n            </Modal.Body>\r\n            <Modal.Footer>\r\n                <button type=\"button\" className=\"btn btn-primary\" onClick={guardarCambios}>Guardar</button>\r\n                <button type=\"button\" className=\"btn btn-danger\" onClick={props.cancelar}>Cerrar</button>\r\n            </Modal.Footer>\r\n\r\n        </Modal>\r\n    )\r\n}\r\n\r\nEdicion.propTypes = {\r\n    data: PropTypes.shape({\r\n        id: PropTypes.string,\r\n        titulo: PropTypes.string,\r\n        ulrImg: PropTypes.string,\r\n        urlInscripcion: PropTypes.string,\r\n        objetivo: PropTypes.string,\r\n        descBreve: PropTypes.string,\r\n        descExtendida: PropTypes.string,\r\n        requisitos: PropTypes.arrayOf(PropTypes.string),\r\n        dias: PropTypes.arrayOf(PropTypes.string),\r\n        fInicioFin: PropTypes.arrayOf(PropTypes.string),\r\n        hInicioFin: PropTypes.arrayOf(PropTypes.string),\r\n        excepciones: PropTypes.arrayOf(PropTypes.string),\r\n        cancelaciones: PropTypes.arrayOf(PropTypes.string),\r\n        idProfesor: PropTypes.string,\r\n        clases: PropTypes.arrayOf(PropTypes.object)\r\n    })\r\n}\r\n\r\nEdicion.defaultProps = {\r\n    data: {\r\n        id: null,\r\n        titulo: '',\r\n        urlImg: '',\r\n        urlInscripcion: '',\r\n        objetivo: '',\r\n        descBreve: '',\r\n        descExtendida: '',\r\n        requisitos: [],\r\n        dias: [],\r\n        fInicioFin: [],\r\n        hInicioFin: [],\r\n        excepciones: [],\r\n        cancelaciones: [],\r\n        idProfesor: '',\r\n        clases: []\r\n    }\r\n}\r\n\r\nexport default Edicion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\confirmacion.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\edicionProfesor.js",["366","367"],"import React, { useRef, useState, useEffect } from 'react'\r\nimport { subirImagen, actProfesorAdmin, obtIdGenerado } from '../../api'\r\nimport { arrayToStringList, stringToArray } from '../../helpers/funcionesArreglo'\r\nimport PropTypes from 'prop-types';\r\nimport Modal from 'react-bootstrap/Modal'\r\n\r\nconst Edicion = React.forwardRef((props, ref) => {\r\n\r\n    let reftxtNombres = useRef();\r\n\r\n    const [nombres, estNombres] = useState('');\r\n    const [apellidos, estApellidos] = useState('');\r\n    const [img, estImg] = useState(null);\r\n    const [pais, estPais] = useState('');\r\n    const [likes, estLikes] = useState(0);\r\n    const [etiquetas, estEtiquetas] = useState('');\r\n    const [logros, estLogros] = useState('');\r\n    const [sobreMi, estSobreMi] = useState('');\r\n    const [experiencia, estExperiencia] = useState('');\r\n    const [github, estGithub] = useState('');\r\n    const [patreon, estPatreon] = useState('');\r\n    const [youtube, estYoutube] = useState('');\r\n\r\n    useEffect(() => {\r\n        reftxtNombres.current?.focus();\r\n    }, [])\r\n\r\n    useEffect(() => {\r\n        estNombres(props.data?.nombres);\r\n        estApellidos(props.data?.apellidos);\r\n        estPais(props.data?.pais);\r\n        estLikes(parseInt(props.data?.likes));\r\n        estEtiquetas(arrayToStringList(props.data?.etiquetas));\r\n        estLogros(arrayToStringList(props.data?.logros));\r\n        estSobreMi(props.data?.sobreMi);\r\n        estExperiencia(props.data?.experiencia);\r\n        estGithub(props.data?.redes?.gh);\r\n        estPatreon(props.data?.redes?.pt);\r\n        estYoutube(props.data?.redes?.yt);\r\n    }, [props.data]);\r\n\r\n    const actNombres = (ev) => {\r\n        estNombres(ev.target.value);\r\n    }\r\n    const actApellidos = (ev) => {\r\n        estApellidos(ev.target.value);\r\n    }\r\n    const actImg = (ev) => {\r\n        estImg(ev.target.files[ev.target.files.length - 1]);\r\n    }\r\n    const actPais = (ev) => {\r\n        estPais(ev.target.value);\r\n    }\r\n    const actLikes = (ev) => {\r\n        estLikes(ev.target.value);\r\n    }\r\n    const actEtiquetas = (ev) => {\r\n        estEtiquetas(ev.target.value);\r\n    }\r\n    const actLogros = (ev) => {\r\n        estLogros(ev.target.value);\r\n    }\r\n    const actSobreMi = (ev) => {\r\n        estSobreMi(ev.target.value);\r\n    }\r\n    const actExperiencia = (ev) => {\r\n        estExperiencia(ev.target.value);\r\n    }\r\n    const actGithub = (ev) => {\r\n        estGithub(ev.target.value);\r\n    }\r\n    const actPatreon = (ev) => {\r\n        estPatreon(ev.target.value);\r\n    }\r\n    const actYoutube = (ev) => {\r\n        estYoutube(ev.target.value);\r\n    }\r\n\r\n    const guardarPerfil = (url, idGenerado) => {\r\n\r\n        const dataNueva = {\r\n            nombres,\r\n            apellidos,\r\n            pais,\r\n            likes: parseInt(likes),\r\n            etiquetas: stringToArray(etiquetas),\r\n            logros: stringToArray(logros),\r\n            sobreMi,\r\n            experiencia,\r\n            img: url,\r\n            redes: {\r\n                gh: github,\r\n                pt: patreon,\r\n                yt: youtube\r\n            },\r\n        };\r\n\r\n        switch (props.modo) {\r\n            case 'CREACION':\r\n                actProfesorAdmin({ ...dataNueva, id: idGenerado, activo: 1 }).then(() => {\r\n                    props.guardarCambios();\r\n                })\r\n                break;\r\n\r\n            case 'EDICION':\r\n                actProfesorAdmin({\r\n                    ...props.data,\r\n                    ...dataNueva\r\n                }).then(() => {\r\n                    props.guardarCambios();\r\n                })\r\n                break;\r\n        }\r\n    }\r\n\r\n    const guardarCambios = () => {\r\n        if (nombres && apellidos && pais && !isNaN(likes) && etiquetas && sobreMi) {\r\n            const idGenerado = props.data.id || obtIdGenerado('docentes');\r\n            if (img) {\r\n                subirImagen('profesores', idGenerado, img)\r\n                    .then(url => {\r\n                        guardarPerfil(url, idGenerado);\r\n                    })\r\n                    .catch(error => {\r\n                        alert('Error al subir la imagen. Reintente')\r\n                        console.log(error);\r\n                    })\r\n            } else {\r\n                guardarPerfil(props.data.img, idGenerado);\r\n            }\r\n        } else {\r\n            alert('Hay campos obligatorios inválidos');\r\n        }\r\n    }\r\n\r\n    const encabezado = props.modo == 'CREACION' ? 'Crear profesor' : 'Editar profesor';\r\n\r\n    return (\r\n        <Modal show={props.mostrar} onHide={props.cancelar} backdrop={'static'} keyboard={false} size={'xl'}>\r\n            <Modal.Header closeButton>\r\n                <Modal.Title>\r\n                    {encabezado}\r\n                </Modal.Title>\r\n            </Modal.Header>\r\n            <Modal.Body>\r\n                <form>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtNombres\">Nombres*</label>\r\n                        <input ref={reftxtNombres} type=\"text\" value={nombres} onChange={actNombres} className=\"form-control form-control-lg\" id=\"txtNombres\" placeholder=\"Ingresa los nombres\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtApellidos\">Apellidos*</label>\r\n                        <input type=\"text\" value={apellidos} onChange={actApellidos} className=\"form-control form-control-lg\" id=\"txtApellidos\" placeholder=\"Ingresa los apellidos\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"imgProfesor\">Imagen profesor</label>\r\n                        <input type=\"file\" accept=\"image/*\" onChange={actImg} className=\"form-control-file\" id=\"imgProfesor\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtPais\">País (Prefijo)*</label>\r\n                        <input type=\"text\" value={pais} onChange={actPais} className=\"form-control form-control-lg\" id=\"txtPais\" placeholder=\"Ejemplo: MX, PE, SV\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtLikes\">Likes*</label>\r\n                        <input type=\"number\" min={0} max={99} value={likes} onChange={actLikes} className=\"form-control form-control-lg\" id=\"txtLikes\" placeholder=\"0-99\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtEtiquetas\">Etiquetas*</label>\r\n                        <input type=\"text\" value={etiquetas} onChange={actEtiquetas} className=\"form-control form-control-lg\" id=\"txtEtiquetas\" placeholder=\"Ejemplo: C++, Java, Javascript\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtLogros\">Logros</label>\r\n                        <input type=\"text\" value={logros} onChange={actLogros} className=\"form-control form-control-lg\" id=\"txtLogros\" placeholder=\"Logro 1, Logro 2, Logro 3\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtSobreMi\">Sobre mí*</label>\r\n                        <textarea value={sobreMi} onChange={actSobreMi} className=\"form-control\" id=\"txtSobreMi\" rows=\"3\"></textarea>\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtExperiencia\">Experiencia</label>\r\n                        <textarea value={experiencia} onChange={actExperiencia} className=\"form-control\" id=\"txtExperiencia\" rows=\"3\"></textarea>\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtGithub\">Github</label>\r\n                        <input type=\"text\" value={github} onChange={actGithub} className=\"form-control form-control-lg\" id=\"txtGithub\" placeholder=\"Ejemplo: C++, Java, Javascript\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtPatreon\">Patreon</label>\r\n                        <input type=\"text\" value={patreon} onChange={actPatreon} className=\"form-control form-control-lg\" id=\"txtPatreon\" placeholder=\"Ejemplo: C++, Java, Javascript\" />\r\n                    </div>\r\n                    <div className=\"form-group\">\r\n                        <label htmlFor=\"txtYoutube\">Youtube</label>\r\n                        <input type=\"text\" value={youtube} onChange={actYoutube} className=\"form-control form-control-lg\" id=\"txtYoutube\" placeholder=\"Ejemplo: C++, Java, Javascript\" />\r\n                    </div>\r\n                </form>\r\n            </Modal.Body>\r\n            <Modal.Footer>\r\n                <button type=\"button\" className=\"btn btn-primary\" onClick={guardarCambios}>Guardar</button>\r\n                <button type=\"button\" className=\"btn btn-danger\" onClick={props.cancelar}>Cerrar</button>\r\n            </Modal.Footer>\r\n        </Modal>\r\n    )\r\n})\r\n\r\nEdicion.propTypes = {\r\n    data: PropTypes.shape({\r\n        id: PropTypes.string,\r\n        nombres: PropTypes.string,\r\n        apellidos: PropTypes.string,\r\n        pais: PropTypes.string,\r\n        likes: PropTypes.number,\r\n        etiquetas: PropTypes.arrayOf(PropTypes.string),\r\n        logros: PropTypes.arrayOf(PropTypes.string),\r\n        sobreMi: PropTypes.string,\r\n        experiencia: PropTypes.string,\r\n        img: PropTypes.string,\r\n        redes: PropTypes.shape({\r\n            github: PropTypes.string,\r\n            patreon: PropTypes.string,\r\n            youtube: PropTypes.string,\r\n        })\r\n    })\r\n}\r\n\r\nEdicion.defaultProps = {\r\n    data: {\r\n        id: null,\r\n        nombres: '',\r\n        apellidos: '',\r\n        pais: '',\r\n        likes: 0,\r\n        etiquetas: [],\r\n        logros: [],\r\n        sobreMi: '',\r\n        experiencia: '',\r\n        img: '',\r\n        redes: {\r\n            gh: '',\r\n            pt: '',\r\n            yt: ''\r\n        }\r\n    }\r\n}\r\n\r\nexport default Edicion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\testimonios\\testimonios-data.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\episodio\\card\\card_episodio.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\avatar\\avatar.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\pestanas\\pestanas.js",["368"],"import React from 'react'\r\nimport './pestanas.css'\r\n\r\nconst Pestanas = ({ data, indice, seleccionar, cargando, children }) => {\r\n\r\n    const cambiarPestana = (e, indice) => {\r\n        e.preventDefault();\r\n        seleccionar(indice);\r\n    }\r\n\r\n    const porcAnchoPestana = 100 / data.length;\r\n\r\n    const hijos = React.Children.toArray(children);\r\n\r\n    return (\r\n        <div>\r\n            <div className=\"material-tabs\">\r\n                {\r\n                    data.map((pestana, index) => (\r\n                        <a key={index} onClick={(e) => cambiarPestana(e, index)} className=\"active\">{pestana}</a>\r\n                    ))\r\n                }\r\n                <span className=\"tab-bar\" style={{ width: `${porcAnchoPestana}%`, left: `${porcAnchoPestana * indice}%` }}></span>\r\n            </div>\r\n            {\r\n                cargando\r\n                    ?\r\n                    'Cargando...'\r\n                    :\r\n                    hijos[indice]\r\n            }\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Pestanas;\r\n","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\dropdown-image\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\helmet\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\forms-steps\\index.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\panoramaInicio\\panorama.jsx",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\calendario\\calendario.jsx",["369"],"import React, { useEffect } from \"react\"\r\nimport { useState } from \"react\"\r\nimport { diasSemana } from \"../cursos/cursos-data\"\r\nimport { obtCursosCalendario } from '../../api'\r\nimport { Link } from 'react-router-dom';\r\nimport Calendar from \"react-calendar\"\r\nimport DatePicker from \"react-datepicker\"\r\nimport moment from \"moment\"\r\nimport \"moment/locale/es\"\r\nimport \"react-datepicker/dist/react-datepicker.css\"\r\nimport \"react-calendar/dist/Calendar.css\"\r\nimport \"./calendario.css\"\r\n\r\nconst Calendario = () => {\r\n  const [cursos, estCursos] = useState([]);\r\n  const [fecha, estFecha] = useState(moment().startOf('day').toDate());\r\n  const [clasesActuales, estClasesActuales] = useState([]);\r\n\r\n  const obtenerClasesPorFecha = () => {\r\n    const clases = cursos.filter(\r\n      curso =>\r\n        (moment(fecha).isBetween(\r\n          moment(curso.fInicioFin[0], \"DD/MM/YYYY\"),\r\n          moment(curso.fInicioFin[1], \"DD/MM/YYYY\"),\r\n          undefined,\r\n          '[]'\r\n        ) && // Verifico si está en el rango de inicio fin\r\n          curso.dias.includes(diasSemana[moment(fecha).isoWeekday() - 1]) && // Verifico si incluye los días de la semana especificados\r\n          !curso.cancelaciones.includes(moment(fecha).format(\"DD/MM/YYYY\"))) || // Y que no esté en una fecha cancelada\r\n          curso.excepciones.includes(moment(fecha).format(\"DD/MM/YYYY\")) // Si no se cumple lo primero, otra opción es que esté agregada como excepción\r\n    )\r\n    return clases\r\n  }\r\n\r\n  useEffect(() => {\r\n    obtCursosCalendario()\r\n      .then(cursos => estCursos(cursos));\r\n  }, [])\r\n\r\n  useEffect(() => {\r\n    const clases = obtenerClasesPorFecha();\r\n    estClasesActuales(clases)\r\n  }, [fecha, cursos])\r\n\r\n  const retrocederDia = () => {\r\n    const nuevaFecha = moment(fecha).subtract(1, \"days\").toDate()\r\n    estFecha(nuevaFecha)\r\n  }\r\n\r\n  const avanzarDia = () => {\r\n    const nuevaFecha = moment(fecha).add(1, \"days\").toDate()\r\n    estFecha(nuevaFecha)\r\n  }\r\n\r\n  const IconoCalendario = ({ value, onClick }) => (\r\n    <span onClick={onClick} className=\"fa fa-calendar-alt\" aria-label=\"Icono\"></span>\r\n  )\r\n\r\n  return (\r\n    <section className=\"seccion\">\r\n      <div className=\"contenedor contenedor-85\">\r\n        <h2 className=\"titulo-seccion\">¡No te pierdas ni una clase!</h2>\r\n        <div className=\"contenedor-agenda\">\r\n          <div className=\"contenedor-cursos-calendario\">\r\n            <div className=\"contenedor-titulo-cursos-calendario\">\r\n              <p>\r\n                {!moment().isSame(moment(fecha), \"day\")\r\n                  ? \"Clases del \" + moment(fecha).format(\"DD/MM/YYYY\")\r\n                  : \"Clases de hoy\"}\r\n              </p>\r\n\r\n              <div className=\"controles-agenda d-md-none\">\r\n                <span onClick={retrocederDia} className=\"fa fa-arrow-left\" aria-label=\"Retroceder\"></span>\r\n                <div>\r\n                  <DatePicker\r\n                    selected={fecha}\r\n                    onSelect={e => estFecha(e)}\r\n                    popperPlacement=\"bottom\"\r\n                    popperModifiers={{\r\n                      flip: {\r\n                        behavior: [\"bottom\"], // don't allow it to flip to be above\r\n                      },\r\n                      preventOverflow: {\r\n                        enabled: false, // tell it not to try to stay within the view (this prevents the popper from covering the element you clicked)\r\n                      },\r\n                      hide: {\r\n                        enabled: false, // turn off since needs preventOverflow to be enabled\r\n                      },\r\n                    }}\r\n                    customInput={<IconoCalendario />}\r\n                  />\r\n                </div>\r\n                <span onClick={avanzarDia} className=\"fa fa-arrow-right\" aria-label=\"Avanzar\"></span>\r\n              </div>\r\n            </div>\r\n            <div className=\"cursos-calendario\">\r\n              {clasesActuales.map((e, i) => (\r\n                <div key={i} className=\"curso-calendario\">\r\n                  <p className=\"titulo-curso-calendario\">{e.titulo}</p>\r\n                  <div className=\"controles-curso\">\r\n                    <a target=\"_blank\" rel=\"noreferrer\" href={e.urlInscripcion}>\r\n                      <i className=\"fa fa-clipboard-list\"></i>\r\n                    </a>\r\n                    <Link to={`/course/?id=${e.id}`}>\r\n                      <i className=\"fa fa-eye\" aria-label=\"visualizar\"></i>\r\n                    </Link>\r\n                  </div>\r\n                  <p className=\"horario-curso-calendario\">\r\n                    {moment(e.hInicioFin[0], \"HH:mm\").format(\"hh:mm a\") +\r\n                      \" - \" +\r\n                      moment(e.hInicioFin[1], \"HH:mm\").format(\"hh:mm a\")}\r\n                  </p>\r\n                </div>\r\n              ))}\r\n              {clasesActuales === 0 && (\r\n                <p className=\"titulo-curso-calendario\">\r\n                  No hay clases para este día\r\n                </p>\r\n              )}\r\n            </div>\r\n          </div>\r\n          <div className=\"contenedor-calendario d-none d-md-flex\">\r\n            <Calendar\r\n              value={fecha}\r\n              onChange={e => estFecha(e)}\r\n              formatShortWeekday={(locale, date) =>\r\n                moment(date).format(\"dd\")[0]\r\n              }\r\n            />\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  )\r\n}\r\n\r\nexport default Calendario\r\n","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\helpers\\funcionesArreglo.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\modal\\tarjeta_edicion_clase.js",["370","371"],"import React, { useState, useEffect } from 'react'\r\nimport { stringToArray, arrayToStringList } from '../../helpers/funcionesArreglo'\r\nimport PropTypes from 'prop-types';\r\n\r\nconst TarjetaEdicion = ({ nueva, clase, idCurso, correlativo, agregar, actualizar, eliminar }) => {\r\n\r\n    const [orden, estOrden] = useState(0);\r\n    const [titulo, estTitulo] = useState('');\r\n    const [descripcion, estDescripcion] = useState('');\r\n    const [duracion, estDuracion] = useState('');\r\n    const [link, estLink] = useState('');\r\n    const [recursos, estRecursos] = useState('');\r\n\r\n    const actOrden = (ev) => {\r\n        estOrden(parseInt(ev.target.value));\r\n    }\r\n    const actTitulo = (ev) => {\r\n        estTitulo(ev.target.value);\r\n    }\r\n    const actDescripcion = (ev) => {\r\n        estDescripcion(ev.target.value);\r\n    }\r\n    const actDuracion = (ev) => {\r\n        estDuracion(ev.target.value);\r\n    }\r\n    const actLink = (ev) => {\r\n        estLink(ev.target.value);\r\n    }\r\n    const actRecursos = (ev) => {\r\n        estRecursos(ev.target.value);\r\n    }\r\n\r\n    const cadenaAObjRecursos = (cadena) => {\r\n        if (cadena) {\r\n            let regFinal = [];\r\n            try {\r\n                const regRecursos = stringToArray(cadena);\r\n                regFinal = regRecursos.map(reg => {\r\n                    const objRecurso = stringToArray(reg, '--');\r\n                    var nombre = objRecurso[0].replace(\"titulo:\", \"\").trim();\r\n                    var url = objRecurso[1].replace(\"link:\", \"\").trim();\r\n                    return { nombre, url };\r\n                })\r\n            } catch (error) {\r\n                return { error, lista: [] };\r\n            }\r\n            return { lista: regFinal };\r\n        } else {\r\n            return { lista: [] };\r\n        }\r\n    }\r\n\r\n    const agregarClase = () => {\r\n        if (!isNaN(orden) && orden && titulo && duracion && link) {\r\n            const { lista, error } = cadenaAObjRecursos(recursos);\r\n            if (!error) {\r\n                const nuevaData = {\r\n                    descripcion,\r\n                    duracion,\r\n                    idCurso: idCurso,\r\n                    orden: parseInt(orden),\r\n                    titulo,\r\n                    urlVideo: link,\r\n                    recursos: lista\r\n                };\r\n                agregar(nuevaData);\r\n            } else {\r\n                alert('Recursos de clase ' + orden + ' no válido');\r\n            }\r\n        } else {\r\n            alert('Hay campos inválidos en la clase ' + orden);\r\n        }\r\n    }\r\n\r\n    const actualizarClase = () => {\r\n        if (!isNaN(orden) && orden && titulo && duracion && link) {\r\n            const { lista, error } = cadenaAObjRecursos(recursos);\r\n            if (!error) {\r\n                const nuevaData = {\r\n                    id: clase.id,\r\n                    descripcion,\r\n                    duracion,\r\n                    idCurso: clase.idCurso,\r\n                    orden: parseInt(orden),\r\n                    titulo,\r\n                    urlVideo: link,\r\n                    recursos: lista\r\n                };\r\n                actualizar(nuevaData);\r\n            } else {\r\n                alert('Recursos de clase ' + orden + ' no válido');\r\n            }\r\n        } else {\r\n            alert('Hay campos inválidos en la clase ' + orden);\r\n        }\r\n    }\r\n\r\n    const eliminarClase = () => {\r\n        eliminar(clase.id);\r\n    }\r\n\r\n    useEffect(() => {\r\n        estOrden(correlativo ? correlativo : clase.orden);\r\n        estTitulo(clase?.titulo ? clase?.titulo : 'Clase ' + correlativo);\r\n        estDescripcion(clase?.descripcion);\r\n        estDuracion(clase?.duracion);\r\n        estLink(clase?.urlVideo);\r\n        estRecursos(JSON.stringify(clase?.recursos));\r\n    }, [clase]);\r\n\r\n    return (\r\n        <form>\r\n            <legend class=\"col-form-label mb-4\">{nueva ? 'Nueva clase' : 'Clase N° ' + orden}</legend>\r\n            <div class=\"form-row\">\r\n                <div className=\"form-group col-3\">\r\n                    <label htmlFor=\"txtOrden\">Orden*</label>\r\n                    <input min=\"1\" type=\"number\" value={orden} onChange={actOrden} className=\"form-control form-control-lg\" id=\"txtOrden\" placeholder=\"Ingresa el número de orden\" />\r\n                </div>\r\n                <div className=\"form-group col-9\">\r\n                    <label htmlFor=\"txtTitulo\">Título*</label>\r\n                    <input type=\"text\" value={titulo} onChange={actTitulo} className=\"form-control form-control-lg\" id=\"txtTitulo\" placeholder=\"Ingresa el título\" />\r\n                </div>\r\n            </div>\r\n            <div className=\"form-group\">\r\n                <label htmlFor=\"txtDescripcion\">Descripción</label>\r\n                <textarea value={descripcion} onChange={actDescripcion} className=\"form-control\" id=\"txtDescripcion\" rows=\"3\"></textarea>\r\n            </div>\r\n            <div className=\"form-group\">\r\n                <label htmlFor=\"txtDuracion\">Duración (Xh Ym)*</label>\r\n                <input type=\"text\" value={duracion} onChange={actDuracion} className=\"form-control form-control-lg\" id=\"txtDuracion\" placeholder=\"Ejemplo: 1h 50m\" />\r\n            </div>\r\n            <div className=\"form-group\">\r\n                <label htmlFor=\"txtLink\">Id video Youtube*</label>\r\n                <input type=\"text\" value={link} onChange={actLink} className=\"form-control form-control-lg\" id=\"txtLink\" placeholder=\"Ejemplo: KxWQCsE_GTo\" />\r\n            </div>\r\n            <div className=\"form-group\">\r\n                <label htmlFor=\"txtRecursos\">Recursos (titulo: A1 -- link: B1, titulo: A2 -- link: B2)</label>\r\n                <textarea value={recursos} onChange={actRecursos} className=\"form-control\" id=\"txtRecursos\" rows=\"3\"></textarea>\r\n            </div>\r\n            {\r\n                nueva\r\n                    ?\r\n                    <button type=\"button\" className=\"btn btn-success btn-block mb-4\" onClick={agregarClase}>Agregar</button>\r\n                    :\r\n                    <>\r\n                        <button type=\"button\" className=\"btn btn-primary btn-block mb-4\" onClick={actualizarClase}>Actualizar</button>\r\n                        <button type=\"button\" className=\"btn btn-danger btn-block mb-4\" onClick={eliminarClase}>Eliminar</button>\r\n                    </>\r\n            }\r\n        </form>\r\n    )\r\n}\r\n\r\nTarjetaEdicion.propTypes = {\r\n    clase: PropTypes.shape({\r\n        id: PropTypes.string,\r\n        descripcion: PropTypes.string,\r\n        duracion: PropTypes.string,\r\n        idCurso: PropTypes.string,\r\n        orden: PropTypes.number,\r\n        titulo: PropTypes.string,\r\n        urlVideo: PropTypes.string,\r\n        recursos: PropTypes.arrayOf(PropTypes.shape({\r\n            nombre: PropTypes.string,\r\n            url: PropTypes.string\r\n        }))\r\n    })\r\n}\r\n\r\nTarjetaEdicion.defaultProps = {\r\n    clase: {\r\n        id: '',\r\n        descripcion: '',\r\n        duracion: '0h 0m',\r\n        idCurso: '',\r\n        orden: 1,\r\n        titulo: '',\r\n        urlVideo: '',\r\n        recursos: []\r\n    }\r\n}\r\n\r\nexport default TarjetaEdicion;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\dropdown-image\\dropdown.js",["372"],"import React, { useRef, useState, useEffect } from 'react';\r\nimport { useOutsideListener } from '../../hooks/useOutsideListener';\r\nimport './dropdown.css';\r\n\r\nconst tamanoIcono = 20;\r\nconst color = '#756F86';\r\n\r\nconst Dropdown = ({ list, select, stretch, selectedItem }) => {\r\n\r\n    const [open, setOpen] = useState(false);\r\n    const outsideListenerRef = useRef(null); // Escucha cuando se hace click fuera de\r\n    const { outsideListener$ } = useOutsideListener(outsideListenerRef);\r\n\r\n    useEffect(() => {\r\n        outsideListener$.subscribe(() => {\r\n            setOpen(false);\r\n        })\r\n    }, [outsideListener$]);\r\n\r\n    const toggleDropdown = (e) => {\r\n        e.preventDefault();\r\n        setOpen(!open);\r\n    }\r\n\r\n    const selectItem = (e, item) => {\r\n        e.preventDefault();\r\n        setOpen(false);\r\n        select(item);\r\n    }\r\n\r\n    const tag = (text) => (\r\n        text &&\r\n        <span className='dropdown-list-tag'>\r\n            {text}\r\n        </span>\r\n    )\r\n\r\n    return (\r\n        <div\r\n            ref={outsideListenerRef}\r\n            className='container-select-image'>\r\n            <button className={`select-image position-relative ${stretch ? 'stretch' : ''}`} onClick={toggleDropdown}>\r\n                <span className={selectedItem.icon} style={{ color, marginRight: '1rem', fontSize: tamanoIcono + 'px' }}></span>\r\n                {\r\n                    selectedItem.text\r\n                    &&\r\n                    <span className='mr-1 position-relative' style={{ color }}>\r\n                        {selectedItem.text}\r\n                        {tag(selectedItem.tag)}\r\n                    </span>\r\n                }\r\n                <span className='fa fa-caret-down' style={{ color }}></span>\r\n            </button>\r\n            {\r\n                open\r\n                &&\r\n                <div className={`selectable-list ${stretch ? 'stretch' : ''}`}>\r\n                    {\r\n                        list.map((item, index) => item.displayInDropdown != false && (\r\n                            <div key={index} onClick={(e) => selectItem(e, item)} className='selectable-list-item'>\r\n                                <span className={item.icon} style={{ color, fontSize: tamanoIcono + 'px' }}></span>\r\n                                {\r\n                                    item.text\r\n                                    &&\r\n                                    <span className='ml-1 position-relative' style={{ color }}>\r\n                                        {item.text}\r\n                                        {tag(item.tag)}\r\n                                    </span>\r\n                                }\r\n                            </div>\r\n                        ))\r\n                    }\r\n                </div>\r\n\r\n            }\r\n\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Dropdown;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\helmet\\helmet-metadata.js",[],"C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\components\\forms\\forms-steps\\form-steps.js",["373"],"import React from 'react'\r\nimport './form-steps.css'\r\n\r\nconst Steps = ({ activeIndex, navigateTo, steps }) => {\r\n\r\n    const chunksPercentage = 100 / (steps.length + 1);\r\n    const totalWidth = chunksPercentage * (steps.length - 1);\r\n\r\n    return (\r\n        <div className='form-steps'>\r\n            <div className='line' style={{ left: chunksPercentage + '%', width: totalWidth + '%' }}></div>\r\n            {\r\n                steps.map((step, index) => (\r\n                    <div key={index + 1} className='step-container'>\r\n                        <div onClick={() => navigateTo(index)} className={`form-step ${index == activeIndex ? 'active' : ''}`}>{index + 1}</div>\r\n                        <div className='step-text'>{step}</div>\r\n                    </div>\r\n                ))\r\n            }\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Steps;","C:\\Users\\Gricardov\\Desktop\\Academia Temple\\Temple Web React\\templeweb\\src\\hooks\\useOutsideListener.js",["374"],"import React, { useRef, useEffect } from \"react\";\r\nimport { Subject } from 'rxjs';\r\n\r\n/**\r\n * Hook that alerts clicks outside of the passed ref\r\n */\r\nexport const useOutsideListener = (ref) => {\r\n\r\n    const outsideListener = useRef(new Subject());\r\n\r\n    useEffect(() => {\r\n        /**\r\n       * Alert if clicked on outside of element\r\n       */\r\n        function handleClickOutside(event) {\r\n            if (ref.current && !ref.current.contains(event.target)) {\r\n                outsideListener.current.next(event);\r\n            }\r\n        }\r\n\r\n        // Bind the event listener\r\n        document.addEventListener(\"mousedown\", handleClickOutside);\r\n        return () => {\r\n            // Unbind the event listener on clean up\r\n            document.removeEventListener(\"mousedown\", handleClickOutside);\r\n        };\r\n    }, [ref]);\r\n\r\n    return {\r\n        outsideListener$: outsideListener.current\r\n    }\r\n\r\n}\r\n",{"ruleId":"375","replacedBy":"376"},{"ruleId":"377","replacedBy":"378"},{"ruleId":"379","severity":1,"message":"380","line":11,"column":12,"nodeType":"381","messageId":"382","endLine":11,"endColumn":18},{"ruleId":"383","severity":1,"message":"384","line":23,"column":66,"nodeType":"385","messageId":"386","endLine":23,"endColumn":68},{"ruleId":"387","severity":1,"message":"388","line":109,"column":33,"nodeType":"389","messageId":"390","endLine":109,"endColumn":134,"fix":"391"},{"ruleId":"379","severity":1,"message":"392","line":17,"column":12,"nodeType":"381","messageId":"382","endLine":17,"endColumn":29},{"ruleId":"379","severity":1,"message":"393","line":25,"column":12,"nodeType":"381","messageId":"382","endLine":25,"endColumn":14},{"ruleId":"379","severity":1,"message":"394","line":26,"column":12,"nodeType":"381","messageId":"382","endLine":26,"endColumn":18},{"ruleId":"379","severity":1,"message":"395","line":27,"column":12,"nodeType":"381","messageId":"382","endLine":27,"endColumn":18},{"ruleId":"379","severity":1,"message":"396","line":35,"column":12,"nodeType":"381","messageId":"382","endLine":35,"endColumn":19},{"ruleId":"383","severity":1,"message":"384","line":53,"column":20,"nodeType":"385","messageId":"386","endLine":53,"endColumn":22},{"ruleId":"397","severity":1,"message":"398","line":85,"column":8,"nodeType":"399","endLine":85,"endColumn":18,"suggestions":"400"},{"ruleId":"401","severity":1,"message":"402","line":161,"column":50,"nodeType":"403","messageId":"404","endLine":161,"endColumn":67},{"ruleId":"383","severity":1,"message":"384","line":269,"column":30,"nodeType":"385","messageId":"386","endLine":269,"endColumn":32},{"ruleId":"405","severity":1,"message":"406","line":348,"column":13,"nodeType":"407","messageId":"408","endLine":355,"endColumn":14},{"ruleId":"383","severity":1,"message":"409","line":24,"column":45,"nodeType":"385","messageId":"386","endLine":24,"endColumn":47},{"ruleId":"379","severity":1,"message":"410","line":19,"column":33,"nodeType":"381","messageId":"382","endLine":19,"endColumn":43},{"ruleId":"383","severity":1,"message":"409","line":141,"column":44,"nodeType":"385","messageId":"386","endLine":141,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":206,"column":35,"nodeType":"385","messageId":"386","endLine":206,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":243,"column":93,"nodeType":"385","messageId":"386","endLine":243,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":243,"column":121,"nodeType":"385","messageId":"386","endLine":243,"endColumn":123},{"ruleId":"383","severity":1,"message":"409","line":143,"column":44,"nodeType":"385","messageId":"386","endLine":143,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":208,"column":35,"nodeType":"385","messageId":"386","endLine":208,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":245,"column":93,"nodeType":"385","messageId":"386","endLine":245,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":245,"column":121,"nodeType":"385","messageId":"386","endLine":245,"endColumn":123},{"ruleId":"379","severity":1,"message":"411","line":19,"column":10,"nodeType":"381","messageId":"382","endLine":19,"endColumn":19},{"ruleId":"379","severity":1,"message":"412","line":19,"column":21,"nodeType":"381","messageId":"382","endLine":19,"endColumn":31},{"ruleId":"383","severity":1,"message":"409","line":141,"column":44,"nodeType":"385","messageId":"386","endLine":141,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":206,"column":35,"nodeType":"385","messageId":"386","endLine":206,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":243,"column":93,"nodeType":"385","messageId":"386","endLine":243,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":243,"column":121,"nodeType":"385","messageId":"386","endLine":243,"endColumn":123},{"ruleId":"379","severity":1,"message":"411","line":19,"column":10,"nodeType":"381","messageId":"382","endLine":19,"endColumn":19},{"ruleId":"379","severity":1,"message":"412","line":19,"column":21,"nodeType":"381","messageId":"382","endLine":19,"endColumn":31},{"ruleId":"383","severity":1,"message":"409","line":135,"column":44,"nodeType":"385","messageId":"386","endLine":135,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":200,"column":35,"nodeType":"385","messageId":"386","endLine":200,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":237,"column":93,"nodeType":"385","messageId":"386","endLine":237,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":237,"column":121,"nodeType":"385","messageId":"386","endLine":237,"endColumn":123},{"ruleId":"383","severity":1,"message":"409","line":145,"column":44,"nodeType":"385","messageId":"386","endLine":145,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":210,"column":35,"nodeType":"385","messageId":"386","endLine":210,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":247,"column":93,"nodeType":"385","messageId":"386","endLine":247,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":247,"column":121,"nodeType":"385","messageId":"386","endLine":247,"endColumn":123},{"ruleId":"383","severity":1,"message":"409","line":135,"column":44,"nodeType":"385","messageId":"386","endLine":135,"endColumn":46},{"ruleId":"383","severity":1,"message":"384","line":200,"column":35,"nodeType":"385","messageId":"386","endLine":200,"endColumn":37},{"ruleId":"383","severity":1,"message":"384","line":237,"column":93,"nodeType":"385","messageId":"386","endLine":237,"endColumn":95},{"ruleId":"383","severity":1,"message":"384","line":237,"column":121,"nodeType":"385","messageId":"386","endLine":237,"endColumn":123},{"ruleId":"379","severity":1,"message":"413","line":14,"column":12,"nodeType":"381","messageId":"382","endLine":14,"endColumn":20},{"ruleId":"397","severity":1,"message":"414","line":26,"column":8,"nodeType":"399","endLine":26,"endColumn":10,"suggestions":"415"},{"ruleId":"416","severity":1,"message":"417","line":162,"column":13,"nodeType":"389","endLine":162,"endColumn":90},{"ruleId":"416","severity":1,"message":"417","line":168,"column":47,"nodeType":"389","endLine":168,"endColumn":93},{"ruleId":"416","severity":1,"message":"418","line":170,"column":50,"nodeType":"389","endLine":170,"endColumn":102},{"ruleId":"419","severity":1,"message":"420","line":170,"column":80,"nodeType":"421","messageId":"422","endLine":170,"endColumn":101},{"ruleId":"416","severity":1,"message":"417","line":174,"column":47,"nodeType":"389","endLine":174,"endColumn":90},{"ruleId":"379","severity":1,"message":"413","line":18,"column":12,"nodeType":"381","messageId":"382","endLine":18,"endColumn":20},{"ruleId":"397","severity":1,"message":"423","line":37,"column":8,"nodeType":"399","endLine":37,"endColumn":10,"suggestions":"424"},{"ruleId":"416","severity":1,"message":"417","line":218,"column":13,"nodeType":"389","endLine":218,"endColumn":90},{"ruleId":"416","severity":1,"message":"417","line":224,"column":47,"nodeType":"389","endLine":224,"endColumn":93},{"ruleId":"416","severity":1,"message":"418","line":226,"column":50,"nodeType":"389","endLine":226,"endColumn":102},{"ruleId":"419","severity":1,"message":"420","line":226,"column":80,"nodeType":"421","messageId":"422","endLine":226,"endColumn":101},{"ruleId":"416","severity":1,"message":"417","line":230,"column":47,"nodeType":"389","endLine":230,"endColumn":90},{"ruleId":"383","severity":1,"message":"384","line":61,"column":55,"nodeType":"385","messageId":"386","endLine":61,"endColumn":57},{"ruleId":"416","severity":1,"message":"417","line":64,"column":21,"nodeType":"389","endLine":64,"endColumn":40},{"ruleId":"425","severity":1,"message":"426","line":4,"column":1,"nodeType":"427","endLine":48,"endColumn":2},{"ruleId":"428","severity":1,"message":"429","line":52,"column":22,"nodeType":"421","messageId":"430","endLine":52,"endColumn":23,"suggestions":"431"},{"ruleId":"432","severity":1,"message":"433","line":23,"column":30,"nodeType":"434","messageId":"435","endLine":23,"endColumn":32},{"ruleId":"405","severity":1,"message":"406","line":108,"column":9,"nodeType":"407","messageId":"408","endLine":123,"endColumn":10},{"ruleId":"383","severity":1,"message":"384","line":146,"column":35,"nodeType":"385","messageId":"386","endLine":146,"endColumn":37},{"ruleId":"405","severity":1,"message":"406","line":98,"column":9,"nodeType":"407","messageId":"408","endLine":113,"endColumn":10},{"ruleId":"383","severity":1,"message":"384","line":136,"column":35,"nodeType":"385","messageId":"386","endLine":136,"endColumn":37},{"ruleId":"416","severity":1,"message":"417","line":20,"column":25,"nodeType":"389","endLine":20,"endColumn":101},{"ruleId":"397","severity":1,"message":"436","line":43,"column":6,"nodeType":"399","endLine":43,"endColumn":21,"suggestions":"437"},{"ruleId":"379","severity":1,"message":"438","line":2,"column":25,"nodeType":"381","messageId":"382","endLine":2,"endColumn":42},{"ruleId":"397","severity":1,"message":"439","line":109,"column":8,"nodeType":"399","endLine":109,"endColumn":15,"suggestions":"440"},{"ruleId":"383","severity":1,"message":"409","line":59,"column":74,"nodeType":"385","messageId":"386","endLine":59,"endColumn":76},{"ruleId":"383","severity":1,"message":"384","line":15,"column":94,"nodeType":"385","messageId":"386","endLine":15,"endColumn":96},{"ruleId":"379","severity":1,"message":"441","line":1,"column":8,"nodeType":"381","messageId":"382","endLine":1,"endColumn":13},"no-native-reassign",["442"],"no-negated-in-lhs",["443"],"no-unused-vars","'cursos' is assigned a value but never used.","Identifier","unusedVar","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","react/jsx-no-target-blank","Using target=\"_blank\" without rel=\"noreferrer\" (which implies rel=\"noopener\") is a security risk in older browsers: see https://mathiasbynens.github.io/rel-noopener/#recommendations","JSXOpeningElement","noTargetBlankWithoutNoreferrer",{"range":"444","text":"445"},"'cargandoEpisodios' is assigned a value but never used.","'id' is assigned a value but never used.","'isTest' is assigned a value but never used.","'origin' is assigned a value but never used.","'success' is assigned a value but never used.","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'history.location.pathname'. Either include it or remove the dependency array.","ArrayExpression",["446"],"react/jsx-no-duplicate-props","No duplicate props allowed","JSXAttribute","noDuplicateProps","default-case","Expected a default case.","SwitchStatement","missingDefaultCase","Expected '!==' and instead saw '!='.","'faWhatsapp' is defined but never used.","'faDiscord' is defined but never used.","'faTelegram' is defined but never used.","'cargando' is assigned a value but never used.","React Hook useEffect has a missing dependency: 'obtenerProfesores'. Either include it or remove the dependency array.",["447"],"jsx-a11y/anchor-is-valid","The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md","The href attribute requires a valid value to be accessible. Provide a valid, navigable address as the href value. If you cannot provide a valid href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md","no-script-url","Script URL is a form of eval.","Literal","unexpectedScriptURL","React Hook useEffect has a missing dependency: 'obtenerCursos'. Either include it or remove the dependency array.",["448"],"import/no-anonymous-default-export","Assign arrow function to a variable before exporting as module default","ExportDefaultDeclaration","no-useless-escape","Unnecessary escape character: \\..","unnecessaryEscape",["449","450"],"array-callback-return","Array.prototype.map() expects a return value from arrow function.","ArrowFunctionExpression","expectedInside","React Hook useEffect has a missing dependency: 'obtenerClasesPorFecha'. Either include it or remove the dependency array.",["451"],"'arrayToStringList' is defined but never used.","React Hook useEffect has a missing dependency: 'correlativo'. Either include it or remove the dependency array. If 'estOrden' needs the current value of 'correlativo', you can also switch to useReducer instead of useState and read 'correlativo' in the reducer.",["452"],"'React' is defined but never used.","no-global-assign","no-unsafe-negation",[4292,4292]," rel=\"noreferrer\"",{"desc":"453","fix":"454"},{"desc":"455","fix":"456"},{"desc":"457","fix":"458"},{"messageId":"459","fix":"460","desc":"461"},{"messageId":"462","fix":"463","desc":"464"},{"desc":"465","fix":"466"},{"desc":"467","fix":"468"},"Update the dependencies array to be: [history.location.pathname, location]",{"range":"469","text":"470"},"Update the dependencies array to be: [obtenerProfesores]",{"range":"471","text":"472"},"Update the dependencies array to be: [obtenerCursos]",{"range":"473","text":"474"},"removeEscape",{"range":"475","text":"476"},"Remove the `\\`. This maintains the current functionality.","escapeBackslash",{"range":"477","text":"478"},"Replace the `\\` with `\\\\` to include the actual backslash character.","Update the dependencies array to be: [fecha, cursos, obtenerClasesPorFecha]",{"range":"479","text":"480"},"Update the dependencies array to be: [clase, correlativo]",{"range":"481","text":"482"},[2990,3000],"[history.location.pathname, location]",[1095,1097],"[obtenerProfesores]",[1403,1405],"[obtenerCursos]",[1488,1489],"",[1488,1488],"\\",[1673,1688],"[fecha, cursos, obtenerClasesPorFecha]",[3747,3754],"[clase, correlativo]"]