Skip to content

Commit

Permalink
Merge branch 'master' into longer-sessions
Browse files Browse the repository at this point in the history
  • Loading branch information
@js0mmer
js0mmer authored Dec 10, 2023
2 parents 3d6b54c + 360c131 commit f434398
Show file tree
Hide file tree
Showing 5 changed files with 69 additions and 77 deletions.
6 changes: 3 additions & 3 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,9 +72,9 @@ git checkout -b [branch name]
```
PUBLIC_API_URL=https://api.peterportal.org/rest/v0/
PUBLIC_API_GRAPHQL_URL=https://api.peterportal.org/graphql/
PORT=5000
PORT=8080
```
Note: the port should also match the one set up on the frontend's proxy to the backend under `site/src/setupProxy.js` By default this is 5000.
Note: the port should also match the one set up on the frontend's proxy to the backend under `site/src/setupProxy.js` By default this is 8080.
8. (Optional) Set up your own MongoDB and Google OAuth to be able to test features that require signing in such as leaving reviews or saving roadmaps to your account. Add additional variables/secrets to the .env file from the previous step.
```
Expand All @@ -90,7 +90,7 @@ ADMIN_EMAILS=["<your email>"]
2. In the first terminal window, enter the client directory with `cd site`. Then run the React development server using `npm start`. Ensure the server is running on port 3000 by default.
3. In the second terminal window, enter the API directory with `cd api`. Then run the Express development server using `npm run dev`. Ensure the server is running on port 5000 by default.
3. In the second terminal window, enter the API directory with `cd api`. Then run the Express development server using `npm run dev`. Ensure the server is running on port 8080 by default.
## Our Mission
🎇 Our mission is to improve the UCI student experience with course planning
Expand Down
2 changes: 1 addition & 1 deletion api/.env.local
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
PRODUCTION_DOMAIN=http://localhost:5000
PRODUCTION_DOMAIN=http://localhost:8080
2 changes: 1 addition & 1 deletion api/bin/www
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ var http = require('http');
* Get port from environment and store in Express.
*/

var port = normalizePort(process.env.PORT || '5000');
var port = normalizePort(process.env.PORT || '8080');
app.set('port', port);

/**
Expand Down
134 changes: 63 additions & 71 deletions site/src/component/PrereqTree/PrereqTree.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import React, { FC } from 'react';
import './PrereqTree.scss';
import { Grid, Popup } from 'semantic-ui-react';
import React, { FC } from "react";
import "./PrereqTree.scss";
import { Grid, Popup } from "semantic-ui-react";

import { PrerequisiteJSONNode, PrerequisiteJSON, CourseGQLData, CourseLookup } from '../../types/types';
import { PrerequisiteJSONNode, PrerequisiteJSON, CourseGQLData, CourseLookup } from "../../types/types";

interface NodeProps {
node: string;
Expand All @@ -13,17 +13,25 @@ interface NodeProps {

const Node: FC<NodeProps> = (props) => {
return (
<div style={{ padding: '1px 0' }} className={`node-container ${props.node}`} key={props.index}>
<div style={{ padding: "1px 0" }} className={`node-container ${props.node}`} key={props.index}>
<Popup
trigger={
<a href={'/course/' + props.label.replace(/\s+/g, '')} role='button' style={{ padding: '0.5rem' }} className={'node ui button'}>
{props.label}
</a>
!props.label.startsWith("AP ") ? (
<a href={"/course/" + props.label.replace(/\s+/g, "")} role="button" style={{ padding: "0.5rem" }} className={`node ui button`}>
{props.label}
</a>
) : (
<button style={{ padding: "0.5rem" }} className={`node ui button`}>{`${props.label}`}</button>
)
}
content={props.content} basic position='top center' wide='very' />
content={props.content}
basic
position="top center"
wide="very"
/>
</div>
);
}
};

interface TreeProps {
prerequisiteNames: CourseLookup;
Expand All @@ -34,94 +42,83 @@ interface TreeProps {

const Tree: FC<TreeProps> = (props) => {
let prerequisite = props.prerequisiteJSON;
let isValueNode = typeof prerequisite === 'string';
let isValueNode = typeof prerequisite === "string";

// if value is a string, render leaf node
if (isValueNode) {
let id = (prerequisite as string).replace(/\s+/g, '');
let id = (prerequisite as string).replace(/\s+/g, "");
let content = prerequisite;
if (props.prerequisiteNames.hasOwnProperty(id)) {
content = props.prerequisiteNames[id].title;
}
return (
<li key={props.index} className={'prerequisite-node'}>
<Node label={prerequisite as string} content={content as string} node={'prerequisite-node'} />
<li key={props.index} className={"prerequisite-node"}>
<Node label={prerequisite as string} content={content as string} node={"prerequisite-node"} />
</li>
)
);
}
// if value is an object, render the rest of the sub tree
else {
return (
<div style={{ margin: 'auto 0' }} className={'prerequisite-node'}>
<div style={{ display: 'inline-flex', flexDirection: 'row', padding: '0.5rem 0' }}>
<span style={{ margin: 'auto' }}>
<div className='prereq-branch'>
{prerequisite.hasOwnProperty('OR') ? 'one of' : 'all of'}
</div>
<div style={{ margin: "auto 0" }} className={"prerequisite-node"}>
<div style={{ display: "inline-flex", flexDirection: "row", padding: "0.5rem 0" }}>
<span style={{ margin: "auto" }}>
<div className="prereq-branch">{prerequisite.hasOwnProperty("OR") ? "one of" : "all of"}</div>
</span>
<div className='prereq-clump'>
<ul className='prereq-list'>
{(prerequisite as PrerequisiteJSON)[Object.keys(prerequisite)[0]].map(
(child, index) => (
<Tree key={`tree-${index}`} prerequisiteNames={props.prerequisiteNames} index={index} prerequisiteJSON={child} />
)
)}
<div className="prereq-clump">
<ul className="prereq-list">
{(prerequisite as PrerequisiteJSON)[Object.keys(prerequisite)[0]].map((child, index) => (
<Tree key={`tree-${index}`} prerequisiteNames={props.prerequisiteNames} index={index} prerequisiteJSON={child} />
))}
</ul>
</div>
</div>
</div>
)
);
}
}
};

interface PrereqProps extends CourseGQLData {
}
interface PrereqProps extends CourseGQLData {}

const PrereqTree: FC<PrereqProps> = (props) => {
let hasPrereqs = props.prerequisite_tree !== '';
let hasPrereqs = props.prerequisite_tree !== "";
let hasDependencies = Object.keys(props.prerequisite_for).length !== 0;

if (props.id === undefined) return <></>;
else if (!hasPrereqs && !hasDependencies)
return (
<div className='missing-tree'>
<p>
No Dependencies or Prerequisites!
</p>
<div className="missing-tree">
<p>No Dependencies or Prerequisites!</p>
</div>
);
return (
<div>
<Grid.Row className='prereq'>
<Grid.Row className="prereq">
<div
style={{
display: 'inline-flex',
flexDirection: 'row',
width: 'fit-content',
justifyContent: 'center',
margin: 'auto'
display: "inline-flex",
flexDirection: "row",
width: "fit-content",
justifyContent: "center",
margin: "auto",
}}
>
{/* Display dependencies */}
{hasDependencies && (
<>
<ul style={{ padding: '0', display: 'flex' }}>
<div className='dependency-list-branch'>
{Object.values(props.prerequisite_for).map(
(dependency, index) => (
<li key={`dependency-node-${index}`} className={'dependency-node'}>
<Node label={dependency.department + ' ' + dependency.number} content={dependency.title} node={'dependency-node'} />
</li>
)
)}
<ul style={{ padding: "0", display: "flex" }}>
<div className="dependency-list-branch">
{Object.values(props.prerequisite_for).map((dependency, index) => (
<li key={`dependency-node-${index}`} className={"dependency-node"}>
<Node label={dependency.department + " " + dependency.number} content={dependency.title} node={"dependency-node"} />
</li>
))}
</div>
</ul>

<div style={{ display: 'inline-flex', flexDirection: 'row', marginLeft: '0.5rem' }}>
<span style={{ margin: 'auto 1rem' }}>
<div className='dependency-needs dependency-branch'>
needs
</div>
<div style={{ display: "inline-flex", flexDirection: "row", marginLeft: "0.5rem" }}>
<span style={{ margin: "auto 1rem" }}>
<div className="dependency-needs dependency-branch">needs</div>
</span>
</div>
</>
Expand All @@ -134,16 +131,12 @@ const PrereqTree: FC<PrereqProps> = (props) => {
</div>} */}

{/* Display the class id */}
<Node label={props.id} content={props.title} node={'course-node'} />
<Node label={props.id} content={props.title} node={"course-node"} />

{/* Spawns the root of the prerequisite tree */}
{hasPrereqs && (
<div style={{ display: 'flex' }}>
<Tree
prerequisiteNames={props.prerequisite_list}
prerequisiteJSON={JSON.parse(props.prerequisite_tree)}
/>

<div style={{ display: "flex" }}>
<Tree prerequisiteNames={props.prerequisite_list} prerequisiteJSON={JSON.parse(props.prerequisite_tree)} />
</div>
)}

Expand All @@ -152,14 +145,13 @@ const PrereqTree: FC<PrereqProps> = (props) => {
No Prerequisites!
</p>
</div>} */}

</div>
{props.prerequisite_text !== '' && (
{props.prerequisite_text !== "" && (
<div
style={{
padding: '1em',
backgroundColor: '#f5f5f5',
marginTop: '2em',
padding: "1em",
backgroundColor: "#f5f5f5",
marginTop: "2em",
}}
>
<p>
Expand All @@ -171,6 +163,6 @@ const PrereqTree: FC<PrereqProps> = (props) => {
</Grid.Row>
</div>
);
}
};

export default PrereqTree;
export default PrereqTree;
2 changes: 1 addition & 1 deletion site/src/setupProxy.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ module.exports = function(app) {
app.use(
'/api',
createProxyMiddleware({
target: 'http://localhost:5000',
target: 'http://localhost:8080',
changeOrigin: true,
})
);
Expand Down

0 comments on commit f434398

Please sign in to comment.