[BUG] Handle edge cases for page control

[rohithbalaji123]

Describe the bug The currentPageIdx in PageControl component is not updated when totalPages prop is updated from the parent component. There is a possibility of a totalPages decreasing and if currentPageIdx is greater than the newly passed totalPages prop, it causes unexpected behavior.

To Reproduce This is not in production yet. To effective reproduce this, create the component in HomePage with like following,

<PageControl
   totalPages={this.state.totalPages!}
   onPageChanged={this.onPageChanged}
/>

onPageChanged = () => {
    if (Math.random() > 0.5) {
      this.setState({ totalPages: 10 });
    } else {
      this.setState({ totalPages: 5 });
   }
};

Expected behavior The PageControl should automatically change it's state to currently available last page if total pages count becomes less than the current page index.

Screenshots

Additional context In context with our application, this case could arise when user chooses to delete the only available URL in the last page of UserShortLinksSection.

[Coteh]

Please see #748. A better solution has been proposed by @byliuyang to use cursor-based pagination instead of the current setup which relies on a total number of pages value.