[PdrDashboard] v0.5: Predictoors page

[KatunaNorbert]

Target

Add a new page dedicated to predictoors, where users can leverage a big table containing all the existing predictoors with multiple metrics and properties.

Super epic issue can be found here

TODO

• [x] Add 'Predictoors' to navigation links and create Predictoors page
  • Extend navbar to contain link to the page
  • Create the files and components needed for the page
• [x] #1531
  • Under the menu display a row containing main metrics over all predictoors, such as: Predictoors(number of predictoor addrs), Accuracy(avg), Stake, Gross income
• [x] Create a table that contains all the columns from the mockup provided bellow - Mustafa - 1533
• [x] #1534
  • The components should be compressed and the dropdown list should open when component is clicked
• [x] Add searchbar that allow search based on predictoor address
• [ ] Display specific Predictoor plots inside a modal - Mustafa - 1538
  • When clicking on a specific row, the predictoor address should be saved and a component should open
  • When clicking again the component should close
  • Display the charts displayed inside the mockup from bellow
• [x] Add tests with dash duo #1546
  • update navigation tests
  • create tests for predictoors page
• [x] Fix sorting table columns containing formatted values - 1545

UI sketch for v0.5:

[KatunaNorbert]

Feedback on the current progress:

• [x] Move calculate_tx_gas_fee_cost_in_OCEAN() to app startup and pass it to each page so we avoid duplicate - https://github.com/oceanprotocol/pdr-backend/issues/1542
• [ ] Use the same function to get all predictoors related data before the app starts in one place instead of using 1 method for home page predictoors table(payouts_stats()) and Predictoors page table (predictoor_payouts_stats()). The 2 table should have the same data source
• [ ] Predictoors table:
  • gross income: should be the total profit from right predictions, contains: income from stakes + income from subscription purchases
  • add new column called 'stake loses’ that contains the stake amount lost on wrong predictions
  • income from stakes: can not be negative, should reprsesent all the profit made by right predictions: payout - stake - subscription income(let’s consider this as 0 for now for simplification but will add it lately)
• [x] Predictoors metrics:
  • tooltips are empty, add proper tooltip text description for each metric

[kdetry]

• [x] Replace the APY metric with APR and fix the SQL query with a performant version - Mustafa - 1541