Coder Social home page Coder Social logo

utdnebula / planner Goto Github PK

View Code? Open in Web Editor NEW
37.0 9.0 50.0 116 MB

A tool for the UTD community to plan out their coursework 📚

Home Page: https://planner.utdnebula.com

License: MIT License

CSS 0.98% JavaScript 1.30% TypeScript 77.42% HTML 0.87% Python 19.38% Shell 0.03%
react schedule-generator firebase firestore redux hacktoberfest hacktoberfest2022

planner's People

Contributors

aidigii avatar aishanids avatar akevinge avatar cubetastic33 avatar dedsecknight avatar dependabot[bot] avatar enkyuan avatar ez314 avatar hmrogers241 avatar ishaanthenerd avatar jake3231 avatar jasonappah avatar jcgarzaa avatar kamui-fin avatar lokeshyerneni avatar manasakandala avatar medhaaiyah avatar nowhere-2-go avatar pelps12 avatar peytonbarre avatar rajmeet2001 avatar rennyhoang avatar saidarsht avatar saloniss avatar sarthak22gaur avatar swayam528 avatar tyhil avatar wbne avatar williecubed avatar zzranger avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

planner's Issues

[Feature Request] Allow a user to export a degree plan to file

Overview

Nebula Web is meant to be portable. A user must be able to click a button in the planner and obtain a machine-readable copy of their course plan containing a copy of all the courses they intend on taking.

Proposal

To export a plan, the user must able to download a JSON file with the StudentPlan format by clicking a button in the degree planner UI.

[Feature Request] Support user-sign in to save data

Problem Description

Currently, schedule data is only persisted locally. However, there are use cases where a user may desire to have their data synced to a remote location:

  • Modifying schedule data from another device, whether laptop or mobile
  • Having data backed up in the event of hardware failure
  • Using Comet Planning in Incognito Mode/private browsing mode

Proposed Problem Solution

The following data would be stored in the Comet Planning Cloud Firestore database:

  • Student metadata (including but not limited to current GPA, selected major(s)/minors, and course attempts)
  • Student schedule data (all the schedules belonging to a student)

As this is an ACM Development project, Comet Planning will be using ACM's Auth0 setup to easily implement sign-in.

Alternative Solutions

The other option for synchronizing user data across devices is to focus on using a purely file-based system for saving data, but doesn't have the ease of use as a solution built into the app. As such, file-based save data will be complementary to the primary sign-in method of synchronizing data.

Additional Context

Eventually, some Comet Planning data may be retrieved/shared from ACM's member database, but that is not a goal for this initial auth implementation.

[Feature Request] Connecting the Onboarding to Firebase

Overview

The onboarding flow is a way for students to personalize their college planning experience. As of now, the onboarding stands as an HTML shell without any functionality. The form data needs to be saved onto our nebula web database hosted on Google Cloud Platform.

Proposal

An approach to connect the backend would be to take each question's response and store it in a variable on the firestore database. This would allow for greater freedom when integrating with the algorithm for a personalized degree plan.

Alternatively, each page can be stored as a single variable that can be broken down before integrating responses into the algorithm.

I will give you the freedom to implement a backend solution to this problem. If you have an idea different from those above, feel free to implement it.

Supplementary Information

The information regarding the current state of the firebase can be found here.

[Bug]: Adding past semesters to degree plan

What did you expect to happen?

I expected to be able to add past semesters after creating a new degree plan.

What happened?

Adding a new semester begins with Fall 2021.

Version

Beta 0.1.0

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Internal] Update Contact Information

Overview of Proposed Changes

There are some issues throughout the repo where we reference nebula.acmutd.co, the ACM discord server, and the [email protected] email among other things. Please examine the codebase for all locations where we reference outdated information and update it.

Details

Please update these outdated values among others you may notice:

Implementation

Please prioritize updating documentation files such as README and CONTRIBUTING as soon as possible. Afterwards, update the other files such as the terms webpage.

