This commit is contained in:
Benjamin Qi 2020-07-16 18:39:10 -04:00
commit cdd43e4480
5 changed files with 50 additions and 40 deletions

View file

@ -4,7 +4,7 @@ title: "Prefix Sums"
author: Darren Yao, Eric Wei
description: "Computing range sum queries in constant time over a fixed array."
prerequisites:
- Bronze - Introduction to Data Structures
- intro-ds
frequency: 3
---

View file

@ -1,4 +1,4 @@
import { moduleIDToSectionMap, SECTIONS } from './content/ordering';
import { SECTIONS } from './content/ordering';
exports.onCreateNode = ({ node, actions, getNode }) => {
const { createNodeField } = actions;
@ -7,7 +7,7 @@ exports.onCreateNode = ({ node, actions, getNode }) => {
createNodeField({
name: 'division',
node,
value: moduleIDToSectionMap[node.frontmatter.id],
value: ordering.moduleIDToSectionMap[node.frontmatter.id],
});
}
};

View file

@ -248,6 +248,19 @@ const NavBar = ({ alignNavButtonsRight = true }) => {
);
};
const renderPrerequisite = (prerequisite, moduleLinks: ModuleLinkInfo[]) => {
let moduleLink = moduleLinks.find(x => x.id === prerequisite);
if (moduleLink)
return (
<li key={prerequisite}>
<Link to={moduleLink.url} className="underline text-black">
{SECTION_LABELS[moduleLink.division]} - {moduleLink.title}
</Link>
</li>
);
return <li key={prerequisite}>{prerequisite}</li>;
};
export default function ModuleLayout({
module,
children,
@ -447,6 +460,39 @@ export default function ModuleLayout({
</div>
</div>
</div>
{module.prerequisites && (
<div className="rounded-md bg-blue-50 p-4 mb-4">
<div className="flex">
<div className="flex-shrink-0">
<svg
className="h-5 w-5 text-blue-400"
fill="currentColor"
viewBox="0 0 20 20"
>
<path
fillRule="evenodd"
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
clipRule="evenodd"
/>
</svg>
</div>
<div className="ml-3">
<h3 className="text-sm leading-5 font-medium text-blue-800">
Prerequisites
</h3>
<div className="mt-2 text-sm leading-5 text-blue-800">
<ul className="list-disc list-inside pl-3 space-y-1">
{module.prerequisites.map(x =>
renderPrerequisite(x, moduleLinks)
)}
</ul>
</div>
</div>
</div>
</div>
)}
{children}
<h3 className="text-lg leading-6 font-medium text-gray-900 text-center mb-8 border-t border-gray-200 pt-8">

View file

@ -25,7 +25,7 @@ const components = {
children: React.ReactNode;
title: string;
}) => (
<div className="rounded-md bg-blue-50 p-4 mb-8 info-block">
<div className="rounded-md bg-blue-50 p-4 mb-4 info-block">
<div className="flex">
<div className="flex-shrink-0">
<svg

View file

@ -8,18 +8,12 @@ import { graphqlToModuleInfo } from '../utils';
import SEO from '../components/seo';
import ModuleLayout from '../components/ModuleLayout/ModuleLayout';
const renderPrerequisite = prerequisite => {
return <li key={prerequisite}>{prerequisite}</li>;
};
export default function Template(props) {
const { mdx } = props.data; // data.markdownRemark holds your post data
const { body } = mdx;
const module = React.useMemo(() => graphqlToModuleInfo(mdx), [mdx]);
const division = module.division;
const prereqs = mdx.frontmatter.prerequisites;
return (
<Layout>
<SEO
@ -30,36 +24,6 @@ export default function Template(props) {
<div className="h-screen flex overflow-hidden bg-white">
<ModuleLayout module={module}>
<div className="py-4">
{prereqs && (
<div className="rounded-md bg-blue-50 p-4 mb-4">
<div className="flex">
<div className="flex-shrink-0">
<svg
className="h-5 w-5 text-blue-400"
fill="currentColor"
viewBox="0 0 20 20"
>
<path
fillRule="evenodd"
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
clipRule="evenodd"
/>
</svg>
</div>
<div className="ml-3">
<h3 className="text-sm leading-5 font-medium text-blue-800">
Prerequisites
</h3>
<div className="mt-2 text-sm leading-5 text-blue-800">
<ul className="list-disc list-inside pl-3 space-y-1">
{prereqs.map(renderPrerequisite)}
</ul>
</div>
</div>
</div>
</div>
)}
{module.description && (
<p className="font-bold mb-8 bg-green-50 border-l-4 border-green-400 text-green-800 p-4">
{module.description}