Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-07-20 03:59:36 +02:00
Code Issues Releases Wiki Activity

Added humidity option to weather widget

Browse source
This commit is contained in:
Paweł Malak 2021-11-18 15:14:53 +01:00
parent a549149452
commit 5cf7708ab8
11 changed files with 68 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

26
client/src/components/Widgets/WeatherWidget/WeatherWidget.tsx
View file

@ -13,22 +13,14 @@ import classes from './WeatherWidget.module.css';
// UI
import { WeatherIcon } from '../../UI';
import { State } from '../../../store/reducers';
import { weatherTemplate } from '../../../utility/templateObjects/weatherTemplate';
export const WeatherWidget = (): JSX.Element => {
const { loading, config } = useSelector((state: State) => state.config);
const { loading: configLoading, config } = useSelector(
(state: State) => state.config
);
const [weather, setWeather] = useState<Weather>({
externalLastUpdate: '',
tempC: 0,
tempF: 0,
isDay: 1,
cloud: 0,
conditionText: '',
conditionCode: 1000,
id: -1,
createdAt: new Date(),
updatedAt: new Date(),
});
const [weather, setWeather] = useState<Weather>(weatherTemplate);
const [isLoading, setIsLoading] = useState(true);
// Initial request to get data
@ -65,8 +57,7 @@ export const WeatherWidget = (): JSX.Element => {
return (
<div className={classes.WeatherWidget}>
{isLoading ||
loading ||
{configLoading ||
(config.WEATHER_API_KEY && weather.id > 0 && (
<Fragment>
<div className={classes.WeatherIcon}>
@ -76,12 +67,15 @@ export const WeatherWidget = (): JSX.Element => {
/>
</div>
<div className={classes.WeatherDetails}>
{/* TEMPERATURE */}
{config.isCelsius ? (
<span>{weather.tempC}°C</span>
) : (
<span>{weather.tempF}°F</span>
)}
<span>{weather.cloud}%</span>
{/* ADDITIONAL DATA */}
<span>{weather[config.weatherData]}%</span>
</div>
</Fragment>
))}