Handle dragging duplicate courses in degree plans

Problem

Upon the circumstance that course duplicates appear on the sidebar as a result of double majors, user might be confused by seeing these duplicates given they can only take one instance of a particular class.

Solution

Once user drags an instance of a duplicate on a semester board, the other duplicated instance disappears from the sidebar.

Add license to project

Currently, Nebula has no license. This means that all code contributed to the project is All Rights Reserved to the contributors who contributed it, and cannot be redistributed or modified without explicit permission. Though I doubt anyone in ACM would hold the project hostage, having a proper license will prevent any external contributors from doing so. See more information here: https://choosealicense.com/no-permission/.

I would recommend using the AGPL v3.0 or later, which allows anyone to redistribute and modify Nebula, but requires that anyone who does so provide a license and copyright notice, disclose their modified source, and also license the derived work under the AGPL. The AGPL also considers network use to be redistribution, which would prevent anyone from taking code from Nebula and using it to providing a service which is not open source.

If requiring derived works to license under AGPL is too restrictive, the MIT License is another good choice. It also allows anyone to redistribute and modify Nebula, and requires a license and copyright notice to be distributed with the derived work. However, it does not restrict the license of the derived work or require the derived work's source to be disclosed.

Additionally, there are many more licenses detailed here, if the AGPL or MIT License do not seem right for the project: https://choosealicense.com/licenses/.

Please also note that re-licensing a project (or choosing an initial one) technically requires explicit permission from all past contributors.

[Internal] Adopt MIT License

Overview

I could have sworn the project was already using the MIT License, but we should adopt a license before going any further. We should adopt it because technically, the project isn't an open source project and is possibly subject to legal disputes, something that a university may want to avoid. GitHub's open source guide contains more info on this.

Are all of the maintainers fine with this? Everyone will need to give their written permission.

Details

The MIT License is very simple to understand and generally absolves us from liability. Additionally, all substantial uses of Planner would have to include a copyright notice.

Using "The Project Nebula Maintainers" gives the group as a whole ownership so that maintenance can be efficiently transferred to new groups of contributors without having to get everyone's permission every time a change to the codebase is made. Existing maintainers would still be attributed for the contributions they made.

The MIT License uses this template:

MIT License

Copyright (c) [year] [copyright holder]

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Creating the Different Bars

Problem Description

This is issue will establish the main UI components of our website. The top bar to navigate, the sidebar where the classes for the degree plan are included, and the semester bar where the user will create their four year will be created

Task List

  • Finish creating the top bar
  • Finish creating the side bar
  • Finish creating the semester bar

[Feature Request] Implement New Plan Dialog

Overview

The New Plan Dialog is a popup window that appears whenever the button to create new degree plan is clicked. The information collected from this dialog will be used to create the plan metadata. The plan metadata should contain general information about the plan (i.e. major, duration), as well as information that will be used by the degree plan generator.

The dialog has already been created and can be found in '/components/planner/NewPlanDialog.tsx'. All that's left is to complete the dialog and integrate it with the rest of the application.

Proposal

Here is some information the dialog should get from the user:

  • Major/minors
  • Degree plan name
  • Plan starting date (defaults to current semester)
  • Plan duration
  • Fast track information
  • Social security number
  • Average course load (this is a general way for users to specify ~how many courses they want to take per semester)
  • Desired graduation date
  • Include summer semesters

Feel free to add to this list. Once the user is done, the data collected should be stored in Redux and the external database.

Supplementary Information

The dialog should somewhat resemble the image below, but it doesn't have to be exactly like it.

New Plan Creation Flowdialog

[Feature Request] Auto-suggest adding lab sections when adding courses to degree plan

Overview

I’ve been using Planner to lay out my real past courses, and I’ve run into an opportunity to improve the speed and usability of doing this. For example, if I add PHYS2325 to a semester, then it would be great if it suggested I add PHYS2125 to the same semester, since they’re required to be taken together. This seems like it could be a fairly easy to way to streamline the process.

