THIS ISSUE WAS AUTOGENERATED BY HATCHWAYS
For this task, you will be modifying existing client code for a blogging website. Currently the website has already implemented:

• Ability to load and display blog posts. For this evaluation, the data is retrieved from a JSON file that is already included.

Please open a single pull request with the following changes:

1. Adding pagination functionality
2. Write a markdown file with answers to questions in Part 2

The expected changes are outlined in detail below.

Part 1 - Adding pagination abilities

Currently, the UI has already exists - please do not change the HTML structure for this part of the task. We would like it to be implemented so that it satisfy the following functionality:

• By default, “15 per page” is selected and you will be on page 1
• When user changes “X per page” (the only options will be 15, 25, 50 and 100), it should only display at maximum that amount of blogs per page and the first page is displayed
• When user clicks on the Previous and Next arrow button, it will display it’s respective page results
• If the first and last page is the same, then previous and next arrow buttons are disabled
• If user at the beginning of the results, the previous button should be disabled
• If user at the end of the results, the next button should be disabled
• Current page always have 2 siblings (refer to screenshots below)
• Ellipses should be inserted if the first page or the last page is not a sibling of the current page
• First and last page must always be displayed
• There will always be at least 1 blog post

Please note that for this evaluation, calculations will be done on the frontend and that we are not looking to imitate an API call.

• Current page is 1, and it has 2 sibling options next to it. Ellipses before the last page.
  
• In the middle of the pagination, with one sibling before and after. Ellipses after page 1 and before the last page.
  
• Second last page, one sibling before and after (the last page is the same page as the next page). Ellipses after page 1.
  
• No ellipses when there is only one page available.
  

Part 2: Written Evaluation

Please provide a markdown file with the answers to the following questions below.

The product team has decided that we want to make improvements to this application.

Questions:

1. Right now the data for the posts is coming from a json file. What changes would you have to make to the application if it came from an API? In what type of hook should you use to fetch the data and why? What other considerations would you have to make?
2. Part of this application uses the package nanoid to generate keys. What issue would this cause for generating keys in React?

Considerations

• Please format your answers so that they are easy to digest, and do not include any code in your pull request related to these questions above. We will be evaluating both the quality of your answer as well as the quality of your written explanation of that answer.
• Please include a file in the root of the repo called improvements-proposal.md that addresses these questions.