https://www.freecodecamp.org/component---src-pages-catalog-tsx-983d0679fbc2fa722203.js

1"use strict";(self.webpackChunk_freecodecamp_client=self.webpackChunk_freecodecamp_client||[]).push([[520],{49296:function(e,t,l){var o=l(7378),r=l(26649),i=l(79480),s=l(61550),c=l(43146);t.A=e=>{let{superBlock:t,level:l,hours:n,topic:a,showAllSummaries:u=!1}=e;const{t:p}=(0,s.Bd)(),{title:m,summary:d}=p(`intro:${t}`,{returnObjects:!0}),h=p(1===n?"curriculum.catalog.duration-singular":"curriculum.catalog.duration",{duration:n});return o.createElement(c.N_,{to:`/learn/${t}`,key:t,className:"catalog-item"},o.createElement("div",{className:"catalog-item-top"},o.createElement("div",{className:`block-label block-label-${a}`},p(`curriculum.catalog.topic.${a}`)),o.createElement("h3",null,m),u?d.map((e,t)=>o.createElement("p",{key:t},e)):d&&d.length>0?o.createElement("p",null,d[0]):null),o.createElement("div",{className:"catalog-item-bottom"},o.createElement("div",null,o.createElement(r.gc,{icon:i.UER}),"  ",p(`curriculum.catalog.levels.${l}`)),o.createElement("div",null,o.createElement(r.gc,{icon:i.a$}),"  ",h)))}},71302:function(e,t,l){l.d(t,{U$:function(){return o}});l(15912);const o=[{superBlock:"learn-python-for-beginners",level:"beginner",hours:5,topic:"python"},{superBlock:"introduction-to-algorithms-and-data-structures",level:"intermediate",hours:6,topic:"computer-science"},{superBlock:"learn-rag-mcp-fundamentals",level:"intermediate",hours:2,topic:"ai"},{superBlock:"semantic-html",level:"beginner",hours:2,topic:"html"},{superBlock:"computer-basics",level:"beginner",hours:2,topic:"computer-fundamentals"},{superBlock:"basic-css",level:"beginner",hours:3,topic:"css"},{superBlock:"basic-html",level:"beginner",hours:3,topic:"html"},{superBlock:"design-for-developers",level:"beginner",hours:2,topic:"css"},{superBlock:"html-and-accessibility",level:"beginner",hours:2,topic:"html"},{superBlock:"css-flexbox",level:"intermediate",hours:2,topic:"css"},{superBlock:"introduction-to-precalculus",level:"intermediate",hours:6,topic:"math"},{superBlock:"introduction-to-git-and-github",level:"intermediate",hours:20,topic:"git"},{superBlock:"introduction-to-python-basics",level:"intermediate",hours:40,topic:"python"},{superBlock:"absolute-and-relative-units",level:"intermediate",hours:2,topic:"css"},{superBlock:"pseudo-classes-and-elements",level:"intermediate",hours:1,topic:"css"},{superBlock:"html-forms-and-tables",level:"beginner",hours:2,topic:"html"},{superBlock:"css-colors",level:"intermediate",hours:2,topic:"css"},{superBlock:"javascript-fundamentals-review",level:"intermediate",hours:40,topic:"js"},{superBlock:"styling-forms",level:"intermediate",hours:1,topic:"css"},{superBlock:"css-box-model",level:"intermediate",hours:2,topic:"css"},{superBlock:"introduction-to-bash",level:"intermediate",hours:20,topic:"bash"},{superBlock:"introduction-to-linear-data-structures-in-python",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-algorithms-in-python",level:"intermediate",hours:40,topic:"python"},{superBlock:"css-typography",level:"intermediate",hours:1,topic:"css"},{superBlock:"css-and-accessibility",level:"intermediate",hours:2,topic:"css"},{superBlock:"css-positioning",level:"intermediate",hours:2,topic:"css"},{superBlock:"attribute-selectors",level:"intermediate",hours:2,topic:"css"},{superBlock:"responsive-design",level:"intermediate",hours:2,topic:"css"},{superBlock:"css-variables",level:"intermediate",hours:2,topic:"css"},{superBlock:"css-grid",level:"intermediate",hours:2,topic:"css"},{superBlock:"css-animations",level:"advanced",hours:2,topic:"css"},{superBlock:"introduction-to-sql-and-postgresql",level:"intermediate",hours:30,topic:"databases"},{superBlock:"learn-bash-scripting",level:"intermediate",hours:20,topic:"bash"},{superBlock:"learn-sql-and-bash",level:"intermediate",hours:30,topic:"databases"},{superBlock:"introduction-to-nano",level:"intermediate",hours:10,topic:"editors"},{superBlock:"introduction-to-variables-and-strings-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-booleans-and-numbers-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-functions-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-arrays-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-objects-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-loops-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-higher-order-functions-and-callbacks-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-dom-manipulation-and-events-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-javascript-and-accessibility",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-javascript-debugging",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-basic-regex-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-dates-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-audio-and-video-events-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-maps-and-sets-in-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-localstorage-and-crud-operations-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-javascript-classes",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-recursion-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-functional-programming-with-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"introduction-to-asynchronous-javascript",level:"intermediate",hours:40,topic:"js"},{superBlock:"learn-data-visualization-with-d3",level:"intermediate",hours:20,topic:"d3"},{superBlock:"learn-oop-with-python",level:"intermediate",hours:3,topic:"python"},{superBlock:"learn-python-loops-and-sequences",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-python-dictionaries-and-sets",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-error-handling-in-python",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-python-classes-and-objects",level:"intermediate",hours:40,topic:"python"},{superBlock:"introduction-to-oop-in-python",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-graphs-and-trees-in-python",level:"intermediate",hours:40,topic:"python"},{superBlock:"learn-dynamic-programming-in-python",level:"intermediate",hours:40,topic:"python"}]},73164:function(e,t,l){l.r(t);var o=l(7378),r=l(61550),i=l(99198),s=l(71302),c=l(49296);t.default=()=>{const{t:e}=(0,r.Bd)(),[t,l]=(0,o.useState)(["all"]),[n,a]=(0,o.useState)(["all"]),u=(0,o.useMemo)(()=>[...new Set(s.U$.map(e=>e.level))].sort(),[]),p=(0,o.useMemo)(()=>[...new Set(s.U$.map(e=>e.topic))].sort(),[]),m=e=>{l("all"===e?["all"]:t=>{const l=t.filter(e=>"all"!==e);if(l.includes(e)){const t=l.filter(t=>t!==e);return 0===t.length?["all"]:t}return[...l,e]})},d=e=>{a("all"===e?["all"]:t=>{const l=t.filter(e=>"all"!==e);if(l.includes(e)){const t=l.filter(t=>t!==e);return 0===t.length?["all"]:t}return[...l,e]})},h=(0,o.useMemo)(()=>s.U$.filter(e=>{const l=t.includes("all")||t.includes(e.level),o=n.includes("all")||n.includes(e.topic);return l&&o}),[t,n]);return o.createElement("main",null,o.createElement(i.hK,{size:"l"}),o.createElement("h1",{className:"text-center"},e("curriculum.catalog.title")),o.createElement(i.hK,{size:"l"}),o.createElement(i.fv,{md:8,mdOffset:2,sm:10,smOffset:1,xs:12},o.createElement("div",{className:"catalog-filters"},o.createElement(i.ms,{block:!0},o.createElement(i.ms.Toggle,{id:"level-filter-dropdown"},"Level:"," ",t.includes("all")?"All":`${t.length} selected`),o.createElement(i.ms.Menu,null,o.createElement(i.Dr,{onClick:()=>m("all")},o.createElement("input",{type:"checkbox",checked:t.includes("all"),onChange:()=>{},className:"filter-checkbox"}),"All"),u.map(l=>o.createElement(i.Dr,{key:l,onClick:()=>m(l)},o.createElement("input",{type:"checkbox",checked:t.includes(l),onChange:()=>{},className:"filter-checkbox"}),e(`curriculum.catalog.levels.${l}`))))),o.createElement(i.ms,{block:!0},o.createElement(i.ms.Toggle,{id:"topic-filter-dropdown"},"Topic:"," ",n.includes("all")?"All":`${n.length} selected`),o.createElement(i.ms.Menu,null,o.createElement(i.Dr,{onClick:()=>d("all")},o.createElement("input",{type:"checkbox",checked:n.includes("all"),onChange:()=>{},className:"filter-checkbox"}),"All"),p.map(t=>o.createElement(i.Dr,{key:t,onClick:()=>d(t)},o.createElement("input",{type:"checkbox",checked:n.includes(t),onChange:()=>{},className:"filter-checkbox"}),e(`curriculum.catalog.topic.${t}`))))))),o.createElement(i.hK,{size:"m"}),o.createElement(i.fv,{md:8,mdOffset:2,sm:10,smOffset:1,xs:12},0===h.length?o.createElement(i.Fc,{variant:"info"},e("curriculum.catalog.no-results")):o.createElement("section",{className:"catalog-wrap"},h.map(e=>{const{superBlock:t,level:l,hours:r,topic:i}=e;return o.createElement(c.A,{key:t,superBlock:t,level:l,hours:r,topic:i,showAllSummaries:!0})}))),o.createElement(i.hK,{size:"l"}))}}}]);
2//# sourceMappingURL=component---src-pages-catalog-tsx-983d0679fbc2fa722203.js.map