Proposal

In order to achieve this, it would be necessary to know corequisite requirements for all courses. Given this, presumably it would be fairly trivial to check to see if a course’s corequisites are present in a semester at the time a course is added to the degree plan. If not, some sort of UI could be shown to ask the user if they want to automatically add the lab/problem section. This could simply be a pop-up, or maybe an inline “template” course as shown in the attached rough sketch.

Supplementary Information

Attached is one idea of how this UI could function.
IMG_0258

feat: Implement onboarding process

Problem Description

Create the page where the user can include their major/minors and course they have already taken.

Proposed Problem Solution

Include Material-UI components and the information on the markups.

Set up routing

Description

Although Comet Planning is a single-page application, routing will make URLs more semantic and allow specific functionality to be separated into different pages. This will allow standard browser "back" functionality to function as intended and aid the user experience.

Tasks

The app will support a few different pages:

  • / - The landing page, provides information about the app when no user is authenticated
  • /schedules - A list of all the currently authenticated user's schedules
  • /schedules/:id - A viewing page displaying schedule information and ability to input grades for attempted courses
  • /schedules/:id/plan - The primary page where schedules are edited
  • /auth - A page to sign in or be referred to a third-party identity provider

README has incorrect instructions for project set-up

What did you expect to happen?

I attempted to set up a local copy of the Planner, and I followed the Set-up instructions in the Readme. I cloned the project, with Node.js and NPM installed (as the only listed requirements) and ran npm start.

What happened?

When I attempted to set up a local copy of the planner to test changes, I followed the instructions in the Readme only to find that the project appears to require Next.js. When I executed npm start, I was presented with errors that suggest Next wasn't installed. Even after installing it, I get the following error when running:

Error: Could not find a production build in the '/Users/.../Nebula/planner/.next' directory. Try building your app with 'next build' before starting the production server.

I'm sure I'm missing some easy setup, but the necessary steps should be in the Readme as well if needed.

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Missing manifest.json

What did you expect to happen?

I expected to see a manifest.json file inside the repository.

What happened?

There is no such manifest.json file.

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Feature Request] Allow a user to import a degree plan from file

Overview

When #47 is implemented, we will have the ability to export degree plans to files, but that's no use if we can't use the machine-readable format. A user must be able to import a course plan and have it replace their currently active plan or create another plan that displays in their plan list.

Proposal

  • Allow a user to select a plan from file
  • Replace the currently active plan in the planner UI
  • Give the option to create a new plan that shows up in a user's degree plan list

Supplementary Information

At some point, we will have to consider how to handle data syncing, namely whether or not to outright replace the currently loaded plan or to use some more sophisticated conflict resolution strategy, like only overriding future semesters based on an imported plan.

@wbne, how do you think we can handle this?

Create a system for displaying notices to the user

Problem Description

Comet Planning will function adequately for a self-service degree planner, but the key value added in creating a whole service around the core functionality is guiding the student and providing recommendations on what courses to take. Additionally, for Comet Planning to have long-term relevance and longevity for a student's academic career, it needs to be a place that a student regularly checks, whether right before registration to determine what's next on the path to the student's degree or right after each semester to reflect.

Proposed Problem Solution

This system should present contextual information to the user on the first screen they see when logged in. This comes in the form of notices featured prominently within the UI supplied by a combination of hard-coded and remotely-fetched admin-specified triggered.

Notice Triggers

Notices for this system will be generated by two categories of actions:

  • User-initiated
  • Automated

For user-initiated actions, we designate flags for certain events that are stored with the user and update the UI accordingly. For example, these flags could include:

  • Taking far greater than the minimum course load for being a full-time student
  • Consistently maxing out course load

For such flags, we can recommend actions to the student to better help them academically, personally, or professionally, like reducing courseload or talking to an academic advisor about academic resources.

