Bot Configuration - Copy this React, Tailwind Component to your project

Create a Bots Component using the specified theme that helps the user to create and backtest a particular bot configuration. The user can specify the type of bot (i.e. Grid Bot, DCA Bot, EMA Crossover Bot). Depending on the user's selection, the configuration will different for every type of bot. For now, we'll just start with the Grid Bot. We'll start by asking them to specify the exchange to use for this bot. We'll then ask them to select a position to use as a Base coin and one to use as the quote coin. These choices will be limited to the trading pairs available on the exchange. Once the coin is selected, the screen should transition to a summary and the configuration portion should show. From here, We'll ask the user to specify the top price of the grid, the bottom price of the grid, how many grid levels to use (slider 10 100) and Amount of leverage(1 10 slider) and margin to use (slider from 0 100%). It should dymanically calculate the profit per grid in both % and dollar value so the user can dial in their desired configuration. Also add a backtest button that shows a popup that lets you specigy the starting and ending date, a Run Backtest button and a numeric display of the current configuration as well as the total profit earned for that time period. I'd like to see a graph of the total profit earned per day as well