Merge pull request #44 from oslabs-beta/Hernan/alerts

Hernan/alerts

Author: AhnafKhvn

CHANGE_LOG.md

@@ -17,14 +17,16 @@ Changes:<br>
     - Cleaned up hundreds of lines of outdated code and archived multiple unused and duplicate files
 - User Features:
   - UI updated with a modern style for a better developer experience
-    - Added many user feedback alerts for better experience including alerts for when projects are published, cloned, deleted, context created, or custom component created.
+    - Added many user feedback alerts for better experience including alerts for when projects are published, cloned, deleted, HTML custom tags are created, context created, or custom component created.
+    - Built a specific buttons menu that individually display the HTML elements, reusable components created, and join room option.
+    - Redesigned the state manager panel option to be readable and functional. 
     - Drop down menu now closes only when the user clicks outside of the menu
   - Marketplace:
     - Implemented a dedicated area for developers to share their projects
     - Routing handled by React Router
-    - Projects can also be cloned to the user's account to be used and edited
+    - Projects can also be cloned to the user's account to be used and edited with the addition of a button
     - Added search functionality to search by username and project name
-    - Separate section in the Saved Projects and Delete Projects modal in the Manage Project menu for Downloaded Projects from the Marketplace
+    - Included a separate section in the Saved Projects and Delete Projects modal in the Manage Project menu for cloned projects from the Marketplace
   - Publish/Unpublish Button: 
     - Publish feature on the web app allows users to publish their saved project files into the Marketplace from the main app page
     - Dynamically switches between publish/unpublish depending on whether the loaded project is in the Marketplace
@@ -40,6 +42,7 @@ Recommendations for Future Enhancements:<br>
 - Continue quality Typescript conversion. Continue to fix type errors within component files.
 - Modularize appStateSlice file. Further modularization is needed for readability and maintainability.
 - Solve residual bugs. Undo & Redo buttons on customization page not functioning as expected. Backend bugs persist as seen in the console when running the dev environment. Resolve electron app functionality to coincide with web app functionality.
+- Take a look at the join room functionality using web sockets in order to allow users to collaborate on the same project at the same time.
 - Continue code cleanup. Continue cleanup of outdated and unused code and files
 
 **Version 16.0.0 Changes**

README.md

@@ -66,7 +66,7 @@ If you want to read about using ReacType, the [User Manual](https://reactype-1.h
 - **Improved Testing Coverage**: Testing coverage now sits at XX%.
 - **Typescript Conversion**: Typescript coverage now sits at XX%.
 - **UI Overhaul**: Upgraded the UI of the application with a more modern style and better developer experience
-- **Marketplace Feature**: Implemented a dedicated area for developers to share their projects
+- **Marketplace Feature**: Implemented a dedicated area for developers to share their projects, 
 - **And more:** See [change log](https://github.com/open-source-labs/ReacType/blob/master/CHANGE_LOG.md) for more details on what was changed from the previous versions as well as plans for upcoming features!
 
 ## Changes with version 16.0.0

app/src/components/StateManagement/CreateTab/components/TableParentProps.tsx

@@ -128,7 +128,7 @@ const useStyles = makeStyles({
       color: 'white'
     },
     '& .MuiTablePagination-root': {
-      color: 'rbga(0,0,0,0.54)'
+      color: 'white'
     }
   },
   themeDark: {

app/src/components/StateManagement/DisplayTab/DataTable.tsx

@@ -37,15 +37,15 @@ function DisplayContainer({ data, props }) { // "data" is referring to component
       <Divider orientation="vertical" variant="middle" flexItem />
       <Grid item>
         <Typography
-          style={{ color: 'black' }}
+          style={{ color: 'white' }}
           variant="subtitle2"
           gutterBottom
           align="center"
         >
           Click on a component in the graph to see its state!
         </Typography>
         <Typography
-          style={{ color: 'black' }}
+          style={{ color: 'white' }}
           variant="h6"
           gutterBottom
           align="center"

app/src/components/StateManagement/DisplayTab/DisplayContainer.tsx

@@ -78,7 +78,7 @@ function ProjectsDialog(props: ProjectDialogProps) {
           </ListItem>
         ))}
       </List>
-      <DialogTitle style={{ color: "#000" }} id="project-dialog-title"> MP Projects</DialogTitle>
+      <DialogTitle style={{ color: "#000" }} id="project-dialog-title"> Marketplace Projects</DialogTitle>
       <List style={{ color: "#000" }}>
         {projects.filter((project: any) => project.forked === true).map((project: any, index: number) => (
           <ListItem

app/src/components/right/DeleteProjects.tsx

@@ -69,7 +69,7 @@ function ProjectsDialog(props: ProjectDialogProps) {
 )}
       </List>
       {/* this section handles the projects cloned from the marketplace */}
-      <DialogTitle style={{ color: "#000" }} id="project-dialog-title">MP Projects</DialogTitle>
+      <DialogTitle style={{ color: "#000" }} id="project-dialog-title">Marketplace Projects</DialogTitle>
       <List style={{ color: "#000" }}>
       {projects.filter((project: any) => project.forked === true).map((project: any, index: number) => ( 
     <ListItem

app/src/components/right/OpenProjects.tsx

@@ -26,6 +26,7 @@ body {
   overflow: hidden;
   height: 100vh;
   width: 100vw;
+  background-color:white
 }
 
 h4 {
@@ -692,6 +693,8 @@ NAVBAR
   width: 16%;
 }
 
+
+
 /*
 /////////////////////////////////////////////////
 CANVAS WINDOW