Automated actions are largely triggered from pre-determined milestones in a student's academic career, including:

  • Reaching a pre-determined number of completed credit hours (45, 75, 90) for a degree plan audit
  • Being eligible for graduation
  • Fulfilling cousrse requirements for fast-tracking into a graduate program

On page load, the service will use user information to check for milestones and display notices with actionable links to locations and user flows within the app. The triggers for these will initially be hard-coded into the client app, but they will eventually be customizable by service admin, like setting up monitors based on analyzing a student's academic performance and pre-determined long-term goals.

Admin Functionality

Additionally, there should be some service administrator-operated means of informing users about important service updates and for trusted users/campus administrators to put announcements.

For convenience sake, Comet Planning should allow school and service administrators to make announcements about important academic policies or at least include a frictionless way to display links to existing academic resources. On the admin side, there should be some console that allows creation of announcements displayed service wide and for students within specific schools/departments. These announcements may have defined start and optional end date and include a title, description, and optional link with call-to-action text.

Alternative Solutions

Announcements could be bundled into the app's UI instead of being fetched from a remote source, but this would require developer input and wouldn't scale well. Thus, a dedicated component of the admin UI is preferable.

UI for New Schedule Page

Problem Description

Based on the code that was written by Willie, I will use Material-UI and make that page look pretty.

[Feature Request] Course and Prerequisite Visualizer

Overview

Have interactive and graphical way to view a course's grade distributions and prerequisites/post-requisites

Proposal

The current way to view grades and prerequisites is scattered across numerous websites and requires lots of effort just to analyze one course. With the data from UTDGrades and the course catalog, it should be possible to create a seamless experience where users can search up a class and get its grade distribution across semesters and which courses it requires and is required for.

Viewing the course should use as many pictures as possible such as nodes/edges, bar graphs, etc. to be as friendly and interesting as possible for the user.

[Bug]: Remove outline from Select elements

What did you expect to happen?

I expect the select menus to look like the screenshot below.

Screen Shot 2022-02-07 at 3 32 42 PM

What happened?

Screen Shot 2022-02-07 at 3 34 12 PM

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Feature Request] Adding Intro and data collection pages

Overview

The onboarding flow is a way for students to personalize their college planning experience. While most of the onboarding pages are present in the codebase, some of them are yet to be added. Find a way to add the requested pages and animate them to enhance the onboarding flow.

Proposal

Here are the pages that need to be added:

  1. Welcome Screen
  2. Privacy Setting
  3. Disclaimer

You can find the Tailwind CSS code below. Your task is to integrate these into the current onboarding flow (hint: look at how the current onboarding pages are integrated ). Feel free to add animations that enhance the flow of these pages.

Special Note: The disclaimer page currently lacks a disclaimer. Come up with a description to the best of your ability.

Supplementary Information

BeginningPages.zip

Once finished, please commit your changes to the 'feature/new-onboarding' branch

Go Through Tutorials - Aishani

  • Understand the Git Flow Process
  • Complete the React DND tutorials
  • Work on Material UI Tutorials
  • Work on the Full-Stack Development Tutorials - Part 1

[Feature Request] Revamp Landing Page

Overview

Currently, the landing page on Planner looks a bit basic. It was supposed to be temporary and was meant to be replaced with a more animated and eye-popping page. Having a well-designed landing page is important in order to leave a good first impression on the user.

Proposal

Below is a mockup of what the landing page should ideally look like.

Login Flowlanding

Animating the page (i.e. adding a typewriter effect on the text, putting videos in the background) would help the page come to life.

Supplemental Information

https://www.figma.com/file/cycV0bxP6vTJJYUONFoBr0/Planner-Mockups?node-id=26840%3A43579 contains other variations of the page.

Go through the React Tutorials - Medha

  • Understand the Git Flow Process
  • Create documentation about the Git Flow Process
  • Complete the React DND tutorials
  • Work on Material UI Tutorials
  • Work on the Full-Stack Development Tutorials - Part 1
  • Work on the Full-Stack Development Tutorials - Part 2

Collapse PlanRequirements on sidebar when all requirements are met

