-
-
- Which grade?
- K
- 1
- 2
- 3
- 4
- 5
-
-
Search
+
+
+
Search Lesson Plan
+
+
+
+
+
+
+
+
+ Which Grade?
+ K
+ Grade 1
+ Grade 2
+ Grade 3
+ Grade 4
+ Grade 5
+
+
+ Search
+
+
- )
-}
+ );
+};
-export default SearchBar;
\ No newline at end of file
+export default SearchBar;
diff --git a/src/globals.css b/src/globals.css
index 4d33335..6db93bd 100644
--- a/src/globals.css
+++ b/src/globals.css
@@ -1,68 +1,70 @@
:root {
- --color-primary: #264653;
- --color-secondary: #ffffff;
- --color-terciary: #000000;
- --color-accent: #E9C46A;
- --color-accent2: #E76F51;
- --ff: "Georgia", serif;
- --h1: bold 54px/64px var(--ff);
- --h2: bold 36px/36px var(--ff);
- --h3: bold 24px/30px var(--ff);
-
- /* Consider adding dynamic heading size later on*/
- /* */
-
- --p: 18px/30px var(--ff);
- --subtext: 12px/20px var(--ff);
- --shadow: #00000030 0px 0px 10px 0px;
- --shadowdark: #00000030 0px 5px 10px 5px;
- }
-
- body {
- color: var(--foreground);
- background: var(--background);
- font-family: Arial, Helvetica, sans-serif;
- }
-
- h1 {
- font: var(--h1);
- margin-top: 8px;
- }
-
- h2 {
- font: var(--h2);
- margin-top: 8px;
- }
-
- h3 {
- font: var(--h3);
- margin-top: 8px;
- }
-
- p {
- font: var(--p);
- margin-top: 8px;
- }
-
- .subtext {
- font: var(--subtext);
- margin-top: 8px;
- }
-
-
- .section {
- margin: 80px auto 0px auto;
- max-width: 1512px;
- }
-
- .col {
- display: flex;
- gap: 20px;
- flex-wrap: wrap;
- align-items: center;
- }
-
- .col * {
- flex: 1;
- min-width: 320px;
- }
\ No newline at end of file
+ --color-primary: #264653;
+ --color-secondary: #ffffff;
+ --color-tertiary: #000000;
+ --color-accent: #e9c46a;
+ --color-accent2: #e76f51;
+ --color-header: #1a3039;
+ --color-buttonhover: #d4a02b;
+ /* --ff: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif; */
+ --ff: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ --h1: bold 3rem var(--ff);
+ --h2: bold 2.25rem var(--ff);
+ --h3: bold 1.5rem var(--ff);
+ --p: 1.125rem var(--ff);
+ --subtext: 0.75rem var(--ff);
+ --shadow: #00000030 0px 0px 10px 0px;
+ --shadowdark: #00000030 0px 5px 10px 5px;
+}
+
+body {
+ color: var(--color-secondary);
+ background: var(--color-primary);
+ font-family: var(--ff);
+}
+
+body * {
+ font-family: var(--ff);
+}
+
+h1 {
+ font: var(--h1);
+ margin-top: 8px;
+}
+
+h2 {
+ font: var(--h2);
+ margin-top: 8px;
+}
+
+h3 {
+ font: var(--h3);
+ margin-top: 8px;
+}
+
+p {
+ font: var(--p);
+ margin-top: 8px;
+}
+
+.subtext {
+ font: var(--subtext);
+ margin-top: 8px;
+}
+
+.section {
+ margin: 80px auto 0px auto;
+ max-width: 1512px;
+}
+
+.col {
+ display: flex;
+ gap: 20px;
+ flex-wrap: wrap;
+ align-items: center;
+}
+
+.col * {
+ flex: 1;
+ min-width: 320px;
+}
diff --git a/src/index.js b/src/index.js
index 8f3e070..e119ca7 100644
--- a/src/index.js
+++ b/src/index.js
@@ -10,4 +10,4 @@ root.render(
-);
\ No newline at end of file
+);
diff --git a/src/pages/AboutUsPage/AboutUs.css b/src/pages/AboutUsPage/AboutUs.css
new file mode 100644
index 0000000..7ca239f
--- /dev/null
+++ b/src/pages/AboutUsPage/AboutUs.css
@@ -0,0 +1,115 @@
+.about-us-page-container {
+ justify-content: left;
+ padding: 2rem 5%;
+ background-color: var(--color-primary);
+}
+
+.hero h3, h2 {
+ color: var(--color-secondary);
+}
+
+.text-container {
+ width: 50%;
+}
+
+.section-title {
+ font-size: 1.7rem;
+ font-weight: bold;
+ flex-basis: 30%;
+ display: flex;
+ gap: 1rem;
+ text-align: center;
+ color: var(--color-accent);
+}
+
+.section-title img {
+ height: 1.5rem;
+ vertical-align: bottom;
+ filter: invert(97%) sepia(64%) saturate(1158%) hue-rotate(317deg) brightness(94%) contrast(95%);
+}
+
+.section-text {
+ font-size: 1.2rem;
+ /* line-height: 1.5; */
+ /* flex-basis: 70%; */
+ /* width: 50%; */
+ /* text-align: justify; */
+ color: var(--color-secondary);
+}
+
+.meet-team-container {
+ text-align: center;
+ margin-top: 2rem;
+}
+
+.meet-team-container h2 {
+ font-size: 2rem;
+ font-weight: bold;
+ margin-bottom: 2rem;
+}
+
+.team-grid {
+ display: flex;
+ gap: 2rem;
+ justify-content: center;
+}
+
+.team-member {
+ position: relative;
+ text-align: center;
+ transition: transform 0.3s;
+ cursor: pointer;
+ border: 1px solid;
+ border-radius: 15px;
+ background-color: var(--color-secondary);
+}
+
+
+.team-member img {
+ width: 200px;
+ height: 200px;
+ border-radius: 15px 15px 0 0;
+}
+
+.team-member:hover {
+ transform: scale(1.05);
+}
+
+.team-member-overlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #ffffff;
+ border-radius: 10px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ opacity: 0;
+ transition: opacity 0.3s;
+ text-align: center;
+ padding: 1rem;
+ box-sizing: border-box;
+}
+
+.team-member:hover .team-member-overlay {
+ opacity: 1;
+}
+
+.team-member-overlay p {
+ font-size: 1rem;
+ line-height: 1.5;
+}
+
+.main-container {
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-between;
+ gap: 2rem;
+ /* width: 100%; */
+ padding: 2rem 0;
+ margin-bottom: 2rem;
+ /* background-color: aquamarine; */
+}
\ No newline at end of file
diff --git a/src/pages/AboutUsPage/AboutUs.js b/src/pages/AboutUsPage/AboutUs.js
new file mode 100644
index 0000000..ebf97a2
--- /dev/null
+++ b/src/pages/AboutUsPage/AboutUs.js
@@ -0,0 +1,37 @@
+import "./AboutUs.css";
+import collage from "./assets/collage.jpg";
+
+import "@blueprintjs/core/lib/css/blueprint.css";
+
+const AboutUs = () => {
+ return (
+
+
+
Empowering Education Through Justice
+ Integrating Social Justice Themes in K-5 Math Education
+
+
+
+
+
+
+
+ The idea for these lesson plans was sparked in 2008 when I taught my first math methods course as I sought a way to integrate math, social justice and literacy. In the years since, I have been committed to supporting teachers to find space for conversations about difficult and/or challenged topics. These lessons can be a starting point for these discussions.
+
+
+ -- Dr. Anita Wager
+ (Founder, [Not] Just Math)
+
+
+
+
+
+
+
Acknowledgements
+
+
+
+ )
+}
+
+export default AboutUs;
\ No newline at end of file
diff --git a/src/pages/AboutUsPage/assets/collage.jpg b/src/pages/AboutUsPage/assets/collage.jpg
new file mode 100644
index 0000000..76961da
Binary files /dev/null and b/src/pages/AboutUsPage/assets/collage.jpg differ
diff --git a/src/pages/AdminPage/AdminPage.css b/src/pages/AdminPage/AdminPage.css
index d39dc2c..3edd9c2 100644
--- a/src/pages/AdminPage/AdminPage.css
+++ b/src/pages/AdminPage/AdminPage.css
@@ -1,138 +1,20 @@
-.admin-content-container {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: flex-start;
- font-family: Arial;
- width: 100%;
-}
-
-.admin-sub-header {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: center;
-}
-
-.admin-sub-header button {
- font-size: 16px;
- cursor: pointer;
- background-color: #9ab6b9;
- color: white;
- border: none;
- padding: 12px 18px 12px 18px;
- border-radius: 12px;
-}
-
-.admin-sub-header button:hover {
- background-color: #728b8e;
-}
-
-.admin-sub-header h3 {
- font-size: 22px;
- font-weight: 500;
- margin-right: 25px;
-}
-
-.admin-core-container {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: center;
- width: 100%;
-}
-
-.admin-content-left {
- width: 40%;
- margin-right: 20px;
-}
-
-.admin-content-right {
- width: 40%;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: flex-start;
- max-height: 600px;
- overflow-y: scroll;
+.page-container {
+ background-color: var(--color-primary);
+ height: 100vh;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
-.admin-content-right h4 {
- font-size: 20px;
- font-weight: 500;
-}
-
-.pdf-navigation-container {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: center;
-}
-
-.pdf-nav {
- padding: 40px 2px 40px 2px;
- background-color: #9ab6b9;
- cursor: pointer;
- z-index: 5;
-}
-
-.pdf-left {
- border-radius: 24px 0 0 24px;
- margin-right: -8%;
-}
-
-.pdf-right {
- border-radius: 0 24px 24px 0;
- margin-left: -8%;
-}
-
-.pdf-nav:hover {
- background-color: #728b8e;
-}
-
-.invalid {
- opacity: 30%;
- cursor: default;
-}
-
-.pdf-review-options {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: center;
- margin-top: -30px;
-}
-
-.pdf-review-option {
- padding: 12px 18px 12px 18px;
- border-radius: 12px;
- margin: 12px;
- cursor: pointer;
- width: 80px;
- text-align: center;
-}
-
-.approve {
- border: 2px solid green;
- background-color: #9ab6b9;
- opacity: 75%;
-}
-
-.approve:hover {
- opacity: 100%;
-}
-
-.reject {
- border: 2px solid red;
- background-color: lightcoral;
- opacity: 75%;
+.admin-content-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: flex-start;
+ font-family: var(--ff);
+ width: 100%;
}
-.reject:hover {
- opacity: 100%;
+[data-amplify-container] {
+ margin-top: 30%;
}
-
-.admin-preview {
- cursor: pointer;
- width: 80%;
-}
\ No newline at end of file
diff --git a/src/pages/AdminPage/AdminPage.js b/src/pages/AdminPage/AdminPage.js
index c4a18b6..f22471f 100644
--- a/src/pages/AdminPage/AdminPage.js
+++ b/src/pages/AdminPage/AdminPage.js
@@ -1,66 +1,30 @@
+import { Routes, Route } from "react-router-dom";
import { Authenticator } from "@aws-amplify/ui-react";
+import '@aws-amplify/ui-react/styles.css';
import { useState, useEffect } from "react";
-import { Document, Page } from "react-pdf";
-import { getUrl } from "aws-amplify/storage";
-import { listLessonPlans, rejectLessonPlanByID, approveLessonPlanByID } from "../../util/dynamo";
+import { listLessonPlans } from "../../util/dynamo";
import { LessonPlanApprovalStates } from "../../util/constants";
-import Header from "../../components/Header/Header";
-import NavPrevious from "./assets/nav-prev.png";
-import NavNext from "./assets/nav-next.png";
+import AdminViewLessonPlan from "../../components/AdminViewLessonPlan/AdminViewLessonPlan";
+import ReviewSubheader from "../../components/ReviewSubheader/ReviewSubheader";
+import RenderPendingLessonPlans from "../../components/RenderPendingLessonPlans/RenderPendingLessonPlans";
import "./AdminPage.css";
+import RenderApprovedLessonPlans from "../../components/RenderApprovedLessonPlans/RenderApprovedLessonPlans";
+import RenderRejectedLessonPlans from "../../components/RenderRejectedLessonPlans/RenderRejectedLessonPlans";
const AdminPage = () => {
const [pendingLessonPlans, setPendingLessonPlans] = useState([]);
- const [currentLessonPlanID, setCurrentLessonPlanID] = useState(null);
- const [currentLessonPlanPDFUrl, setCurrentLessonPlanPDFUrl] = useState(null);
- const [numPages, setNumPages] = useState(null);
- const [pageNumber, setPageNumber] = useState(1);
-
- function onDocumentLoadSuccess({ numPages }) {
- setNumPages(numPages);
- }
+ const [approvedLessonPlans, setApprovedLessonPlans] = useState([]);
+ const [rejectedLessonPlans, setRejectedLessonPlans] = useState([]);
useEffect(() => {
- const getAndSetPendingLessonPlans = async () => {
+ const getAndSetLessonPlans = async () => {
const lessonPlans = await listLessonPlans();
- const pendingLessonPlans = lessonPlans.filter(lessonPlan => lessonPlan.approval_state === LessonPlanApprovalStates.PENDING);
- setPendingLessonPlans(pendingLessonPlans);
- }
-
- getAndSetPendingLessonPlans();
- }, [])
-
- const handleLessonPlanSelection = async (lessonPlanID) => {
- const pdfURL = await getUrl({key: lessonPlanID});
- setCurrentLessonPlanID(lessonPlanID);
- setCurrentLessonPlanPDFUrl(pdfURL.url.href)
- }
-
- const approveCurrentLessonPlan = async () => {
- if (currentLessonPlanID) {
- await approveLessonPlanByID(currentLessonPlanID);
- resetStateAfterUpdate();
- }
- }
-
- const rejectCurrentLessonPlan = async () => {
- if (currentLessonPlanID) {
- await rejectLessonPlanByID(currentLessonPlanID);
- resetStateAfterUpdate();
- }
- }
-
- const resetStateAfterUpdate = () => {
- const lessonPlanIDToRemove = currentLessonPlanID;
- setCurrentLessonPlanID(null);
- setCurrentLessonPlanPDFUrl(null);
- setNumPages(null);
- setPageNumber(1);
-
- let lessonPlans = pendingLessonPlans;
- lessonPlans = lessonPlans.filter(lessonPlan => lessonPlan.id !== lessonPlanIDToRemove);
- setPendingLessonPlans(lessonPlans)
- }
+ setPendingLessonPlans(lessonPlans.filter(lp => lp.approval_state === LessonPlanApprovalStates.PENDING));
+ setApprovedLessonPlans(lessonPlans.filter(lp => lp.approval_state === LessonPlanApprovalStates.APPROVED));
+ setRejectedLessonPlans(lessonPlans.filter(lp => lp.approval_state === LessonPlanApprovalStates.REJECTED));
+ };
+ getAndSetLessonPlans();
+ }, []);
const renderGrades = (lower, upper) => {
if (lower === upper) {
@@ -70,102 +34,58 @@ const AdminPage = () => {
}
}
- const renderPendingLessonPlans = () => {
- if (pendingLessonPlans.length > 0) {
- return pendingLessonPlans.map(lessonPlan => {
- return (
-
-
-
{lessonPlan.lesson_title} ({renderGrades(lessonPlan.grade_level_lower, lessonPlan.grade_level_upper)})
-
Math Concepts: {lessonPlan.math_concept_tags.join(", ")}
-
Social Concepts: {lessonPlan.social_concept_tags.join(", ")}
-
Math Content Standards: {lessonPlan.standard_tags.join(", ")}
-
-
-
- )
- })
- } else {
- return
No pending submissions. Well done!
- }
- }
-
- const addPrevValidityClass = () => {
- if (pageNumber === 1) {
- return 'invalid';
- }
- return '';
- }
-
- const addNextValidityClass = () => {
- if (pageNumber === numPages) {
- return 'invalid';
- }
- return '';
- }
-
- const renderCurrentPDF = () => {
- if (currentLessonPlanPDFUrl) {
- return (
-
-
-
-
-
-
-
-
-
-
-
- )
- } else if (pendingLessonPlans.length > 0) {
- return (
-
No PDF currently loaded. Please select a lesson plan to review.
- )
- }
- }
-
- const nextPage = () => {
- if (pageNumber < numPages) {
- setPageNumber(pageNumber+1)
- }
- }
-
- const previousPage = () => {
- if (pageNumber > 1) {
- setPageNumber(pageNumber-1)
- }
- }
-
return (
-
- {({ signOut, _user }) => (
+ <>
+
-
-
Review Lesson Plans
- Logout
-
-
-
- {renderCurrentPDF()}
-
-
-
Lesson Plan Selection
- {renderPendingLessonPlans()}
-
-
+
+
-
- )
+ );
}
export default AdminPage;
\ No newline at end of file
diff --git a/src/pages/GuidePage/GuidePage.css b/src/pages/GuidePage/GuidePage.css
deleted file mode 100644
index e3ee7fd..0000000
--- a/src/pages/GuidePage/GuidePage.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.guide-wip-message {
- font-family: Arial;
- font-size: 24px;
-}
-
-.guide-logo {
- margin-top: 80px;
- width: 30%;
-}
\ No newline at end of file
diff --git a/src/pages/GuidePage/GuidePage.js b/src/pages/GuidePage/GuidePage.js
deleted file mode 100644
index cb180d1..0000000
--- a/src/pages/GuidePage/GuidePage.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import Header from "../../components/Header/Header";
-import LogoWithText from "./assets/logo-with-text.png"
-import "./GuidePage.css";
-
-const GuidePage = () => {
- return (
-
-
-
-
This page is a work in progress ...
-
- )
-}
-
-export default GuidePage;
\ No newline at end of file
diff --git a/src/pages/GuidePage/assets/logo-with-text.png b/src/pages/GuidePage/assets/logo-with-text.png
deleted file mode 100644
index f4438b3..0000000
Binary files a/src/pages/GuidePage/assets/logo-with-text.png and /dev/null differ
diff --git a/src/pages/HomePage/HomePage.css b/src/pages/HomePage/HomePage.css
index 8518779..6c2e454 100644
--- a/src/pages/HomePage/HomePage.css
+++ b/src/pages/HomePage/HomePage.css
@@ -1,45 +1,102 @@
.home-option-container {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: center;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
}
.home-splash-logo {
- margin: 10px;
- width: 30%;
+ width: 100%;
}
.home-content-container {
- display: flex;
- flex-direction: column;
- align-items: flex-start;
- justify-content: space-between;
- background-color: #8FAEB1;
- width: 100%;
- color: white;
- font-family: Arial;
- padding-bottom: 30px;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: space-between;
+ background-color: #8faeb1;
+ width: 100%;
+ color: white;
+ font-family: var(--ff);
+ padding-bottom: 30px;
}
.home-subtitle {
- font-size: 22px;
- padding-left: 20px;
+ font-size: 22px;
+ padding-left: 20px;
}
.home-paragraph {
- font-size: 18px;
- padding-left: 40px;
- padding-right: 40px;
- text-wrap: wrap;
+ font-size: 18px;
+ padding-left: 40px;
+ padding-right: 40px;
+ text-wrap: wrap;
}
.home-acknowledgements {
- padding-left: 40px;
- padding-right: 40px;
- padding-bottom: 6px;
+ padding-left: 40px;
+ padding-right: 40px;
+ padding-bottom: 6px;
}
.home-acknowledgement {
- font-size: 18px;
-}
\ No newline at end of file
+ font-size: 18px;
+}
+
+.hero-container {
+ position: relative;
+ display: inline-block;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ gap: 20px;
+ /* margin-top: 20px; */
+}
+
+.browse-button {
+ position: absolute;
+ top: 80%;
+ left: 60%;
+ transform: translate(-50%, -50%);
+ padding: 10px 20px;
+ background-color: #e9c46a;
+
+ color: black;
+ border: none;
+ border-radius: 5px;
+ font-size: 16px;
+ cursor: pointer;
+ transition: background-color 0.3s ease;
+}
+
+.browse-button:hover {
+ background-color: #de9e28;
+}
+.learn-button {
+ position: absolute;
+ top: 80%;
+ left: 40%;
+ transform: translate(-50%, -50%);
+ padding: 10px 20px;
+ /* background-color: transparent; */
+ background-color: #e9c46a;
+ color: black;
+ border: none;
+ border-radius: 5px;
+ font-size: 16px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ transition: background-color 0.3s ease;
+}
+
+.learn-button .arrow-icon {
+ margin-left: 8px;
+ font-size: 1rem;
+ color: var(--color-accent2);
+ transition: transform 0.3s ease;
+}
+
+.learn-button:hover .arrow-icon {
+ transform: translateX(8px);
+}
diff --git a/src/pages/HomePage/HomePage.js b/src/pages/HomePage/HomePage.js
index b573e08..2b31092 100644
--- a/src/pages/HomePage/HomePage.js
+++ b/src/pages/HomePage/HomePage.js
@@ -1,36 +1,40 @@
-import Header from "../../components/Header/Header";
-import LogoWithText from "./assets/logo-with-text.png";
+import { FaArrowRight } from "react-icons/fa";
+import Hero from "./assets/nbthero.png";
import "./HomePage.css";
-
-const PURPOSE_TEXT = "[Not] Just Math is a collection of lesson plans for grades K-5 that seamlessly fuse together mathematical concepts and themes of justice through children’s literature! In a world where classrooms are experiencing a more turbulent geopolitical atmosphere, [Not] Just Math aims to make it accessible for educators to integrate multidimensional lessons in their classrooms that contribute to a holistic learning experience. The lesson plans that are found at [Not] Just Math have all been put into practice and were created by teachers, for teachers. We encourage educators to visit our “Upload” tab and share a lesson plan that you have created with similar just-minded mathematical lesson plans. The themes embedded in our lesson plans range from sharing and interpersonal relationships to racism and LGBTQ acceptance, all the while learning skills such as geometry and equations. We hope that [Not] Just Math serves as a collaborative space for educators to both utilize and expand our growing body of resources for classrooms across the nation to explore important mathematical and justice concepts."
-const PASSION_TEXT = "[Not] Just Math was developed by a team of scholars at Vanderbilt University in collaboration with The Buchanan Library Fellowship Program. Together, the team consisting of University Faculty, staff, and fellows set out to create a space that provides educators an accessible database of math lesson plans that promote “equality, equity, diversity, and social awareness”. [Not] Just Math aims to create a classroom environment that fosters critical thinking and prompts active engagement in constructive dialogue leading to a more “equitable and just society”. Lesson plans for [Not] Just Math align with Common Core and “Social Justice Standards” published by “Learning for Justice”. [Not] Just Math has evolved from a collection of lesson plans to an expansive resource for educators to advance their students’ engagement with both hard mathematical concepts and challenging themes of justice."
+import SearchPage from "../SearchPage/SearchPage2";
+import { useNavigate } from "react-router-dom";
+import { useRef } from "react";
const HomePage = () => {
+ const navigate = useNavigate();
+ const searchPageRef = useRef(null);
+
+ const navigateToAbout = () => {
+ navigate("/about-us");
+ };
+
+ const scrollToSearchPage = () => {
+ if (searchPageRef.current) {
+ searchPageRef.current.scrollIntoView({ behavior: "smooth" });
+ }
+ };
- return (
-
-
-
-
-
-
Our Purpose
-
{PURPOSE_TEXT}
-
-
-
Our Passion
-
{PASSION_TEXT}
-
-
-
Our People
-
-
Peabody College of Education and Human Development at Vanderbilt University
-
The Jean and Alexander Heard Libraries at Vanderbilt University
-
The Buchanan Library Fellowship Program
-
-
-
-
- )
-}
+ return (
+
+
+
+
+ Browse Our Library
+
+
+ Learn More About Us
+
+
+
+
+ );
+};
-export default HomePage;
\ No newline at end of file
+export default HomePage;
diff --git a/src/pages/HomePage/assets/nbthero.png b/src/pages/HomePage/assets/nbthero.png
new file mode 100644
index 0000000..0e3d34d
Binary files /dev/null and b/src/pages/HomePage/assets/nbthero.png differ
diff --git a/src/pages/LessonPage/LessonPage.js b/src/pages/LessonPage/LessonPage.js
index 1360e86..5c11ca8 100644
--- a/src/pages/LessonPage/LessonPage.js
+++ b/src/pages/LessonPage/LessonPage.js
@@ -3,7 +3,6 @@ import { Document, Page } from "react-pdf";
import { useParams, Link } from "react-router-dom";
import { getUrl } from "aws-amplify/storage";
import { getLessonPlanByID } from "../../util/dynamo";
-import Header from "../../components/Header/Header";
import "react-pdf/dist/esm/Page/AnnotationLayer.css";
import "react-pdf/dist/esm/Page/TextLayer.css";
import "./LessonPage.css";
@@ -96,7 +95,6 @@ const LessonPage = () => {
return (
-
{renderLessonInfo()}
)
diff --git a/src/pages/LessonPage/LessonPageNew.css b/src/pages/LessonPage/LessonPageNew.css
new file mode 100644
index 0000000..f92a48b
--- /dev/null
+++ b/src/pages/LessonPage/LessonPageNew.css
@@ -0,0 +1,81 @@
+.lesson-page-container {
+ background-color: var(--color-primary);
+ padding: 0 5rem ;
+ display: flex;
+ flex-direction: column;
+ min-height: 100vh;
+ padding: 0rem 5% 2rem 5%;
+}
+
+.lesson-top-container {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 2rem;
+ color: var(--color-secondary);
+}
+
+.lesson-body-container {
+ display: flex;
+ justify-content: space-between;
+ align-items: start;
+ height: 100%;
+ width: 100%;
+}
+
+.lesson-pdf-container {
+ border-radius: 1rem;
+ height: 100vh;
+ overflow: hidden;
+ flex: 3;
+ flex-direction: column;
+
+}
+
+.lesson-info-container {
+ display: flex;
+ flex-direction: column;
+ margin-left: 2rem;
+ border-radius: 1rem;
+ padding: 2rem;
+ text-align: flex-start;
+ flex: 1;
+ background-color: var(--color-secondary);
+ color: var(--color-tertiary);
+}
+
+.label {
+ font-weight: bold;
+ vertical-align: baseline;
+}
+
+.lesson-info-container h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.7rem;
+}
+
+.lesson-info-container p {
+ margin: 0;
+ font-size: 1rem;
+ line-height: 1.5;
+}
+
+
+.download-button {
+ padding: 12px 24px;
+ border: none;
+ cursor: pointer;
+ border-radius: 16px;
+ background-color: var(--color-accent);
+ text-decoration: none;
+ color: var(--color-text);
+ text-align: center;
+ margin-top: 1rem;
+
+}
+
+.download-button:hover {
+ background-color: var(--color-primary);
+ color: var(--color-secondary);
+}
diff --git a/src/pages/LessonPage/LessonPageNew.js b/src/pages/LessonPage/LessonPageNew.js
new file mode 100644
index 0000000..bf4f4a9
--- /dev/null
+++ b/src/pages/LessonPage/LessonPageNew.js
@@ -0,0 +1,105 @@
+import { useState, useEffect } from "react";
+import { Document, Page, pdfjs } from "react-pdf";
+import { useParams, Link } from "react-router-dom";
+import { getUrl } from "aws-amplify/storage";
+import { getLessonPlanByID } from "../../util/dynamo";
+import "react-pdf/dist/esm/Page/AnnotationLayer.css";
+// import "react-pdf/dist/esm/Page/TextLayer.css";
+import "./LessonPageNew.css";
+import { Viewer } from '@react-pdf-viewer/core';
+
+// Import the styles
+import '@react-pdf-viewer/core/lib/styles/index.css';
+
+pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
+
+const LessonPage = () => {
+ const { lessonID } = useParams();
+ const [pdfLink, setPDFLink] = useState(null);
+ const [lessonMetadata, setLessonMetadata] = useState(null);
+ const [numPages, setNumPages] = useState(null);
+ const [pageNumber, setPageNumber] = useState(1);
+
+ function onDocumentLoadSuccess({ numPages }) {
+ setNumPages(numPages);
+ }
+
+ useEffect(() => {
+ async function getAndSetLessonPlanInfo() {
+ try {
+ const urlResult = await getUrl({ key: lessonID });
+ const metadataResult = await getLessonPlanByID(lessonID);
+ if (urlResult?.url?.href) {
+ setPDFLink(urlResult.url.href);
+ setLessonMetadata(metadataResult);
+ } else {
+ console.error("URL not found for the lesson plan.");
+ }
+
+ } catch (error) {
+ console.error(error)
+ }
+ }
+
+ getAndSetLessonPlanInfo();
+ }, [lessonID]);
+
+ const renderLessonInfo = () => {
+ try {
+ if (pdfLink && lessonMetadata) {
+ return (
+
+
+
{lessonMetadata.lesson_title}
+
+
+
+
+
+
+
+
About this Lesson Plan
+
Lesson Plan Title: {lessonMetadata.lesson_title}
+
Grade Level:
+ {
+ lessonMetadata.grade_level_upper === lessonMetadata.grade_level_lower
+ ? `Grade ${lessonMetadata.grade_level_upper}`
+ : `Grade ${lessonMetadata.grade_level_upper} - Grade ${lessonMetadata.grade_level_lower}`
+ }
+
+
Uploaded on: {new Date(lessonMetadata.createdAt).toLocaleDateString()}
+
+
Text Information
+
Text Title: {lessonMetadata.text_title}
+
Author: {lessonMetadata.text_author}
+
Publication Year: {lessonMetadata.text_publication_year}
+
+
Lesson Plan Tags
+
Math Concept: {lessonMetadata.math_concept_tags.join(", ")}
+
Social Justice: {lessonMetadata.social_concept_tags.join(", ")}
+
Math Content Standards: {lessonMetadata.standard_tags.join(", ")}
+
Download Lesson Plan
+
+
+
+
+ )
+ } else {
+ return
Retrieving lesson plan information ...
+ }
+ } catch (error) {
+ console.log(error);
+ renderLessonInfo();
+ }
+ }
+
+ return (
+
+ {renderLessonInfo()}
+
+ )
+}
+
+export default LessonPage;
\ No newline at end of file
diff --git a/src/pages/SearchPage/SearchPage.css b/src/pages/SearchPage/SearchPage.css
index 3d128e2..fbef937 100644
--- a/src/pages/SearchPage/SearchPage.css
+++ b/src/pages/SearchPage/SearchPage.css
@@ -8,4 +8,9 @@
padding: 0 40px 0 40px;
max-height: 600px;
overflow-y: scroll;
+ padding-left: 5%;
+ padding-right: 5%;
+}
+.search-results-container:hover {
+ cursor: pointer;
}
\ No newline at end of file
diff --git a/src/pages/SearchPage/SearchPage.js b/src/pages/SearchPage/SearchPage.js
index aadac3d..6a8b168 100644
--- a/src/pages/SearchPage/SearchPage.js
+++ b/src/pages/SearchPage/SearchPage.js
@@ -1,4 +1,3 @@
-import Header from "../../components/Header/Header";
import SearchBar from "../../components/SearchBar/SearchBar";
import { listLessonPlans } from "../../util/dynamo";
import { useState, useEffect } from "react";
@@ -22,7 +21,6 @@ const SearchPage = () => {
return (
-
{lessonPlans.map(lessonPlan => {
diff --git a/src/pages/SearchPage/SearchPage2.js b/src/pages/SearchPage/SearchPage2.js
new file mode 100644
index 0000000..50e7d64
--- /dev/null
+++ b/src/pages/SearchPage/SearchPage2.js
@@ -0,0 +1,109 @@
+import React, { useState, useEffect } from 'react';
+import { Table, Tag } from 'antd';
+import SearchBar from "../../components/SearchBar/SearchBar";
+import { listLessonPlans } from "../../util/dynamo";
+import { LessonPlanApprovalStates } from "../../util/constants";
+import "./SearchPage.css";
+
+const SearchPage = () => {
+ const [lessonPlans, setLessonPlans] = useState([]);
+ const [searchQuery, setSearchQuery] = useState("");
+
+ useEffect(() => {
+ async function getAndSetLessonPlans() {
+ const lessonPlans = await listLessonPlans();
+ const activeLessonPlans = lessonPlans.filter(
+ lessonPlan => lessonPlan.approval_state === LessonPlanApprovalStates.APPROVED
+ );
+ setLessonPlans(activeLessonPlans);
+ }
+
+ getAndSetLessonPlans();
+ }, []);
+
+ const columns = [
+ {
+ title: 'Title',
+ dataIndex: 'lesson_title',
+ key: 'lesson_title',
+ render: (text, record) =>
{text} ,
+ },
+ {
+ title: 'Grade',
+ key: 'grade_level',
+ render: (_, record) => {
+ let gradeLower = record.grade_level_lower === 0 ? "K" : record.grade_level_lower;
+ let gradeUpper = record.grade_level_upper === 0 ? "K" : record.grade_level_upper;
+ return gradeLower === gradeUpper ? `${gradeLower}` : `${gradeLower} - ${gradeUpper}`;
+ },
+ sorter: (a, b) => a.grade_level_lower - b.grade_level_lower, // Sort by grade_level_lower
+ sortDirections: ['ascend', 'descend'],
+ },
+ {
+ title: 'Math Concepts',
+ dataIndex: 'math_concept_tags',
+ key: 'math_concept_tags',
+ render: (tags) => (
+ <>
+ {tags && tags.map((tag) => (
+
setSearchQuery(tag)}>
+ {tag.toUpperCase()}
+
+ ))}
+
+ ),
+ },
+ {
+ title: 'Social Concepts',
+ dataIndex: 'social_concept_tags',
+ key: 'social_concept_tags',
+ render: (tags) => (
+ <>
+ {tags && tags.map((tag) => (
+
setSearchQuery(tag)}>
+ {tag.toUpperCase()}
+
+ ))}
+
+ ),
+ },
+ {
+ title: 'Standards',
+ dataIndex: 'standard_tags',
+ key: 'standard_tags',
+ render: (tags) => (
+ <>
+ {tags && tags.map((tag) => (
+
setSearchQuery(tag)}>
+ {tag}
+
+ ))}
+
+ ),
+ },
+ {
+ title: 'View',
+ key: 'action',
+ render: (record) =>
View more ,
+ },
+ ];
+
+ return (
+
+
+
record.id}
+ className="search-results-container"
+ onChange={(pagination, filters, sorter) => console.log('Table params:', pagination, filters, sorter)}
+ />
+
+ );
+};
+
+export default SearchPage;
diff --git a/src/pages/UploadPage/UploadPage.css b/src/pages/UploadPage/UploadPage.css
index 4a1683f..43b438b 100644
--- a/src/pages/UploadPage/UploadPage.css
+++ b/src/pages/UploadPage/UploadPage.css
@@ -1,138 +1,258 @@
-.upload-form {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: flex-start;
- width: 100%;
+.page-container {
+ background: var(--color-primary);
+ color: var(--color-secondary);
}
-.upload-form h2 {
- font-size: 22px;
- font-weight: 500;
+.upload-form {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: flex-start;
+ width: 100%;
}
-.input-section-container {
- display: flex;
- flex-direction: column;
- justify-content: flex-start;
- align-items: flex-start;
- width: 30%;
+.upload-form h2 {
+ font-size: 22px;
+ font-weight: 500;
}
.input-container {
- width: 100%;
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 12px;
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
}
.full-tag-input-container {
- width: 100%;
- display: flex;
- flex-direction: column;
- justify-content: flex-start;
- align-items: center;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ align-items: center;
}
.mid-tag-input-container {
- width: 100%;
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- align-items: center;
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
}
.input-container input {
- width: 200px;
- padding: 5px 8px 5px 12px;
- border: 1.25px solid lightgray;
- border-radius: 8px;
+ width: 100%;
+ padding: 5px 8px 5px 12px;
+ border: 1.25px solid lightgray;
+ border-radius: 8px;
+ height: 2.3rem;
}
+
.input-container select option {
- width: 200px;
- padding: 5px 8px 5px 12px;
- border: 1.25px solid lightgray;
- border-radius: 8px;
+ width: 100px;
+ height: 2.3rem;
+ padding: 5px 8px 5px 12px;
+ border: 1.25px solid lightgray;
+ border-radius: 8px;
}
+
#grade_level_upper option {
- width: 200px;
- padding: 5px 8px 5px 12px;
- border: 1.25px solid lightgray;
- border-radius: 8px;
+ width: 200px;
+ padding: 5px 8px 5px 12px;
+ border: 1.25px solid lightgray;
+ border-radius: 8px;
}
.tag-input-container input {
- padding: 5px 8px 5px 12px;
- border: 1.25px solid lightgray;
- border-radius: 8px 0px 0px 8px;
+ padding: 5px 8px 5px 12px;
+ border: 1.25px solid lightgray;
+ border-radius: 8px 8px 8px 8px;
+ width: 300px;
+ height: 300px;
}
.tag-input-container button {
- padding: 5px 8px 5px 8px;
- border: 1.25px solid lightgray;
- border-radius: 0px 8px 8px 0px;
- cursor: pointer;
- background-color: #9ab6b9;
+ padding: 5px 8px 5px 8px;
+ border: 1.25px solid lightgray;
+ border-radius: 0px 8px 8px 0px;
+ cursor: pointer;
+ background-color: #9ab6b9;
}
.tag-input-container button:hover {
- background-color: #728b8e;
+ background-color: #728b8e;
}
#file-input {
- padding: 0;
- border: 0;
- border-radius: 0;
+ padding: 0;
+ border: 0;
+ border-radius: 0;
}
.required {
- color: red;
- margin-left: 4px;
+ color: red;
+ margin-left: 4px;
}
.tag-progress-container {
- width: 100%;
- margin: 0;
- padding: 0;
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: flex-start;
- flex-wrap: wrap;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: flex-start;
+ flex-wrap: wrap;
}
.lesson-tag {
- padding: 12px;
- margin: 0px 4px 4px 0px;
- border-radius: 12px;
- border: 1.25px solid #728b8e;
+ padding: 6px 8px 6px 8px;
+ margin-inline: 6px;
+ border-radius: 12px;
+ border: 1.25px solid var(--color-tertiary);
+ background: var(--color-accent);
+ color: var(--color-primary);
}
.upload-submit-button {
- margin-top: 18px;
- margin-bottom: 36px;
- font-size: 16px;
- padding: 12px;
- border: 1.25px solid lightgray;
- border-radius: 12px;
- cursor: pointer;
- background-color: #9ab6b9;
+ margin-top: 18px;
+ margin-bottom: 36px;
+ font-size: 16px;
+ padding: 12px;
+ border-radius: 12px;
+ cursor: pointer;
+ background-color: var(--color-accent);
+ width: 100%;
+ border: none;
+ box-shadow: -3px 0px 6px rgba(0, 0, 0, 0.3);
}
.upload-submit-button:hover {
- background-color: #728b8e;
+ background-color: var(--color-buttonhover);
}
.upload-state {
- margin-top: 18px;
+ margin-top: 18px;
}
.success {
- color: green;
+ color: green;
}
.failure {
- color: red;
-}
\ No newline at end of file
+ color: red;
+}
+
+.wrapper {
+ margin-inline: auto;
+ max-width: 1100px;
+}
+
+.wrapper--narrow {
+ max-width: 600px;
+}
+
+.form-grid {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ column-gap: 1rem;
+ margin-top: 24px;
+ height: 800px;
+}
+
+.form-title {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-evenly;
+ text-align: right;
+}
+
+.form-title h3 {
+ margin-top: 0;
+ font-weight: normal;
+ text-align: left;
+}
+
+.form-input {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-evenly;
+ grid-column: span 2;
+}
+
+.form-input input {
+ height: 2.3rem;
+ width: 100%;
+}
+.form-input input::placeholder {
+ color: var(--color-tertiary);
+ opacity: 0.5;
+ font: var(--ff);
+}
+
+input[type="file"] {
+ display: none;
+}
+
+.custom-file-input {
+ border: 1px solid #ccc;
+ background-color: var(--color-accent);
+ color: black;
+ border-radius: 12px;
+ display: inline-block;
+ padding: 6px 12px;
+ cursor: pointer;
+ text-align: center;
+}
+
+#form-upload {
+ grid-column: 2;
+}
+
+#title {
+ font-size: 1rem;
+ font-weight: 500;
+ margin-bottom: 3rem;
+}
+
+.select-row {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-evenly;
+}
+
+.select-row select {
+ width: 300px;
+ padding: 5px 8px 5px 12px;
+ border: 1.25px solid lightgray;
+ border-radius: 8px 8px 8px 8px;
+ height: 2.3rem;
+}
+
+.label {
+ width: 0.25rem;
+}
+
+.tag-input {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ grid-column: span 2;
+}
+
+.tag-input input {
+ height: 2.3rem;
+ width: 600px;
+ margin-right: 2rem;
+}
+
+.tag-input button {
+ border-radius: 8px 8px 8px 8px;
+}
+
+.file-upload {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+}
diff --git a/src/pages/UploadPage/UploadPage.js b/src/pages/UploadPage/UploadPage.js
index 7f4bb1d..8ab30d3 100644
--- a/src/pages/UploadPage/UploadPage.js
+++ b/src/pages/UploadPage/UploadPage.js
@@ -2,7 +2,6 @@ import { useState } from "react";
import { uploadData } from "aws-amplify/storage";
import { addLessonPlan } from "../../util/dynamo";
import { LessonPlanApprovalStates } from "../../util/constants";
-import Header from "../../components/Header/Header";
import "./UploadPage.css";
const MATH_TAG = "math-tag";
@@ -15,251 +14,348 @@ const UPLOAD_SUCCESS = "success";
const UPLOAD_FAILURE = "failure";
const UploadPage = () => {
- const [file, setFile] = useState(null);
- const [metadata, setMetadata] = useState({});
- const [mathTags, setMathTags] = useState([]);
- const [standardTags, setStandardTags] = useState([]);
- const [socialTags, setSocialTags] = useState([]);
- const [uploadState, setUploadState] = useState(UPLOAD_BEFORE);
+ const [file, setFile] = useState(null);
+ const [metadata, setMetadata] = useState({});
+ const [mathTags, setMathTags] = useState([]);
+ const [standardTags, setStandardTags] = useState([]);
+ const [socialTags, setSocialTags] = useState([]);
+ const [uploadState, setUploadState] = useState(UPLOAD_BEFORE);
- const handleFileChange = (event) => {
- setFile(event?.target?.files[0]);
- setUploadState(UPLOAD_BEFORE);
-}
+ const handleFileChange = (event) => {
+ setFile(event?.target?.files[0]);
+ setUploadState(UPLOAD_BEFORE);
+ };
- const handleGenericChange = (event) => {
- metadata[event.target.name] = event.target.value;
- setMetadata(metadata);
- setUploadState(UPLOAD_BEFORE);
- }
+ const handleGenericChange = (event) => {
+ metadata[event.target.name] = event.target.value;
+ setMetadata(metadata);
+ setUploadState(UPLOAD_BEFORE);
+ };
- const handleTagSetChange = (event) => {
- const tagType = event.target.name;
- let tagInput = document.getElementById(tagType);
- if(tagInput.value.length < 1) {
- return;
- }
+ const handleTagSetChange = (event) => {
+ const tagType = event.target.name;
+ let tagInput = document.getElementById(tagType);
+ if (tagInput.value.length < 1) {
+ return;
+ }
- let oldTags = null;
- setUploadState(UPLOAD_BEFORE);
- switch (tagType) {
- case MATH_TAG:
- oldTags = [...mathTags]
- oldTags.push(tagInput.value);
- setMathTags(oldTags);
- tagInput.value = null;
- break;
- case STANDARD_TAG:
- oldTags = [...standardTags]
- oldTags.push(tagInput.value);
- setStandardTags(oldTags);
- tagInput.value = null;
- break;
- case SOCIAL_TAG:
- oldTags = [...socialTags]
- oldTags.push(tagInput.value);
- setSocialTags(oldTags);
- tagInput.value = null;
- break;
- default:
- throw new Error("Unknown tag type: ", tagType);
- }
+ let oldTags = null;
+ setUploadState(UPLOAD_BEFORE);
+ switch (tagType) {
+ case MATH_TAG:
+ oldTags = [...mathTags];
+ oldTags.push(tagInput.value);
+ setMathTags(oldTags);
+ tagInput.value = null;
+ break;
+ case STANDARD_TAG:
+ oldTags = [...standardTags];
+ oldTags.push(tagInput.value);
+ setStandardTags(oldTags);
+ tagInput.value = null;
+ break;
+ case SOCIAL_TAG:
+ oldTags = [...socialTags];
+ oldTags.push(tagInput.value);
+ setSocialTags(oldTags);
+ tagInput.value = null;
+ break;
+ default:
+ throw new Error("Unknown tag type: ", tagType);
}
+ };
- const resetInputFields = () => {
- // Reset high-level inputs
- document.getElementById("lesson_title").value = null;
- document.getElementById("file-input").value = null;
+ const resetInputFields = () => {
+ // Reset high-level inputs
+ document.getElementById("lesson_title").value = null;
+ document.getElementById("file-input").value = null;
- // Reset grade level inputs
- document.getElementById("grade_level_lower").value = null;
- document.getElementById("grade_level_upper").value = null;
+ // Reset grade level inputs
+ document.getElementById("grade_level_lower").value = null;
+ document.getElementById("grade_level_upper").value = null;
- // Reset text inputs
- document.getElementById("text_title").value = null;
- document.getElementById("text_author").value = null;
- document.getElementById("text_publication_year").value = null;
+ // Reset text inputs
+ document.getElementById("text_title").value = null;
+ document.getElementById("text_author").value = null;
+ document.getElementById("text_publication_year").value = null;
- // Reset tag inputs
- setMathTags([]);
- setSocialTags([]);
- setStandardTags([]);
+ // Reset tag inputs
+ setMathTags([]);
+ setSocialTags([]);
+ setStandardTags([]);
+ };
+
+ const handleUpload = async () => {
+ if (!file) {
+ console.warn("No file loaded.");
}
- const handleUpload = async () => {
- if (!file) {
- console.warn("No file loaded.");
- }
+ const lessonPlanID = crypto.randomUUID();
+ setUploadState(UPLOAD_DURING);
+ try {
+ await uploadData({
+ key: lessonPlanID,
+ data: file,
+ }).result;
- const lessonPlanID = crypto.randomUUID();
- setUploadState(UPLOAD_DURING)
- try {
- await uploadData({
- key: lessonPlanID,
- data: file
- }).result
-
- try {
- const lessonPlanPayload = {
- id: lessonPlanID,
- approval_state: LessonPlanApprovalStates.PENDING,
- math_concept_tags: mathTags,
- social_concept_tags: socialTags,
- standard_tags: standardTags,
- ...metadata
- }
- await addLessonPlan(lessonPlanPayload);
+ try {
+ const lessonPlanPayload = {
+ id: lessonPlanID,
+ approval_state: LessonPlanApprovalStates.PENDING,
+ math_concept_tags: mathTags,
+ social_concept_tags: socialTags,
+ standard_tags: standardTags,
+ ...metadata,
+ };
+ await addLessonPlan(lessonPlanPayload);
- setUploadState(UPLOAD_SUCCESS)
- resetInputFields();
- setTimeout(() => {
- setUploadState(UPLOAD_BEFORE)
- }, 5000);
- } catch(error) {
- console.error("Lesson plan metadata upload failed!");
- console.error(error);
- setUploadState(UPLOAD_FAILURE);
- }
+ setUploadState(UPLOAD_SUCCESS);
+ resetInputFields();
+ setTimeout(() => {
+ setUploadState(UPLOAD_BEFORE);
+ }, 5000);
+ } catch (error) {
+ console.error("Lesson plan metadata upload failed!");
+ console.error(error);
+ setUploadState(UPLOAD_FAILURE);
+ }
+ } catch (error) {
+ console.error("File upload failed!");
+ console.error(error);
+ setUploadState(UPLOAD_FAILURE);
+ }
+ };
- } catch (error) {
- console.error("File upload failed!");
- console.error(error)
- setUploadState(UPLOAD_FAILURE);
- }
+ const renderUpload = () => {
+ switch (uploadState) {
+ case UPLOAD_BEFORE:
+ return (
+
+ Upload
+
+ );
+ case UPLOAD_DURING:
+ return Uploading lesson plan ...
;
+ case UPLOAD_SUCCESS:
+ return (
+ Lesson plan uploaded!
+ );
+ case UPLOAD_FAILURE:
+ return (
+
+ Upload failed, please make sure all required fields are filled out
+ and try again.
+
+ );
+ default:
+ throw new Error("Unknown upload state: ", uploadState);
}
+ };
- const renderUpload = () => {
- switch (uploadState) {
- case UPLOAD_BEFORE:
- return Upload ;
- case UPLOAD_DURING:
- return Uploading lesson plan ...
;
- case UPLOAD_SUCCESS:
- return Lesson plan uploaded!
;
- case UPLOAD_FAILURE:
- return Upload failed, please make sure all required fields are filled out and try again.
- default:
- throw new Error("Unknown upload state: ", uploadState);
+ return (
+
+ {/* page-container */}
+
+
+
+
Upload a Lesson Plan
+
+
+
+
+
+
+ Lesson Title*
+
+
+ Grade Level Bounds*
+
+
+ Upload File*
+
+
+
+
+
+
+
+ From*
+
+
+ K
+ 1
+ 2
+ 3
+ 4
+ 5
+
+
+ to*
+
+
+ K
+ 1
+ 2
+ 3
+ 4
+ 5
+
+
+
+ Upload a file
+
+
- }
- }
-
- return (
-
-
-
-
Lesson Plan Upload
-
-
-
Lesson Plan
-
- Lesson Title*
-
-
- Lesson Plan PDF*
-
-
+
+
+ Text Title*
+
+
+ Text Author*
+
+ Publication Year
+
+
-
-
Grade Level Range
-
- Grade Level Lower Bound*
-
- K
- 1
- 2
- 3
- 4
- 5
-
-
-
- Grade Level Upper Bound*
-
- K
- 1
- 2
- 3
- 4
- 5
-
-
+
+
+ Math Concept Tags*
+
+
+ Social Concept Tags*
+
+ Math Content Standard Tags
+
+
+
+
-
-
-
Text Information
-
- Text Title*
-
-
- Text Author*
-
-
- Text Publication Year
-
+
+
+ {mathTags.map((tag) => {
+ return (
+
+ {tag}
+
+ );
+ })}
+
-
-
Lesson Plan Tags
-
-
-
Math Concept Tags*
-
- Add Tag
-
-
-
-
- {mathTags.map(tag => {
- return
{tag}
- })}
-
-
+
+
-
-
-
Social Concept Tags*
-
- Add Tag
-
-
-
-
- {socialTags.map(tag => {
- return
{tag}
- })}
-
-
+
+ {socialTags.map((tag) => {
+ return (
+
+ {tag}
+
+ );
+ })}
+
+
-
-
-
Math Content Standard Tags
-
- Add Tag
-
-
-
-
- {standardTags.map(tag => {
- return
{tag}
- })}
-
-
+
+
-
+
+ {standardTags.map((tag) => {
+ return (
+
+ {tag}
+
+ );
+ })}
- {renderUpload()}
+
-
- )
-}
+
{renderUpload()}
+
+
+
+
+ );
+};
-export default UploadPage;
\ No newline at end of file
+export default UploadPage;
diff --git a/src/util/dynamo.js b/src/util/dynamo.js
index 698fe5e..b6a347c 100644
--- a/src/util/dynamo.js
+++ b/src/util/dynamo.js
@@ -81,44 +81,31 @@ export const listLessonPlans = async () => {
return [];
}
}
+//Temporary search implementation, not scalable
const searchLessonPlansWithContains = async (query) => {
try {
+ let lowercaseQuery = query.toLowerCase();
let containsResult = await apiClient.graphql({
query: listLessonPlanMetadata,
variables: {
filter: {
or: [
- {
- lesson_title: {
- contains: query
- },
- },
- {
- text_title: {
- contains: query
- }
- },
{
text_author: {
contains: query
}
},
- {
- social_concept_tags: {
- contains: query
- }
- },
- {
- math_concept_tags: {
- contains: query
- }
- },
{
standard_tags: {
contains: query
}
},
+ {
+ full_text: {
+ contains: lowercaseQuery
+ }
+ }
]
}
}
@@ -138,90 +125,163 @@ const searchLessonPlansWithContains = async (query) => {
return []
}
}
-
-const searchLessonPlansWithElasticSearch = async (query) => {
+export const searchLessonPlans = async (query) => {
try {
- let elasticSearchResults = await apiClient.graphql({
- query: searchLessonPlanMetadata,
- variables: {
- filter: {
- or: [
- {
- lesson_title: {
- match: {
- lesson_title: query
- }
- },
- },
- {
- text_title: {
- match: {
- text_title: query
- }
- }
- },
- {
- text_author: {
- match: {
- text_author: query
- }
- }
- },
- {
- social_concept_tags: {
- match: {
- social_concept_tags: query
- }
- }
- },
- {
- math_concept_tags: {
- match: {
- math_concept_tags: query
- }
- }
- },
- ]
- }
- }
- });
-
- if (elasticSearchResults.data) {
- elasticSearchResults = elasticSearchResults.data.searchLessonPlanMetadata.items;
- } else {
- console.error(elasticSearchResults.errors);
- elasticSearchResults = [];
- }
-
- return elasticSearchResults;
+ // Get results from only DynamoDB search
+ const results = await searchLessonPlansWithContains(query);
+
+ return results;
} catch (error) {
- console.error(error)
+ console.log(error);
return [];
}
-}
+};
+
+//Code for use with Elastic/OpenSearch
+// const searchLessonPlansWithContains = async (query) => {
+// try {
+// let containsResult = await apiClient.graphql({
+// query: listLessonPlanMetadata,
+// variables: {
+// filter: {
+// or: [
+// {
+// lesson_title: {
+// contains: query
+// },
+// },
+// {
+// text_title: {
+// contains: query
+// }
+// },
+// {
+// text_author: {
+// contains: query
+// }
+// },
+// {
+// social_concept_tags: {
+// contains: query
+// }
+// },
+// {
+// math_concept_tags: {
+// contains: query
+// }
+// },
+// {
+// standard_tags: {
+// contains: query
+// }
+// }
+// ]
+// }
+// }
+// });
-export const searchLessonPlans = async (query) => {
- try {
- // Get results from two sources
- const containsQuery = searchLessonPlansWithContains(query);
- const elasticSearchQuery = searchLessonPlansWithElasticSearch(query);
- const results = await Promise.all([containsQuery, elasticSearchQuery])
- const containsSearchResults = results[0]
- const elasticSearchResults = results[1]
+// if (containsResult.data) {
+// containsResult = containsResult.data.listLessonPlanMetadata.items;
+// } else {
+// console.error(containsResult.errors);
+// containsResult = [];
+// }
+
+// return containsResult;
+// } catch (error) {
+// console.error(error)
+// return []
+// }
+// }
+// const searchLessonPlansWithElasticSearch = async (query) => {
+// try {
+// let elasticSearchResults = await apiClient.graphql({
+// query: searchLessonPlanMetadata,
+// variables: {
+// filter: {
+// or: [
+// {
+// lesson_title: {
+// match: {
+// lesson_title: query
+// }
+// },
+// },
+// {
+// text_title: {
+// match: {
+// text_title: query
+// }
+// }
+// },
+// {
+// text_author: {
+// match: {
+// text_author: query
+// }
+// }
+// },
+// {
+// social_concept_tags: {
+// match: {
+// social_concept_tags: query
+// }
+// }
+// },
+// {
+// math_concept_tags: {
+// match: {
+// math_concept_tags: query
+// }
+// }
+// },
+// ]
+// }
+// }
+// });
+
+// if (elasticSearchResults.data) {
+// elasticSearchResults = elasticSearchResults.data.searchLessonPlanMetadata.items;
+// } else {
+// console.error(elasticSearchResults.errors);
+// elasticSearchResults = [];
+// }
+
+// return elasticSearchResults;
+// } catch (error) {
+// console.error(error)
+// return [];
+// }
+// }
+
+
+
+
+// export const searchLessonPlans = async (query) => {
+// try {
+// Get results from two sources
+// const containsQuery = searchLessonPlansWithContains(query);
+// const elasticSearchQuery = searchLessonPlansWithElasticSearch(query);
+
+// const results = await Promise.all([containsQuery, elasticSearchQuery])
+
+ // const containsSearchResults = results[0]
+ // const elasticSearchResults = results[1]
// Remove duplicate results
- let totalResults = elasticSearchResults;
- const elasticSearchResultIDs = new Set(elasticSearchResults.map(result => result.id))
- containsSearchResults.forEach(result => {
- if (!elasticSearchResultIDs.has(result.id)) {
- totalResults.push(result);
- }
- })
+ // let totalResults = elasticSearchResults;
+ // const elasticSearchResultIDs = new Set(elasticSearchResults.map(result => result.id))
+// containsSearchResults.forEach(result => {
+// if (!elasticSearchResultIDs.has(result.id)) {
+// totalResults.push(result);
+// }
+// })
- return totalResults;
- } catch (error) {
- console.log(error);
- return [];
- }
-}
+// return totalResults;
+
+// } catch (error) {
+// console.log(error);
+// return [];
+// }
+// }