From e212762bf3ea8ed11f8a106606bf6ae529916355 Mon Sep 17 00:00:00 2001
From: Aidan Timson <contact@timmo.xyz>
Date: Sun, 28 Jun 2020 12:07:10 +0100
Subject: [PATCH] Fix for weather entities with no forecast

---
 .../HomeAssistant/Cards/Weather.tsx           | 105 +++++++++---------
 1 file changed, 53 insertions(+), 52 deletions(-)

diff --git a/frontend/src/Components/HomeAssistant/Cards/Weather.tsx b/frontend/src/Components/HomeAssistant/Cards/Weather.tsx
index 338c94592..e2070af79 100644
--- a/frontend/src/Components/HomeAssistant/Cards/Weather.tsx
+++ b/frontend/src/Components/HomeAssistant/Cards/Weather.tsx
@@ -124,60 +124,61 @@ function Weather(props: EntityProps): ReactElement {
       {(!props.card.width || props.card.width > 1) &&
         (!props.card.height || props.card.height > 1) && (
           <Grid item className={classes.forecast}>
-            {props.entity.attributes.forecast.map(
-              (
-                w: {
-                  datetime: string | Date;
-                  condition: string;
-                  temperature: React.ReactNode;
-                  precipitation: React.ReactNode;
-                },
-                key: number
-              ) => {
-                const datetime = moment(w.datetime);
-                const icon = weatherMap[w.condition];
-                return (
-                  <div key={key} className={classes.forecastItem}>
-                    <Typography
-                      noWrap
-                      className={classes.forecastText}
-                      variant="body2">
-                      {datetime.format('ddd')}
-                      <br />
-                      {datetime.format('h a')}
-                    </Typography>
+            {props.entity.attributes.forecast &&
+              props.entity.attributes.forecast.map(
+                (
+                  w: {
+                    datetime: string | Date;
+                    condition: string;
+                    temperature: React.ReactNode;
+                    precipitation: React.ReactNode;
+                  },
+                  key: number
+                ) => {
+                  const datetime = moment(w.datetime);
+                  const icon = weatherMap[w.condition];
+                  return (
+                    <div key={key} className={classes.forecastItem}>
+                      <Typography
+                        noWrap
+                        className={classes.forecastText}
+                        variant="body2">
+                        {datetime.format('ddd')}
+                        <br />
+                        {datetime.format('h a')}
+                      </Typography>
 
-                    <Typography
-                      className={classes.forecastTextIcon}
-                      variant="body2">
-                      <span
-                        className={clsx(
-                          'mdi',
-                          `mdi-${icon}`,
-                          classes.forecastIcon
-                        )}
-                      />
-                    </Typography>
+                      <Typography
+                        className={classes.forecastTextIcon}
+                        variant="body2">
+                        <span
+                          className={clsx(
+                            'mdi',
+                            `mdi-${icon}`,
+                            classes.forecastIcon
+                          )}
+                        />
+                      </Typography>
 
-                    <Typography
-                      noWrap
-                      className={classes.forecastText}
-                      variant="body2">
-                      {w.temperature}
-                      <span className={classes.textSecondary}>
-                        {getUnit('temperature', props.hassConfig)}
-                      </span>
-                    </Typography>
-                    <Typography
-                      noWrap
-                      className={classes.forecastText}
-                      variant="body2">
-                      {w.precipitation}
-                    </Typography>
-                  </div>
-                );
-              }
-            )}
+                      <Typography
+                        noWrap
+                        className={classes.forecastText}
+                        variant="body2">
+                        {w.temperature}
+                        <span className={classes.textSecondary}>
+                          {getUnit('temperature', props.hassConfig)}
+                        </span>
+                      </Typography>
+                      <Typography
+                        noWrap
+                        className={classes.forecastText}
+                        variant="body2">
+                        {w.precipitation}
+                      </Typography>
+                    </div>
+                  );
+                }
+              )}
           </Grid>
         )}
     </Grid>