Merge branch 'dev' into denton/link

Author: dentonwong

app/src/components/left/HTMLPanel.tsx

@@ -339,7 +339,7 @@ const useStyles = makeStyles({
     border: '1px solid #186BB4'
   },
   lightThemeFontColor: {
-    color: '#155084',
+    color: 'white',
     '& .MuiInputBase-root': {
       color: 'rgba (0, 0, 0, 0.54)'
     }

app/src/components/marketplace/MarketplaceCard.tsx

@@ -18,6 +18,9 @@ import React from 'react';
 import imageSrc from '../../../../resources/marketplace_images/marketplace_image.png';
 import { red } from '@mui/material/colors';
 import axios from 'axios';
+import {useDispatch, useSelector} from 'react-redux'
+import { RootState } from '../../redux/store';
+import { saveProject } from '../../helperFunctions/projectGetSaveDel';
 
 interface Project {
   forked: String,
@@ -36,6 +39,8 @@ const ITEM_HEIGHT = 48;
 const MarketplaceCard = ({proj} :{proj: Project}) => {
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
   const open = Boolean(anchorEl);
+  const state = useSelector((store:RootState) => store.appState);
+  console.log('HEY', state)
   const handleClick = (event: React.MouseEvent<HTMLElement>) => {
     setAnchorEl(event.currentTarget);
   };
@@ -50,7 +55,8 @@ const MarketplaceCard = ({proj} :{proj: Project}) => {
   };
   const handleClose = () => {
     setAnchorEl(null);
-  }
+  };
+
 
   return (
     <>

app/src/components/right/OpenProjects.tsx

@@ -24,6 +24,7 @@ export interface ProjectDialogProps {
 function ProjectsDialog(props: ProjectDialogProps) {
   const classes = useStyles();
   const { onClose, open, projects } = props;
+  console.log(projects)
   const state = useSelector((store:RootState) => store.appState);
   const dispatch = useDispatch();
   // If no projects selected, keep the name of the current displayed
@@ -40,6 +41,14 @@ function ProjectsDialog(props: ProjectDialogProps) {
     dispatch(openProject(selectedProject))
     onClose();
   };
+  // these two filter between user projects and market projects
+  // const userProjects = projects.filter((project: any) => {
+  //   project.forked === undefined
+  // })
+  // const marketProjects = projects.filter((project: any) => {
+  //   project.forked !== undefined
+  // })
+
   return (
     <Dialog
       onClose={handleClose}
@@ -48,20 +57,44 @@ function ProjectsDialog(props: ProjectDialogProps) {
     >
       <DialogTitle style={{ color: "#000" }} id="project-dialog-title">Open Project</DialogTitle>
       <List style={{ color: "#000" }}>
-        {projects.map((project: any, index: number) => (
-          <ListItem
-            button
-            onClick={() => handleListItemClick(project.name)}
-            key={index}
-          >
-            <ListItemAvatar>
-              <Avatar className={classes.avatar}>
-                <FolderOpenIcon />
-              </Avatar>
-            </ListItemAvatar>
-            <ListItemText primary={project.name} />
-          </ListItem>
-        ))}
+      {projects.filter((project: any) => project.forked === undefined).map((project: any, index: number) => {
+  console.log("Logging something inside the map:", project.forked); // Add this line
+  return (
+    <ListItem
+      button
+      onClick={() => handleListItemClick(project.name)}
+      key={index}
+    >
+      <ListItemAvatar>
+        <Avatar className={classes.avatar}>
+          <FolderOpenIcon />
+        </Avatar>
+      </ListItemAvatar>
+      <ListItemText primary={project.name} />
+    </ListItem>
+  );
+})}
+      </List>
+      {/* this section handles the projects cloned from the marketplace */}
+      <DialogTitle style={{ color: "#000" }} id="project-dialog-title">MP Projects</DialogTitle>
+      <List style={{ color: "#000" }}>
+      {projects.filter((project: any) => project.forked !== undefined).map((project: any, index: number) => {
+  console.log("Logging something inside the second map:", project.forked); // Add this line
+  return (
+    <ListItem
+      button
+      onClick={() => handleListItemClick(project.name)}
+      key={index}
+    >
+      <ListItemAvatar>
+        <Avatar className={classes.avatar}>
+          <FolderOpenIcon />
+        </Avatar>
+      </ListItemAvatar>
+      <ListItemText primary={project.name} />
+    </ListItem>
+  );
+})}
       </List>
     </Dialog>
   );

server/models/reactypeModels.ts

@@ -78,8 +78,8 @@ const sessionSchema = new Schema({
 
 const projectSchema = new Schema(
   {
-    name: String,
-    forked: String,
+    name: {type: String, required: true},
+    forked: {type: String},
     likes: { type: Number, default: 0 },
     published: { type: Boolean, default: false },
     project: { type: Object, required: true },