2100 widget info

[logical-1985516]

Fixes #2100

Proposed commit message

The ramp widget UI is currently quite empty and more information can be 
added to be more useful.

Let's add date range and footer to the ramp widget so that it is easier 
for people to view the timelime of the commits and the RepoSense 
website.

Other information

This is how the new UI looks:

[logical-1985516]

How should I go about writing test cases for the widget?

Edit 1: I have noted that the test cases in optimiseTimeLine only pass if the date indicators are not rendered when the trim timeline is unchecked, should I rename the file and add test cases in the same file too?

Edit 2: Should the date indicators still be displayed if there are no commits? Currently, trim timeline does not show the date indicators if there are no commits found.

Edit 3: Some frontend test cases that pass on CI are failing locally - how do I fix this? Furthermore, it takes about 40 minutes to finish running the test cases. One example is:

  1) include merge commits in chart view
       show merge commits in summary chart:
     AssertionError: Timed out retrying after 30000ms: Expected to find element: `[title="[2023-03-03] Merge branch 'new-branch' into cypress: +0 -0 lines "]`, but never found it.     
      at Context.eval (webpack:///./tests/chartView/chartView_mergeCommits.cy.js:5:7)

[logical-1985516]

Hi @ckcherry23, does this new UI look good to you? Is there any other useful information that could be added to the widget?

[ckcherry23]

Should the date indicators still be displayed if there are no commits? Currently, trim timeline does not show the date indicators if there are no commits found.

They don't need to be displayed.

Some frontend test cases that pass on CI are failing locally - how do I fix this? Furthermore, it takes about 40 minutes to finish running the test cases. One example is:

  1) include merge commits in chart view
       show merge commits in summary chart:
     AssertionError: Timed out retrying after 30000ms: Expected to find element: `[title="[2023-03-03] Merge branch 'new-branch' into cypress: +0 -0 lines "]`, but never found it.     
      at Context.eval (webpack:///./tests/chartView/chartView_mergeCommits.cy.js:5:7)

The test case you mentioned is a flaky test known to have issues locally on some devices. Might be issues related to author vs commit date. This has always passed on CI, so we can ignore it. Do let us know if there are any other test cases that are failing.

[github-actions[bot]]

Hi, We are going to mark this PR as stale because it has been inactive for the past 30 days. If no further activity occurs within the following 7 days, it will be automatically closed so that others can take up the issue. If you are still working on this PR, please make a follow-up commit within 7 days and leave a comment to remove the stale label. Do let us know if you are stuck so that we can help you!'

[github-actions[bot]]

This PR was closed because it has been marked as stale for 7 days with no activity. Feel free to reopen this PR if you would like to continue working on it.