Problem

The extensive list of plan requirements on the sidebar makes it difficult for users to navigate them.

Proposed Problem Solution

Once user has already met all the requirements for a specific category, that category automatically collapses to make more space for other courses.

[Feature Request] Implement Degree Planner Functionality

Overview

The Degree Planner tool inside Nebula Planner is what students will use to plan out and customize the college experience they want to have. Currently, the Degree Planner has been partially implemented, but some things still need to be done before it is ready to be integrated into the rest of the project.

Proposal

  1. Create the ability to add courses
  2. Develop a method for users to search for UTD courses not part of their degree plan
  3. Allow users to add/remove semesters
  4. Build a new plan creation flow

Supplementary Information

The design of the Degree Planner will aim to follow mockups from the "Nebula Mockups" Figma file.

[Feature Request] Course Generator

Overview

The Course Generator should create an example degree plan schedule using the user's preferences.

Proposal

The Course Generator should be a component that returns a generated degree plan while accommodating for the user's preferences such as minimum and maximum credit hours, AP credits, and summer or winter courses. By using the 2020-catalog.json and future files, the component should be able to generate a list of courses a user should take each semester.

[Feature Request] Allow a user to view past course attempts

Discussed in #46

Originally posted by WillieCubed June 29, 2021
A student must be able to input and view information about the courses they've taken.

This information includes:

  • What course was taken
  • When a course was taken

Is there any information should be included here?

Update existing UI to use Material-UI components

Problem Description

The styling for all of the components are in the same file as the component.

Proposed Problem Solution

Move all of the Material-UI styling into one file for cleaner code.

Create landing/marketing page

Problem Description

At some point, the service will need a landing page for people potentially interested in using Comet Planning that describes its features before someone creates an account. It's also important that this doesn't increase friction for usability; there should be a clear way to navigate straight to the new user experience, access the admin dashboard from this page.

Additionally, the landing should automatically redirect to the app if the user is signed in (a user session is detected), following the functionality of sites like GitHub and Google Drive.

Proposed Problem Solution

The landing page will include the following sections:

  • A hero section that clearly shows the main appeal for the app: the intuitive drag-and-drop UI for planning
  • A section showing a more detailed description for each feature
  • A section showcasing the developers, discussing open-source development, and containing a call-out to ACM Development

This page will serve as the root of the application. All routes with functionality will be moved to an /app-prefixed route:

  • / -> /app
  • /plan/:planId -> /app/plan/:planId

The page must be responsive and have a pleasant viewing experience on mobile devices and desktop.

In the toolbar, there must be two links: a shortcut link to the admin dashboard (currently comet-data-service.web.app) and a link to sign in.

Overall, the landing page will function mostly as a marketing page for Comet Planning with clear links to important service functionality.

Additional Context

The landing page should look follow the designs in this Figma document.

Set up Redux store

Description

The Redux data store is a single source of truth for the Comet Planning app. It contains app state and exposes actions to modify user and (primarily) schedule data.

Tasks

The Redux store needs to contain state for the current courses displayed on the screen but also contain actions to do the following:

  • Add a course to a given semester from a course plan
  • Remove a course from a given semester
  • Move a course between semesters

"ACM Development" should be "Project Nebula Maintainers" in footer

What did you expect to happen?

On the Planner landing page, the footer should not incorrectly reference "ACM Development".

What happened?

The landing page footer currently says, "Built with ❤️ and 💻 by ACM Development".

Version

Beta 0.1.0

What browsers are you seeing the problem on?

Safari

Relevant log output

N/A

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Load correct data after user sign in

What did you expect to happen?

When I sign into Planner with multiple accounts, I expect to see the correct data for each user.

What happened?

When you log in with a different account, the data from the previous account appears.

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug] Fix Add & Remove Semester Buttons

What did you expect to happen?

Screen Shot 2022-02-07 at 3 25 46 PM

What happened?

