Weather forecast sidebar component

[EvanBarbour3]

Weather Forecast Sidebar Component

I've added a sidebar component for a weather forecast. I've attached a video of it being configured and displaying, and also a picture of the 3 icon packs I've added as part of the setup.

If there's any changes you'd like let me know

Thanks!

weather_forecast.mp4

[matt8707]

Very nice!

I think it should be horizontally responsive, using something like justify-content: space-between; to fit the sidebar width.

Here are some bugs I found in WeatherConfig:

• The page crashes if entity.attributes.forecast does not exist.

  • Error: Uncaught (in promise) TypeError: entity.attributes.forecast is undefined.
  • Solution: Check for forecast before filtering $: weatherStates and use optional chaining.

• The Meteocons icon pack doesn’t work, resulting in a blank fallback.

• The "days to show" feature stops at 6, excluding Saturday.

  • The "days to show" should include the display of firstDay if it’s Sunday or Monday.

[EvanBarbour3]

Thanks for the feedback

I'll take a look at the Meteocons not loading, I used the static ones and can't currently replicate blanks.

Some things I've noticed with different forecast integrations:

• OpenWeatherMap provides it hourly, showing 48 entries (which I believe the screenshot above is using). It can be configured to do it daily too, but requires a paid plan
• Meteorologisk institutt (Met.no) provides it daily, showing 6 entries (which includes current date)

I'll take a look at some others and see the behaviour of those too.

I originally had it horizontally responsive until I added in the days to show, but when you change it down to <= 3, it didn't look too correct - I'll see what I can do in terms of this

[EvanBarbour3]

@matt8707 I've finished making changes, let me know what you think 😊

[matt8707]

Looks good!

[ajbatchelor]

Hi - just added this component into the sidebar and getting overlap on icons/dataset. Same result using other forecast entities.

Also, thanks. Love this addition very much!

[EvanBarbour3]

Hi - just added this component into the sidebar and getting overlap on icons/dataset. Same result using other forecast entities.

Also, thanks. Love this addition very much!

That issue was fixed in https://github.com/matt8707/ha-fusion/releases/tag/2024.1.8