fysikteknologsektionen/foton-gallery

Photo gallery application for Foton at the Physics Divison at Chalmers University of Technology.

foton-gallery's Issues

Re-fetch data on form submission

Currently data is only loaded when pages are initially rendered. When editing album/user data, data should be re-fetched on form submission to prevent no longer valid data from being showed. Could be added by adding an additional function parameter to the LoadData callback that triggers a new fetch and integrating it with the form submission functions.

Rate limiter

There is currently no limit to how many subsequent requests can be made. This opens up to brute force attacks against the login endpoint and makes it generally easier to ddos the express server. To fix this a rate limiter should be implemented.

Sign in with Google Workspace

Add sign in with google workspace for specific @ftek.se emails.

Improve error reporting from fetch

Currently the page will appear to load indefinitely when an invalid album is accesed. This should be replaced with a proper error message.

JWT refresh tokens

Implement JWT refresh tokens for authentication for additional security and no login time limit.

Add publisher information to footer

The "informationsansvarig" of the division should be mentioned as publisher somewhere on the page.

Title doesn't update on initial load

The title doesn't update on initial load of the app, which causes it to go out of sync and display the wrong title on subsequent pages.

Improve backend error handling

The backend should be able to differentiate between actual errors and invalid requests/responses. Can be done by adding a new error type and checking the error type in a custom error handler.

Backend for file uploads

Implement a backend to handle file uploads (images) that can handle uploading, renaming and storing these. Also implement hooks for mongoose that deletes image files when the corresponding entries from the db is removed.

Implement react pages

React pages that needs to be implemented:

• Login
• Admin dashboard
  • Album overview/edit
  • User overview/edit
• Gallery view
• Individual album view

Gallery masonry/mosaic layout

Currently css grid is used for image layout. This works well if all images are more or less the same aspect ratios, but falls apart when high and low aspect ratios are mixed and leaves a lot of whitespace. It may be possible to automatically consume with whitespace with css grid and pack the images together. See this article for reference.

Generate test data

Create test/example data and create a script that populates a mongodb database with it.

Image upload order

Currently image uploading is done fully asyncronously which means the order in which images are uploaded is not preserved. This should be changed so that images are uploaded syncronously such that the order can be preserved.

Error boundary for suspense

Currently suspense is used to lazy load modules that a majority of users will never use. Even if it's extremely unlikely that loading these specifically will fail, it's still good practise to add an error boundary above it to prevent the entire app from crashing.

Pagination for gallery view

Implement a pagination for the gallery view. The get albums endpoint already supports a "page" query param; but it's possible this will require another endpoint that gets the total # of albums in order to render a "google"-esque pagination.

Scroll to top on pagination change

The page still doesn't reliably scroll to top when changing between pages using the pagination in the gallery view. Could probably be fixed by setting up promises for image load and then waiting on Promise.all() before scrolling.

Bulk image download

Add an option to download all original images contained in an album.