I expect to see the '+' and the '-' on the buttons as shown in the image below.
Screen Shot 2022-02-07 at 3 26 34 PM

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

chore: Display contextually relevant course information

Problem Description

This aspect will make sure that if you place your cursor around a particular class, it will overlay and make sure that the course description will pop up alongside the pre-req/co-reqs for that class.

Task List

[Task List TBD]

feat: Add ability to import and export user schedules

Problem Description

There currently is no way to get a machine-readable representation of user schedule data.

For the sake of usability and as a first step towards saving data to user accounts, Comet Planning should have the ability to import and export all schedules to a single file. Having this functionality would make testing data operations more robust.

Proposed Problem Solution

Using the data types defined in #3, Comet Planning will be able to export all schedule data to a single JSON file. Functions related to this functionality will be found primarily in the src/lib/transfer.js directory. On the schedule planner page found at /schedules/:id, there will be a button that reduces all data for the currently open schedule from the Redux data store to a JSON file titled schedule_{id}.json where id is the generated unique ID for the schedule.

Alternative Solutions

Eventually, in addition to saving schedule data a user document in the database, we will be able to convert schedules into a variety of forms, perhaps to a PDF or a spreadsheet format.

Additional Context

[Internal] Clean up codebase

Overview of Proposed Changes

Planner, originally known as Comet Planning, was originally created on May 9th, 2020. Since then, it has seen many changes in its scope, features, and active maintainers. Because of this, the codebase has become a bit convoluted and verbose. Thus, reducing the entropy inside this repository will help the current maintainers be more productive and improve the future maintainability of the repository.

Details

  • Remove all unused / redudant components and modules
  • Update dependencies
  • Refactor any verbose logic
  • Simplify state management
  • Update documentation

Anything else that is done will be documented within its own commit('s) and the PR.

Making components draggable

Problem Description

This feature is crucial to our website. It will make sure that we are able to drag particular courses from the sidebar and drop that course in a particular card in the semester bar.

Tasked List

  • Go through the React DND Beautiful tutorials
  • (Other tasks TBD - @aidigii can include)

[Feature Request] Summer Semesters / Custom Semester Names

Overview

Add the option to edit semester names or add other semester types while keeping the default alternating Fall and Spring labels.

Proposal

When users click the "+" button and a new semester appears, the name will follow the default Fall / Spring pattern.
If the name of a semester is changed (Summer / Maymester / Wintermester), the next semester added with "+" will take the name that was edited.

Supplementary Information

[Bug]: Fix Redux Persist Reference Error

What did you expect to happen?

I expect to not see error messages in the console.

What happened?

A reference error appears in the console whenever Planner is run. This seems to be due to Redux Persist not being properly configured with Next.js. Check out '/modules/redux/store.ts' to look at the current configuration. I believe this error is due to the page pre-rendering done by Next.js.

This isn't a pressing issue since data is being persisted across browser sessions.

Version

Beta 0.1.0

What browsers are you seeing the problem on?

No response

Relevant log output

Error storing data ReferenceError: window is not defined
    at /Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.js:81:7
    at /Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.js:37:21
    at new Promise (<anonymous>)
    at createPromise (/Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.js:35:10)
    at Function.setItem (/Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.js:80:12)
    at writeStagedState (/Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/redux-persist/lib/createPersistoid.js:98:28)
    at Timeout.processNextKey [as _onTimeout] (/Users/caleblim/Code/ACM/Nebula/nebula-web/node_modules/redux-persist/lib/createPersistoid.js:87:7)

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Internal] Rewrite routes using Next.js

Overview of Proposed Changes

Nebula Web is currently a single-page application built using React. However, implementing an SPA architecture is not the best way to develop our app. Certain functionality can and should be done with interactive (JavaScript) components, especially drag and drop functionality for schedule planning and notifications for service announcements, but much of the other functionality can be simplified to CRUD operations usually done in a server-side rendered context.

Next.js will let us do just that and maintain the best of both worlds: allowing us to statically generate pages like those for degree plans or course information while also maintaining the same reactivity that React provides as a framework.

