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

Components: refactored rest of the components to use new state. Minor changes to exports, imports and props

Browse source
This commit is contained in:
Paweł Malak 2021-11-09 14:33:51 +01:00
parent 89d935e27f
commit 969bdb7d24
29 changed files with 462 additions and 733 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -2,23 +2,21 @@ import { useState, useEffect, Fragment } from 'react';
import axios from 'axios';
// Redux
import { connect } from 'react-redux';
import { useSelector } from 'react-redux';
// Typescript
import { Weather, ApiResponse, GlobalState, Config } from '../../../interfaces';
import { Weather, ApiResponse, Config } from '../../../interfaces';
// CSS
import classes from './WeatherWidget.module.css';
// UI
import WeatherIcon from '../../UI/Icons/WeatherIcon/WeatherIcon';
import { WeatherIcon } from '../../UI';
import { State } from '../../../store/reducers';
interface ComponentProps {
configLoading: boolean;
config: Config;
}
export const WeatherWidget = (): JSX.Element => {
const { loading, config } = useSelector((state: State) => state.config);
const WeatherWidget = (props: ComponentProps): JSX.Element => {
const [weather, setWeather] = useState<Weather>({
externalLastUpdate: '',
tempC: 0,
@ -68,8 +66,8 @@ const WeatherWidget = (props: ComponentProps): JSX.Element => {
return (
<div className={classes.WeatherWidget}>
{isLoading ||
props.configLoading ||
(props.config.WEATHER_API_KEY && weather.id > 0 && (
loading ||
(config.WEATHER_API_KEY && weather.id > 0 && (
<Fragment>
<div className={classes.WeatherIcon}>
<WeatherIcon
@ -78,7 +76,7 @@ const WeatherWidget = (props: ComponentProps): JSX.Element => {
/>
</div>
<div className={classes.WeatherDetails}>
{props.config.isCelsius ? (
{config.isCelsius ? (
<span>{weather.tempC}°C</span>
) : (
<span>{weather.tempF}°F</span>
@ -90,12 +88,3 @@ const WeatherWidget = (props: ComponentProps): JSX.Element => {
</div>
);
};
const mapStateToProps = (state: GlobalState) => {
return {
configLoading: state.config.loading,
config: state.config.config,
};
};
export default connect(mapStateToProps)(WeatherWidget);