Gas Station Monitor - Copy this React, Tailwind Component to your project
Create a React component for monitoring gas distribution stations that displays the station title (e.g., ‘Sarawak’) with the current date and time, an indicator (e.g., ‘FC-1001’), and a combined ‘Parameters’ section. This section should include Input Pressure (in BarA), Output Pressure (in BarG), Temperature (in °C), Standard Volume Flow (in Sm³/h), Standard Volume Accumulated (in Sm³), Standard Volume for Today (in Sm³), and Standard Volume for Yesterday (in Sm³). Each parameter should have a blinking dot to indicate real-time updates, a trend arrow to show the direction of change compared to the previous value, and a question mark icon that, when hovered over, displays the full name or explanation of the parameter. Ensure the UI is clean, responsive, and easy to read, with appropriate labels and units for each parameter. Add functionality for real-time updates, historical data analysis, and alert notifications for any abnormal readings.