Additionally, a refactor will allow us to simultaneously architect our app to expose routes for the service admin console and eliminate the need for a redundant front-end for Nebula Data Service.

Details

The current codebase has a mix of components for both display and data loading purposes. Next.js dictates pages with separate routes are stored in completely different files.

Additionally, the current SPA has a global state that can be updated from multiple pages and components. However, most of that state only affects process that happen on page load, like determining if the user is authenticated or checking degree plan data that isn't likely to change on a regular basis.

Next.js provides some examples on how to write a Next.js app that uses a data store like Redux. On fetch from the server, app state is statically generated, but once loaded by the browser, interactivity takes over and allows a local data store to manage state.

The following will have to be done to complete the refactor:

  • Update dependencies to use Next.js
  • Update project structure and remove react-router components
  • Isolate routes into separate pages:
    • / - Landing
    • /home - Overview
    • /onboarding - New user onboarding
    • /plans - Plan overview page
    • /plans/[id] - Degree planning
    • #40
    • /profile/[userId] - The profile of a given user with user ID [userId]

[Bug]: Dashboard does not scale correctly on displays with less horizontal space

What did you expect to happen?

When switching to a device with less horizontal resolution, the dashboard should reorganize listed degree plans so that cleanly appear on mobile (or any small) displays. One way to approach this could be to set degree plans to switch to a vertical list on mobile, for example.

What happened?

The Planner dashboard currently does not properly scale to displays with a lower width, such as most mobile devices. As the device width decreases, the listed degree plans begin to overlap.

Screen.Recording.2022-02-27.at.1.33.24.PM.mov

Version

Beta 0.1.0

What browsers are you seeing the problem on?

Chrome, Safari

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Feature Request] Support anonymous users

Overview

Not everyone who uses Planner would necessarily want to create an account. To support this, I propose adding an option for users to use Planner as a guest user.

[Feature Request] Display degree plans in PDF format

Problem Description

Comet Planning will allow students an interactive means of planning out their coursework, but it may be useful to have a static representation of a student's academic career for easy reference.

Proposed Problem Solution

Comet Planning will have a way to generate printable PDFs of the following:

  • Planned/transferred/taken courses per semester
  • Student course records (all attempted courses and their grades)

Essentially, Comet Planning will generate transcripts and customized degree plans for students based on the data they provide. There will be a dedicated route on the Comet Planning web app (/schedules/<id>/view) that will allow a student to see a (togglable) static visual representation of a degree plan or transcript-like view of all their attempted courses.

Alternative Solutions

Another format that Comet Planning could explore is a spreadsheet containing the above information. However, implementation of this may largely depend on student feedback and demand. One possible compliment to the generated PDFs is to have the ability to share a schedule through a URL which would work with Comet Planning's existing routing solution; however, this would require implementation of some kind of permissions system - whether marking a schedule as public/private or by some other mechanism - which may not be desirable from a practicality standpoint.

Additional Context

Here is a reference to a viewing screen for a student's degree plan.

[Feature Request] Create user profile page

Overview

The profile page provides options to the user to customize and make Nebula their own. The goal of this page is not to overwhelm the user with options that confuse them but as a way to help them modify the settings they want. Keeping consistency with every sub-page of the Profile would promote a better user experience.

Proposal

The Profile Page would include the following sections:

  • Toggles for analytics
  • Name change option
  • Display options

Supplementary Information

Find the link to the framework here https://www.figma.com/file/L56XKTwX0gml7vqQWdduBz/Profile-Page?node-id=0%3A1

feat: Validate degree plan information

Problem Description

This segment is in charge of making sure if a particular class meets certain pre-reqs and co-req. If it doesn't then it will display a warning message. It will also determine that a particular student is not exceeding taking 18 credit hours per semester.

Task List

  • Determine the components required for each of the functions (aspects are itlized)
  • Pseudocode each of the functions
  • Write the appropriate code accordingly

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.