Skip to content

Allow hui-timestamp-display in markdown#8215

Closed
spacegaier wants to merge 6 commits intohome-assistant:devfrom
spacegaier:markdown-timestamp
Closed

Allow hui-timestamp-display in markdown#8215
spacegaier wants to merge 6 commits intohome-assistant:devfrom
spacegaier:markdown-timestamp

Conversation

@spacegaier
Copy link
Copy Markdown
Member

Breaking change

Proposed change

Use case:

I have a markdown card that displays upcoming weather alerts. I show the weather condition plus of course the time period for when they are going to apply. Currently I have this template in the markdown card:

{{ time_start | timestamp_custom("%a %H:%M") }}. That however, means that the date formatting (e.g. the weekdays) are set in the locale of the backend, ignoring the user language of the frontend. So in my case I have a German dashboard with a German alert text (German weather alert integration) but an English weekday.

image

Solution:

This PR now adds the <hui-timestamp-display> to the allowed list of HA tags in the markdown. I also included <style> which is also supported by the marked JS library we use since we have gfm enabled.

image

Type of change

  • Dependency upgrade
  • Bugfix (non-breaking change which fixes an issue)
  • New feature (thank you!)
  • Breaking change (fix/feature causing existing functionality to break)
  • Code quality improvements to existing code or addition of tests

Example configuration

Additional information

  • This PR fixes or closes issue: fixes #
  • This PR is related to issue or discussion:
  • Link to documentation pull request:

Checklist

  • The code change is tested and works locally.
  • There is no commented out code in this PR.
  • Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

})
: (dateObj: Date) => format(dateObj, "mediumTime");

export const formatTimeWeekday = toLocaleTimeStringSupportsOptions
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copied from PR #8182.

})
: (dateObj: Date) => format(dateObj, "longDate");

export const formatDateWeekday = toLocaleDateStringSupportsOptions
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copied from PR #8182.

} else if (node instanceof HTMLImageElement) {
node.addEventListener("load", this._resize);
} else if (node instanceof HuiTimestampDisplay) {
node.hass = this.hass;
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hass should be updated when it changes

if (!whiteListNormal) {
whiteListNormal = {
...(getDefaultWhiteList() as WhiteList),
style: [],
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can't allow every style, it allows for xss

Copy link
Copy Markdown
Member Author

@spacegaier spacegaier Jan 25, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, we might need something like this: https://github.com/leizongmin/js-css-filter

Same author as the xss module we already use, but quite old.

I'll separate the <style> part into a separate future PR.

@bramkragten
Copy link
Copy Markdown
Member

We should not add support for this, this means we can never change these elements again...

@bramkragten bramkragten closed this Mar 9, 2021
@github-actions github-actions bot locked and limited conversation to collaborators Mar 10, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants