Enhancement: Add formatting options to weather widgets (#3093)

gethomepage · Mar 10, 2024 · b5258c5 · b5258c5
1 parent 83d1ea5
commit b5258c5
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 1 deletion.
diff --git a/docs/widgets/info/openmeteo.md b/docs/widgets/info/openmeteo.md
@@ -13,6 +13,8 @@ No registration is required at all! See [https://open-meteo.com/en/docs](https:/
  timezone: Europe/Kiev # optional
  units: metric # or imperial
  cache: 5 # Time in minutes to cache API responses, to stay within limits
+ format: # optional, Intl.NumberFormat options
+ maximumFractionDigits: 1
 ```
 
 You can optionally not pass a `latitude` and `longitude` and the widget will use your current location (requires a secure context, eg. HTTPS).
diff --git a/docs/widgets/info/openweathermap.md b/docs/widgets/info/openweathermap.md
@@ -14,6 +14,8 @@ The free tier "One Call API" is all that's required, you will need to [subscribe
  provider: openweathermap
  apiKey: youropenweathermapkey # required only if not using provider, this reveals api key in requests
  cache: 5 # Time in minutes to cache API responses, to stay within limits
+ format: # optional, Intl.NumberFormat options
+ maximumFractionDigits: 1
 ```
 
 You can optionally not pass a `latitude` and `longitude` and the widget will use your current location (requires a secure context, eg. HTTPS).
diff --git a/docs/widgets/info/weather.md b/docs/widgets/info/weather.md
@@ -15,6 +15,8 @@ The free tier is all that's required, you will need to [register](https://www.we
  units: metric # or imperial
  apiKey: yourweatherapikey
  cache: 5 # Time in minutes to cache API responses, to stay within limits
+ format: # optional, Intl.NumberFormat options
+ maximumFractionDigits: 1
 ```
 
 You can optionally not pass a `latitude` and `longitude` and the widget will use your current location (requires a secure context, eg. HTTPS).
diff --git a/src/components/widgets/openmeteo/openmeteo.jsx b/src/components/widgets/openmeteo/openmeteo.jsx
@@ -46,6 +46,7 @@ function Widget({ options }) {
  value: data.current_weather.temperature,
  style: "unit",
  unit,
+ ...options.format,
  })}
  </PrimaryText>
  <SecondaryText>{t(`wmo.${data.current_weather.weathercode}-${timeOfDay}`)}</SecondaryText>

diff --git a/src/components/widgets/openweathermap/weather.jsx b/src/components/widgets/openweathermap/weather.jsx
@@ -42,7 +42,7 @@ function Widget({ options }) {
  <Container options={options} additionalClassNames="information-widget-openweathermap">
  <PrimaryText>
  {options.label && `${options.label}, `}
- {t("common.number", { value: data.main.temp, style: "unit", unit })}
+ {t("common.number", { value: data.main.temp, style: "unit", unit, ...options.format })}
  </PrimaryText>
  <SecondaryText>{data.weather[0].description}</SecondaryText>
  <WidgetIcon icon={mapIcon(condition, timeOfDay)} size="xl" />

diff --git a/src/components/widgets/weather/weather.jsx b/src/components/widgets/weather/weather.jsx
@@ -45,6 +45,7 @@ function Widget({ options }) {
  value: options.units === "metric" ? data.current.temp_c : data.current.temp_f,
  style: "unit",
  unit,
+ ...options.format,
  })}
  </PrimaryText>
  <SecondaryText>{data.current.condition.text}</SecondaryText>