Fix last point of line charts. And small other fixes to line charts. #21235
Conversation
![home-assistant[bot]](https://avatars.githubusercontent.com/in/97978?s=60&v=4){kind=small}
|
Please take a look at the requested changes, and use the Ready for review button when you are done, thanks 👍 |
|
Warning Rate limit exceeded@silamon has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 20 minutes and 33 seconds before requesting another review. How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. WalkthroughWalkthroughThe Changes
Sequence DiagramssequenceDiagram
participant User
participant LovelacePanel
participant GraphCoordinates
User ->> LovelacePanel: Request graph data
LovelacePanel ->> GraphCoordinates: Call `calcPoints(detail > 1)`
GraphCoordinates ->> GraphCoordinates: Adjust `first` value
GraphCoordinates ->> GraphCoordinates: Call `getY(value)`
GraphCoordinates -->> LovelacePanel: Return calculated points
LovelacePanel -->> User: Display graph with new points
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configuration File (
|
home-assistant
bot
added
cla-recheck
cla-signed
and removed
cla-recheck
cla-needed
labels
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
Outside diff range comments (9)
src/panels/lovelace/common/graph/coordinates.ts (9)
Line range hint
4-4: Avoid usinganytype.Specify a different type for the
itemsparameter to enable better type checking.-const average = (items: any[]): number => +const average = (items: { state: string }[]): number =>Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
5-5: UseNumber.parseFloatinstead of the globalparseFloat.ES2015 moved some globals into the Number namespace for consistency.
- items.reduce((sum, entry) => sum + parseFloat(entry.state), 0) / items.length; + items.reduce((sum, entry) => sum + Number.parseFloat(entry.state), 0) / items.length;Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
7-7: Avoid usinganytype.Specify a different type for the
itemsparameter to enable better type checking.-const lastValue = (items: any[]): number => +const lastValue = (items: { state: string }[]): number =>Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
8-8: UseNumber.parseFloatinstead of the globalparseFloat.ES2015 moved some globals into the Number namespace for consistency.
- parseFloat(items[items.length - 1].state) || 0; + Number.parseFloat(items[items.length - 1].state) || 0;Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
11-11: Avoid usinganytype.Specify a different type for the
historyparameter to enable better type checking.-const calcPoints = ( - history: any, +const calcPoints = ( + history: { state: string }[],Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
60-60: Avoid usinganytype.Specify a different type for the
historyparameter to enable better type checking.-export const coordinates = ( - history: any, +export const coordinates = ( + history: { state: number, last_changed: string }[],Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
69-69: Avoid reassigning function parameters.The parameter
historyis reassigned. Use a local variable instead.- history = history.filter((item) => !Number.isNaN(item.state)); + const filteredHistory = history.filter((item) => !Number.isNaN(item.state));Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
97-98: Avoid reassigning function parameters.The parameter
historyis reassigned. Use a local variable instead.- history = history.reduce((res, item) => reduce(res, item, false), []); + const reducedHistory = history.reduce((res, item) => reduce(res, item, false), []);Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
100-101: Avoid reassigning function parameters.The parameter
historyis reassigned. Use a local variable instead.- history = history.map((entry) => - entry.reduce((res, item) => reduce(res, item, true), []) + const mappedHistory = history.map((entry) => + entry.reduce((res, item) => reduce(res, item, true), [])Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
onnlucky
force-pushed
the
fix/last-graph-point
branch
from
966fd51 to
ee4e8cf
Compare
onnlucky
changed the title
There was a problem hiding this comment.
Actionable comments posted: 0
Outside diff range comments (3)
src/panels/lovelace/common/graph/coordinates.ts (3)
Line range hint
34-47: Avoid usinganytype for theitemparameter ingetCoords.Specify a different type for the
itemparameter to enable better type checking.-const getCoords = (item: any[], i: number, offset = 0, depth = 1) => { +const getCoords = (item: { state: string }[], i: number, offset = 0, depth = 1) => {Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
60-60: Avoid usinganytype for thehistoryparameter incoordinates.Specify a different type for the
historyparameter to enable better type checking.-export const coordinates = ( - history: any, +export const coordinates = ( + history: { state: number; last_changed: number }[],Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
Line range hint
69-69: Avoid reassigning function parameters.Reassigning a function parameter is confusing. Use a local variable instead.
-history = history.filter((item) => !Number.isNaN(item.state)); +const filteredHistory = history.filter((item) => !Number.isNaN(item.state));-history = history.reduce((res, item) => reduce(res, item, false), []); +const reducedHistory = history.reduce((res, item) => reduce(res, item, false), []);-history = history.map((entry) => +const mappedHistory = history.map((entry) =>Also applies to: 98-100
Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
onnlucky
force-pushed
the
fix/last-graph-point
branch
from
ee4e8cf to
2073f90
Compare
| const getY = (value: number): number => { | ||
| return height + strokeWidth / 2 - (value - min) / yRatio; | ||
| }; | ||
|
|
||
| const getCoords = (item: any[], i: number, offset = 0, depth = 1) => { |
There was a problem hiding this comment.
Avoid using any type.
Specify a different type for the item parameter to enable better type checking.
-const getCoords = (item: any[], i: number, offset = 0, depth = 1) => {
+const getCoords = (item: { state: string }[], i: number, offset = 0, depth = 1) => {Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const getCoords = (item: any[], i: number, offset = 0, depth = 1) => { | |
| const getCoords = (item: { state: string }[], i: number, offset = 0, depth = 1) => { |
Tools
Biome
[error] 35-35: Unexpected any. Specify a different type.
any disables many type checking rules. Its use should be avoided.
(lint/suspicious/noExplicitAny)
| @@ -22,9 +22,16 @@ const calcPoints = ( | |||
| let xRatio = width / (hours - (detail === 1 ? 1 : 0)); | |||
| xRatio = isFinite(xRatio) ? xRatio : width; | |||
There was a problem hiding this comment.
Use Number.isFinite instead of the global isFinite.
ES2015 moved some globals into the Number namespace for consistency.
- xRatio = isFinite(xRatio) ? xRatio : width;
+ xRatio = Number.isFinite(xRatio) ? xRatio : width;Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| xRatio = isFinite(xRatio) ? xRatio : width; | |
| xRatio = Number.isFinite(xRatio) ? xRatio : width; |
Tools
Biome
[error] 23-23: isFinite is unsafe. It attempts a type coercion. Use Number.isFinite instead.
See the MDN documentation for more details.
Unsafe fix: Use Number.isFinite instead.(lint/suspicious/noGlobalIsFinite)
onnlucky
force-pushed
the
fix/last-graph-point
branch
from
2073f90 to
06f3909
Compare
Especially for items that don't often change state, the last state could be essentially be ignored for quite a while, using the average of the last series of entries instead. Also for detailed graphs, the initial values could be off, because the initial last value would be computed on bad data, resulting in NaN. And no longer adds a double entry at end if graph has only one point.
onnlucky
force-pushed
the
fix/last-graph-point
branch
from
06f3909 to
6a65962
Compare
Head branch was pushed to by a user without write access
Breaking change
Proposed change
This PR fixes the rendering of the last point in graphs. Otherwise, especially for items that don't often change state, the last state could be ignored for quite a while, using the average of the last series of entries instead.
Also, for detailed graphs, the initial values could be off, because the initial last value would be computed on bad data, resulting in NaN.
This PR also no longer adds a double entry at end if graph has only one point. Should not affect anything.
Type of change
Example configuration
That is a sensor I have that is often at 100%, only changes rarely, if when it does, often quickly goes back to 100%. Which was especially prone to showing bad values.
You can test this via developer tools -> set state then inject states into a fictional sensor (eg sensor.foobar). Do 100, 90, 100. Then add a sensor card with line graph on some dashboard. You'll see it dips down and never up. Even if you come back to it minutes or hours later. Also, if you toggle show more detail, the graph dips to zero, and only renders the last edge.
Additional information
Checklist
Note, I have tested the code only by copying the relevant function in a typescript playground and fixing it from there. Setting up a full home assistent development environment is a bit too much work for me at the moment for such a simple code fix.
If user exposed functionality or configuration variables are added/changed:
Summary by CodeRabbit