coding-blocks/certificate-worker

certificate-worker's Issues

Logout the user on 401 status code

Currently, the react fetches the user details from the jwt stored in the user's local storage of the browser. But even if the jwt is expired it reads and considers the user to be logged in and the API requests fail with 401.

ToDos

Frontend

• On boot setTimeout on 60 minutes before jwt expiration to send a refresh token request, if the time is negative send request immediately
• Write an axios request interceptor to logout the user when receiving 401 status code

Backend

• Implement a hook in services/oneauth to refresh the jwt
  • jwt shouldn't have been expired for more than 7 days

No/Wrong instructions on sh into the container on readme.md

Overview

Following the readme.md on setting up the repo for development in my local machine, while sh-ing into the container using $ docker exec -it <container-id> /bin/sh doesn't work. The main cause for this is .env.sample which on yarn start produces an error and the container exits immediately with error code 1. The readme.md needs to be updated with the necessary instructions to build, run and debug the docker container on local environments.

Use puppeteer instead of phantomJS

Currently, the templates are rendered and converted to pdf using handlebars-pdf which internally uses phantomJS. PhantomJS has a lot of issues and is not consistent with how we see template on the browser hence we are moving to use puppeteer.

• Create a folder src/utils/pdf
  • export a function that takes a HTML string and path as an argument and exports a PDF file to that path. You can refer this blog for how it can be implemented
• Update src/index.js
  • Read the template specified in the data
  • Renders the template with the context using data
  • Pass the generated HTML string to the pdf util created above
• run yarn start and in another terminal run node src/test.js
  • Check if the certificates are being generated in the src/certification folder.

Submission Guidelines

• You can start working on this issue by forking and cloning the repository.
• Before submission run the code on your system and check if everything is working normally
• You can create a PR even before you are done with the implementation to gain help from the mentors
• While creating PR make sure to copy all the todos above and mark all those which are done
• Refrain from copying pasting the exact from the internet or other developers. Read the blog and stackoverflow code, understand it, try it out, test and then update the project

Draw

Pagination in Layouts List

Currently while displaying all the layouts in the collection are dumped. Introduce pagination on the backend and implement infinite scroll on the frontend

To start

• Setup MongoDB and Rabbitmq
• Go to https://account.codingblocks.com and create a client with callback url = "http://localhost:8080/oneauth/callback"
• Export following environment variables
  • login: rabbitmq username
  • password: rabbitmq password
  • DB_URL: mongodb connection string
  • CLIENT_ID: oneauth client ID
  • CLIENT_SECRET: oneauth client secret

Todo

Backend:

• In src/services/layouts/handlers.js:GET introduce pagination using offset and limit parameter from query parameters
• Write request validation for these query params in src/services/layouts/schema.js refer this

Frontend

• In frontend/store/actions/layouts.js update loadLayouts() to accept an object as an argument with 2 keys offset and limit with default being 0 and 10.
• In frontend/pages/layouts/index.js implement infinite scroll that'll just dispatch the action with incrementing offset

Use .env

Setup the project to use .env rather than config.json

We'll use the command

docker run -t -d certificate-worker --env-file=.env

to run the container

Fix: Dockerfile

Currently while building the docker image, every time we make a change to the source code it reinstalls all the node dependencies again.

You might find this article helpful while working on it.

Add search feature in layouts screen

Currently, the layouts page displays the api data directly but there is no option to search the layouts

ToDos

Frontend

• Add Text Input on top of layout list in frontend/pages/layouts/index.js with onChange method that fires a search action
• Update loadLayouts action to take another query parameter q with default value being an empty string.
• After receiving search data unload all store data, so that only filtered data is displayed. Add a unloadAll flag in the action and replace the state rather than adding in the reducers based on this flag to avoid jank.

Backend

• In src/services/layouts/handlers.js accept q in query params that searches the given query in layout titles. Also, add the q in schema

Improvement of setup docs in readme.md

In the readme.md file, the setup docs is as follows :

Setup locally

• Firstly download and install rabbitmq-server on your system. See here
• Create .env
• Make sure rabbitmq-server is running (default port 5672)

Start server.

• npm start
• For testing.
• npm test

Which for me are a little vague!

• It is said, to create .env file, but what should be the configuration and should we include anything?
• I tried copying the .env.sample file but it didn't work. While running the server it is giving errors
• Steps to clone the repo and npm i is also not mentioned in the docs.

Errors :

Solution :

• There should be a detailed explaination of methods to setup the enviornment locally

Use src/ as volume instead of copy

styles should probably commonified into a separate styles file ?

certificate-worker/src/templates/cpp.hbs

Line 3 in 9d8d4ca

html, body {

Add option to customize height and width of the certificate

Currently, the certificates generated have the fixed height and width of an A4 size paper. Users should be able to store height and width in pixels beside each layout.

To start

• Setup MongoDB and Rabbitmq
• Go to https://account.codingblocks.com and create a client with callback url = "http://localhost:8080/oneauth/callback"
• Export following environment variables
  • login: rabbitmq username
  • password: rabbitmq password
  • DB_URL: mongodb connection string
  • CLIENT_ID: oneauth client ID
  • CLIENT_SECRET: oneauth client secret

ToDo

Backend

• In file src/services/layouts/schema.js change UPDATE and CREATE schema to accept height and width in the body
• In file src/plugins/worker/handler.js:82 update the pdf document opts to use the height and width from the layout and use the current as default

Frontend

• In file frontend/components/layouts/LayoutEditor.js update the component to incorporate height and width input.
• Also change the ASPECT RATIO of the preview on the right when the user changes height and width.

Incomplete README.

@jatinkatyal13 There must be proper README for this project. there is no information given about this project at all.