From 4cffd79e8859371fcb6efe1c2d211371fce1b7fd Mon Sep 17 00:00:00 2001 From: Mark Ma Date: Mon, 11 May 2020 12:50:09 -0700 Subject: [PATCH 1/5] connect backend with PageHeader. See issue #32 --- .idea/.gitignore | 2 + .idea/bit-frontend.iml | 8 +++ .idea/codeStyles/Project.xml | 42 +++++++++++++++ .idea/codeStyles/codeStyleConfig.xml | 5 ++ .idea/inspectionProfiles/Project_Default.xml | 6 +++ .idea/misc.xml | 6 +++ .idea/modules.xml | 8 +++ .idea/vcs.xml | 6 +++ src/components/Student/Module/Module.js | 56 +++++++++++++++++++- src/components/shared/high/PageHeader.js | 6 ++- src/services/ExploreService.js | 15 ++++++ 11 files changed, 157 insertions(+), 3 deletions(-) create mode 100644 .idea/.gitignore create mode 100644 .idea/bit-frontend.iml create mode 100644 .idea/codeStyles/Project.xml create mode 100644 .idea/codeStyles/codeStyleConfig.xml create mode 100644 .idea/inspectionProfiles/Project_Default.xml create mode 100644 .idea/misc.xml create mode 100644 .idea/modules.xml create mode 100644 .idea/vcs.xml diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..5c98b42 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,2 @@ +# Default ignored files +/workspace.xml \ No newline at end of file diff --git a/.idea/bit-frontend.iml b/.idea/bit-frontend.iml new file mode 100644 index 0000000..c956989 --- /dev/null +++ b/.idea/bit-frontend.iml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/codeStyles/Project.xml b/.idea/codeStyles/Project.xml new file mode 100644 index 0000000..dafaf21 --- /dev/null +++ b/.idea/codeStyles/Project.xml @@ -0,0 +1,42 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/codeStyles/codeStyleConfig.xml b/.idea/codeStyles/codeStyleConfig.xml new file mode 100644 index 0000000..79ee123 --- /dev/null +++ b/.idea/codeStyles/codeStyleConfig.xml @@ -0,0 +1,5 @@ + + + + \ No newline at end of file diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml new file mode 100644 index 0000000..03d9549 --- /dev/null +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -0,0 +1,6 @@ + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml new file mode 100644 index 0000000..24eb271 --- /dev/null +++ b/.idea/misc.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..dd8b6b0 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..94a25f7 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/src/components/Student/Module/Module.js b/src/components/Student/Module/Module.js index 463d753..8e91b65 100644 --- a/src/components/Student/Module/Module.js +++ b/src/components/Student/Module/Module.js @@ -5,6 +5,10 @@ import ActivityModal from './ActivityModal' import ActivityList from './ActivityList' import ChooseProject from '../Dashboard/ChooseProject' +import PageHeader from '../../shared/high/PageHeader' +import {PartyIcon} from '../../../assets/icons/PageHeaderAssets' +import {fetchModuleData, fetchModuleProgress} from '../../../services/ExploreService' + import Hero from '../../shared/low/Hero' import GoBack from '../../shared/high/GoBack' import ProgressCircle from '../../shared/low/ProgressCircle' @@ -147,8 +151,58 @@ const Module = ({ id, wac_data: [modu1e, moduleProgress] }) => { return progress * 100 } + // MM May 11, 2020 + const [moduleName, setModuleName] = React.useState(null); + const [moduleDescription, setModuleDescription] = React.useState(null); + const [numActivities, setNumActivities] = React.useState(null); + const [numCompletedActivities, setNumCompletedActivities] = React.useState(null); + + React.useEffect(() => { + fetchModuleData(id) + .then(data => { + console.log(data) + const name = data.name; + const description = data.description; + const activities = data.activities + const number = activities.length.toString(); + setModuleName(name); + setModuleDescription(description); + setNumActivities(number) + }) + .catch(e => { + console.log(e); + setModuleName('Beginner Javascript'); + setModuleDescription('Once relegated to the browser as one of the 3 core technologies of the web, JavaScript can now be found almost anywhere you find code.'); + setNumActivities('5') + }); + + fetchModuleProgress(id) + .then(data => { + console.log(data) + const completedActivities = data.completedActivities; + const number = completedActivities.length.toString(); + setNumCompletedActivities(number); + }) + .catch(e => { + console.log(e) + setNumCompletedActivities('1'); + }) + },[]) +// MM May 11, 2020 return ( <> + } + buttonTxt = 'Start' + lastCommitTime = "May 1st, 2020" + authors = {["Daniel Smith", "David Johnson", "Patricia Williams" , "Patrick Brown"]} + /> + } @@ -164,7 +218,7 @@ const Module = ({ id, wac_data: [modu1e, moduleProgress] }) => { size={'4em'} midValue={ calculateProgressPercent('inprogress') + - calculateProgressPercent('completed') || 0 + calculateProgressPercent('completed') || 0 } value={calculateProgressPercent('completed') || 0} /> diff --git a/src/components/shared/high/PageHeader.js b/src/components/shared/high/PageHeader.js index 781ecdf..8cb4e36 100644 --- a/src/components/shared/high/PageHeader.js +++ b/src/components/shared/high/PageHeader.js @@ -39,11 +39,13 @@ import LightningBoltIcon from '../../../assets/icons/PageHeaderAssets' const PageHeaderContainer = styled.div` padding: 2em 2em 2em 2em; - width: 45em; + width: 50em; position: relative; margin-top: 3%; - margin-left: 2% + margin-left: auto; + margin-bottom: 3%; + margin-right: auto; border: solid rgba(255,232,112, 0.8); border-radius: 0.4em; diff --git a/src/services/ExploreService.js b/src/services/ExploreService.js index e7c1914..da922d2 100644 --- a/src/services/ExploreService.js +++ b/src/services/ExploreService.js @@ -1 +1,16 @@ import { backend } from './AxiosInstances' +/* +GET request for getting module progress data + */ +export const fetchModuleProgress = moduleId => { + const endpoint = `modules/${moduleId}/progress` + return backend.get(endpoint); +} + +/* +GET request for getting module data + */ +export const fetchModuleData = moduleId => { + const endpoint = `modules/${moduleId}` + return backend.get(endpoint); +} From 4092df493b8dbe89fef5937e1e4b9dc5680cb915 Mon Sep 17 00:00:00 2001 From: Mark Ma Date: Mon, 11 May 2020 13:02:41 -0700 Subject: [PATCH 2/5] remove .idea folder --- .idea/.gitignore | 2 - .idea/bit-frontend.iml | 8 ---- .idea/codeStyles/Project.xml | 42 -------------------- .idea/codeStyles/codeStyleConfig.xml | 5 --- .idea/inspectionProfiles/Project_Default.xml | 6 --- .idea/misc.xml | 6 --- .idea/modules.xml | 8 ---- .idea/vcs.xml | 6 --- 8 files changed, 83 deletions(-) delete mode 100644 .idea/.gitignore delete mode 100644 .idea/bit-frontend.iml delete mode 100644 .idea/codeStyles/Project.xml delete mode 100644 .idea/codeStyles/codeStyleConfig.xml delete mode 100644 .idea/inspectionProfiles/Project_Default.xml delete mode 100644 .idea/misc.xml delete mode 100644 .idea/modules.xml delete mode 100644 .idea/vcs.xml diff --git a/.idea/.gitignore b/.idea/.gitignore deleted file mode 100644 index 5c98b42..0000000 --- a/.idea/.gitignore +++ /dev/null @@ -1,2 +0,0 @@ -# Default ignored files -/workspace.xml \ No newline at end of file diff --git a/.idea/bit-frontend.iml b/.idea/bit-frontend.iml deleted file mode 100644 index c956989..0000000 --- a/.idea/bit-frontend.iml +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/.idea/codeStyles/Project.xml b/.idea/codeStyles/Project.xml deleted file mode 100644 index dafaf21..0000000 --- a/.idea/codeStyles/Project.xml +++ /dev/null @@ -1,42 +0,0 @@ - - - - - - - - - - - - \ No newline at end of file diff --git a/.idea/codeStyles/codeStyleConfig.xml b/.idea/codeStyles/codeStyleConfig.xml deleted file mode 100644 index 79ee123..0000000 --- a/.idea/codeStyles/codeStyleConfig.xml +++ /dev/null @@ -1,5 +0,0 @@ - - - - \ No newline at end of file diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml deleted file mode 100644 index 03d9549..0000000 --- a/.idea/inspectionProfiles/Project_Default.xml +++ /dev/null @@ -1,6 +0,0 @@ - - - - \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml deleted file mode 100644 index 24eb271..0000000 --- a/.idea/misc.xml +++ /dev/null @@ -1,6 +0,0 @@ - - - - - \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml deleted file mode 100644 index dd8b6b0..0000000 --- a/.idea/modules.xml +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml deleted file mode 100644 index 94a25f7..0000000 --- a/.idea/vcs.xml +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - \ No newline at end of file From 9f4d6b9dafe11c344a4d0983fa7bcb717e8b93b2 Mon Sep 17 00:00:00 2001 From: Mark Ma Date: Thu, 14 May 2020 20:46:16 -0700 Subject: [PATCH 3/5] added SideBar and User components --- src/components/shared/SideBar.js | 25 ++++++++++++++++ src/components/shared/low/User.js | 48 +++++++++++++++++++++++++++++++ 2 files changed, 73 insertions(+) create mode 100644 src/components/shared/SideBar.js create mode 100644 src/components/shared/low/User.js diff --git a/src/components/shared/SideBar.js b/src/components/shared/SideBar.js new file mode 100644 index 0000000..b269634 --- /dev/null +++ b/src/components/shared/SideBar.js @@ -0,0 +1,25 @@ +import React, { Component } from 'react' +import styled from 'styled-components' + +const Container = styled.div` + padding: 2em; + padding-right: 0; + padding-left: 0; + width: 18em; + @media screen and (min-width: 0px) and (max-width: 500px) { + display: none; + } +`; + + +class SideBar extends Component { + render() { + return ( + + {this.props.items.map((item, index) =>
{item}
)} + + ) + } +} + +export default SideBar diff --git a/src/components/shared/low/User.js b/src/components/shared/low/User.js new file mode 100644 index 0000000..0e7cc93 --- /dev/null +++ b/src/components/shared/low/User.js @@ -0,0 +1,48 @@ +import React, {Component} from 'react' +import styled from 'styled-components' + +const Container = styled.div` + padding: 1em; + width: 18em; + @media screen and (min-width: 0px) and (max-width: 500px) { + display: none; + } + + border-radius:0.2em; + + display: flex; + justify-content: center; + align-items: center; +`; + +const Picture = styled.img` + height: 4em; + width: 4em; + margin-right: 2em; + border-radius: 50%; +` + +const UserName = styled.h1` + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; +` + +class User extends Component { + render() { + return ( + + +
+ + {this.props.name} + + {this.props.childComponent} +
+ + ) + } +} + +export default User From 2cb8db1e094d97d1a058a8218019020585d2f7c4 Mon Sep 17 00:00:00 2001 From: Mark Ma Date: Thu, 14 May 2020 20:49:56 -0700 Subject: [PATCH 4/5] Revert "added SideBar and User components" This reverts commit 9f4d6b9dafe11c344a4d0983fa7bcb717e8b93b2. --- src/components/shared/SideBar.js | 25 ---------------- src/components/shared/low/User.js | 48 ------------------------------- 2 files changed, 73 deletions(-) delete mode 100644 src/components/shared/SideBar.js delete mode 100644 src/components/shared/low/User.js diff --git a/src/components/shared/SideBar.js b/src/components/shared/SideBar.js deleted file mode 100644 index b269634..0000000 --- a/src/components/shared/SideBar.js +++ /dev/null @@ -1,25 +0,0 @@ -import React, { Component } from 'react' -import styled from 'styled-components' - -const Container = styled.div` - padding: 2em; - padding-right: 0; - padding-left: 0; - width: 18em; - @media screen and (min-width: 0px) and (max-width: 500px) { - display: none; - } -`; - - -class SideBar extends Component { - render() { - return ( - - {this.props.items.map((item, index) =>
{item}
)} - - ) - } -} - -export default SideBar diff --git a/src/components/shared/low/User.js b/src/components/shared/low/User.js deleted file mode 100644 index 0e7cc93..0000000 --- a/src/components/shared/low/User.js +++ /dev/null @@ -1,48 +0,0 @@ -import React, {Component} from 'react' -import styled from 'styled-components' - -const Container = styled.div` - padding: 1em; - width: 18em; - @media screen and (min-width: 0px) and (max-width: 500px) { - display: none; - } - - border-radius:0.2em; - - display: flex; - justify-content: center; - align-items: center; -`; - -const Picture = styled.img` - height: 4em; - width: 4em; - margin-right: 2em; - border-radius: 50%; -` - -const UserName = styled.h1` - padding-top: 0; - padding-bottom: 0; - margin-top: 0; - margin-bottom: 0; -` - -class User extends Component { - render() { - return ( - - -
- - {this.props.name} - - {this.props.childComponent} -
- - ) - } -} - -export default User From 794668d5c8b72264b97caff6c06d90db4dda3f32 Mon Sep 17 00:00:00 2001 From: Mark Ma Date: Thu, 14 May 2020 20:56:10 -0700 Subject: [PATCH 5/5] Revert "Revert "added SideBar and User components"" This reverts commit 2cb8db1e094d97d1a058a8218019020585d2f7c4. --- src/components/shared/SideBar.js | 25 ++++++++++++++++ src/components/shared/low/User.js | 48 +++++++++++++++++++++++++++++++ 2 files changed, 73 insertions(+) create mode 100644 src/components/shared/SideBar.js create mode 100644 src/components/shared/low/User.js diff --git a/src/components/shared/SideBar.js b/src/components/shared/SideBar.js new file mode 100644 index 0000000..b269634 --- /dev/null +++ b/src/components/shared/SideBar.js @@ -0,0 +1,25 @@ +import React, { Component } from 'react' +import styled from 'styled-components' + +const Container = styled.div` + padding: 2em; + padding-right: 0; + padding-left: 0; + width: 18em; + @media screen and (min-width: 0px) and (max-width: 500px) { + display: none; + } +`; + + +class SideBar extends Component { + render() { + return ( + + {this.props.items.map((item, index) =>
{item}
)} + + ) + } +} + +export default SideBar diff --git a/src/components/shared/low/User.js b/src/components/shared/low/User.js new file mode 100644 index 0000000..0e7cc93 --- /dev/null +++ b/src/components/shared/low/User.js @@ -0,0 +1,48 @@ +import React, {Component} from 'react' +import styled from 'styled-components' + +const Container = styled.div` + padding: 1em; + width: 18em; + @media screen and (min-width: 0px) and (max-width: 500px) { + display: none; + } + + border-radius:0.2em; + + display: flex; + justify-content: center; + align-items: center; +`; + +const Picture = styled.img` + height: 4em; + width: 4em; + margin-right: 2em; + border-radius: 50%; +` + +const UserName = styled.h1` + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; +` + +class User extends Component { + render() { + return ( + + +
+ + {this.props.name} + + {this.props.childComponent} +
+ + ) + } +} + +export default User