Upgrade the chart functionality in the application.

The PopularCoinsChart.vue component displays charts for the most popular cryptocurrencies, but only shows data for the last 24 hours.

Add a dropdown selector above the charts with the following options:

• 1 hour (1DAY)
• 1 week (7DAY)
• 1 month (1MTH) Upon selecting an option from the dropdown, the charts should refresh and display data for the selected time interval.

1. Add a element with the options: 1DAY, 7DAY, 1MTH above the charts.
2. Store the selected interval in the component state (e.g., selectedCoinData).
3. Update the fetchChartData() function to use the new interval value when calling the API.
4. On dropdown value change, call fetchChartData() again to refresh the data.

---

Add sorting functionality to the Live Market component.
Allow users to sort the list of cryptocurrencies by:

• Price change in the last 24 hours (changePercent24Hr)
• Volume in the last 24 hours (volumeUsd24Hr)

The cryptocurrency list is displayed without any sorting. Data is loaded from the state (Pinia store) and displayed in the order received from the API. The variable sortBy is set to null, meaning no sorting criteria are applied.

• Add 2 buttons in the LiveMarketComponent.vue component:

• “Sort by Change %”

• “Sort by Volume 24h”

• When the user clicks one of the buttons, the displayed list should update and be sorted according to the selected criterion (in descending order).

1. Add two <button> elements in the template:

   • One for sorting by changePercent24Hr

   • One for sorting by volumeUsd24Hr

   • Use @click to update the selected sorting criterion (sortBy).

2. Store the selected sorting criterion in the state, e.g., const sortBy = ref(null);

3. Use a computed property to sort the cryptocurrency list based on the selected sorting criterion:

   • If sortBy.value === "change", sort by changePercent24Hr.

   • If sortBy.value === "volume", sort by volumeUsd24Hr.

   • If no sorting criterion is selected, display the original data.

4. Render the sorted list inside the v-for using the computed result instead of the original coinStore.coinDataTop50.