gabo0802 / uf-oneclick Goto Github PK

Could use userData and just use one of those values as that.

Could add new struct to handle this one thing.

See the attached repo to check my progress on a test project/server that implements this functionality:

https://github.com/gabo0802/Go-AngularTest

Possible Future Addition:

Send email with code

In order to avoid possible SQL Injection Attacks

Add error section to deal with other types of errors

Add warning messages to forms to alert users to required conditions.

Future Addition:

Can send email to users when need to pay up subscription (day of, 1 day before, week before)

Graph

If possible, we would like to implement a graph that displays how much a user has spent each month based on the subscriptions that they own.

Tasks

• Find a graphing library to implement this
• Given the data that we have in the database, determine the parameters for the x and y axes for the graph
• Possible ways for us to customize the graph?

Make sure to write unit tests for any new functionality that is implemented into the code.

This issue will be constantly updated to include all of the unit tests we have in the code (and which ones fail/succeed)

Need to create way to manage subscriptions, either Sprint 1 or Sprint 2

The footer is not displaying properly in most screen sizes, this should be fixed:

We will be adding the list of subscriptions that the user is subscribed to, this was our initial plan for how it will work (it will now be a V2 version of this issue because adding an expandable list for a grid is more complicated in angular materials than I thought)





It will now be a list of subscriptions shown as such (this is an example, not the actual data):

To implement the list, we need to do the following:

• We will need to first get the data from the back end (this should already be implemented as I write this)
• We will need to implement functionality for some sort of sorter so we can sort through any list size, preferably the angular materials paginator.
• We will need to put all of the data into a table, preferably the angular materials table.
• For V2, we will need to use a grid list to display the data and images and we will have to find a sorter that is able to show us any list size that we want.

Angular Materials Documentation for these:

Paginator: https://material.angular.io/components/paginator/overview
Table: https://material.angular.io/components/table/overview
Grid List: https://material.angular.io/components/grid-list/api

Unit test Ideas below:

Can select timezone from list of all timezones in profile

The "add subscription" feature will be added in some form where the "manage" section is in the mock-up, so will the "delete subscription"





Presumably, it will have 2 buttons, add and remove:

• Add will prompt a dialog box asking for the data that we've already implemented in the user dashboard so far.
• Remove will prompt a dialog box that has a list of all of the subscriptions the user has and asks them for which ones they will delete.

Here's some angular materials links that will help:

For dialog boxes: https://material.angular.io/components/dialog/overview
For Lists (input select): https://material.angular.io/components/select/overview

Create documentation to get the project setup and running on someone's computer.

This is what it looks like right now:

I recently found an angular materials component that could better fit this utility:
https://material.angular.io/cdk/menu/overview
Visual of how it looks like:

Current is 1 hr

Get JSON data from /api to make login and sign up pages functional

Edit the time zone section of the profile so it becomes a droplist

Use the mat-select component:
https://material.angular.io/components/select/overview

The current subscription report is able to get all of its data through its report typescript file here:





The data is collected correctly, however, it seems to call the function in the api-service-ts file at random i values instead of the ordered values indicated by the for loop, as such, I cannot reliably put the data anywhere accurately without fixing this and I am not sure how.
Here is how this issue is displayed in the output (queries are not attached to the right description):

CORS error when communicating with back end

Current Stats:
"currentUserID": 1 hr
"signupOutput": 1 minute
"outputSubscriptions": 5 minutes (for every subscription)

Left a comment at the top of the visual.scss file that leads to an angular material component we could use for it.

Subscription Report is Done (at least visually) now we need to put data in it

Here it what it looks like:

Usability

Users will be able to click on each entry on the accordion and it will give them output queries on what they ask for. The first one here as an example gives the subscription services sorted from the longest amount of time held to shortest.

We need query examples that we can implement for this pretty much.

Further comments

As a personal note, I also need to move this into its own component

First Draft of Header / Intro Title is Complete

Create a sign up page that allows site visitors to become site members.

Currently responsive for screen sizes above this limit (width wise)

Going to have to work with changing the flex properties of the header, and other small things like that.

Initial sketch:

https://github.com/gabo0802/UF-OneClick/blob/main/Project-Notes/OneClick%20Sketches.pdf

Future idea:

Send email with link, give user time to click on link (maybe 1-2 hours), delete user if not verified in 1-2 hours, don't allow user to login if not verified