jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-27 11:16:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Capitalize relative time strings (#10165)

Browse Source
This commit is contained in:
Bram Kragten 2021-10-06 13:56:52 +02:00 committed by GitHub
parent a696d849b2
commit ec21f4c2c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
hassio/src/components/hassio-card-content.ts
View File

@ -1,7 +1,6 @@
import { mdiHelpCircle } from "@mdi/js";
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import "../../../src/components/ha-relative-time";
import "../../../src/components/ha-svg-icon";
import { HomeAssistant } from "../../../src/types";
@ -19,8 +18,6 @@ class HassioCardContent extends LitElement {
@property() public topbarClass?: string;
@property() public datetime?: string;
@property() public iconTitle?: string;
@property() public iconClass?: string;
@ -56,15 +53,6 @@ class HassioCardContent extends LitElement {
/* treat as available when undefined */
this.available === false ? " (Not available)" : ""
}
${this.datetime
? html`
<ha-relative-time
.hass=${this.hass}
class="addition"
.datetime=${this.datetime}
></ha-relative-time>
`
: undefined}
</div>
</div>
`;
@ -106,9 +94,6 @@ class HassioCardContent extends LitElement {
height: 2.4em;
line-height: 1.2em;
}
ha-relative-time {
display: block;
}
.icon_image img {
max-height: 40px;
max-width: 40px;

2
src/common/string/capitalize-first-letter.ts Normal file
View File

@ -0,0 +1,2 @@
export const capitalizeFirstLetter = (str: string) =>
str.charAt(0).toUpperCase() + str.slice(1);

2
src/components/entity/state-info.ts
View File

@ -38,6 +38,7 @@ class StateInfo extends LitElement {
id="last_changed"
.hass=${this.hass}
.datetime=${this.stateObj.last_changed}
capitalize
></ha-relative-time>
<paper-tooltip animation-delay="0" for="last_changed">
<div>
@ -92,7 +93,6 @@ class StateInfo extends LitElement {
state-badge {
float: left;
}
:host([rtl]) state-badge {
float: right;
}

8
src/components/ha-relative-time.ts
View File

@ -1,6 +1,7 @@
import { PropertyValues, ReactiveElement } from "lit";
import { customElement, property } from "lit/decorators";
import { relativeTime } from "../common/datetime/relative_time";
import { capitalizeFirstLetter } from "../common/string/capitalize-first-letter";
import type { HomeAssistant } from "../types";
@customElement("ha-relative-time")
@ -9,6 +10,8 @@ class HaRelativeTime extends ReactiveElement {
@property({ attribute: false }) public datetime?: string | Date;
@property({ type: Boolean }) public capitalize = false;
private _interval?: number;
public disconnectedCallback(): void {
@ -55,7 +58,10 @@ class HaRelativeTime extends ReactiveElement {
if (!this.datetime) {
this.innerHTML = this.hass.localize("ui.components.relative_time.never");
} else {
this.innerHTML = relativeTime(new Date(this.datetime), this.hass.locale);
const relTime = relativeTime(new Date(this.datetime), this.hass.locale);
this.innerHTML = this.capitalize
? capitalizeFirstLetter(relTime)
: relTime;
}
}
}

1
src/dialogs/more-info/controls/more-info-automation.ts
View File

@ -25,6 +25,7 @@ class MoreInfoAutomation extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${this.stateObj.attributes.last_triggered}
capitalize
></ha-relative-time>
</div>

1
src/dialogs/more-info/controls/more-info-script.ts
View File

@ -28,6 +28,7 @@ class MoreInfoScript extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${this.stateObj.attributes.last_triggered}
capitalize
></ha-relative-time>
`
: this.hass.localize("ui.components.relative_time.never")}

3
src/dialogs/more-info/controls/more-info-sun.ts
View File

@ -73,9 +73,6 @@ class MoreInfoSun extends LitElement {
display: inline-block;
white-space: nowrap;
}
ha-relative-time::first-letter {
text-transform: lowercase;
}
hr {
border-color: var(--divider-color);
border-bottom: none;

1
src/dialogs/notifications/persistent-notification-item.ts
View File

@ -31,6 +31,7 @@ export class HuiPersistentNotificationItem extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${this.notification.created_at}
capitalize
></ha-relative-time>
<paper-tooltip animation-delay="0">
${this._computeTooltip(this.hass, this.notification)}

3
src/panels/config/integrations/integration-panels/zwave_js/zwave_js-logs.ts
View File

@ -16,6 +16,7 @@ import { haStyle } from "../../../../../resources/styles";
import { HomeAssistant, Route } from "../../../../../types";
import { fileDownload } from "../../../../../util/file_download";
import { configTabs } from "./zwave_js-config-router";
import { capitalizeFirstLetter } from "../../../../../common/string/capitalize-first-letter";
@customElement("zwave_js-logs")
class ZWaveJSLogs extends SubscribeMixin(LitElement) {
@ -149,7 +150,7 @@ class ZWaveJSLogs extends SubscribeMixin(LitElement) {
setZWaveJSLogLevel(this.hass!, this.configEntryId, selected);
this._textarea!.value += `${this.hass.localize(
"ui.panel.config.zwave_js.logs.log_level_changed",
{ level: selected.charAt(0).toUpperCase() + selected.slice(1) }
{ level: capitalizeFirstLetter(selected) }
)}\n`;
}

2
src/panels/config/tags/ha-config-tags.ts
View File

@ -79,6 +79,7 @@ export class HaConfigTags extends SubscribeMixin(LitElement) {
? html`<ha-relative-time
.hass=${this.hass}
.datetime=${tag.last_scanned_datetime}
capitalize
></ha-relative-time>`
: this.hass.localize("ui.panel.config.tag.never_scanned")}
</div>`
@ -96,6 +97,7 @@ export class HaConfigTags extends SubscribeMixin(LitElement) {
? html`<ha-relative-time
.hass=${this.hass}
.datetime=${last_scanned_datetime}
capitalize
></ha-relative-time>`
: this.hass.localize("ui.panel.config.tag.never_scanned")}
`,

1
src/panels/logbook/ha-logbook.ts
View File

@ -210,6 +210,7 @@ class HaLogbook extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${item.when}
capitalize
></ha-relative-time>
${item.domain === "automation" &&
item.context_id! in this.traceContexts

3
src/panels/lovelace/components/hui-generic-entity-row.ts
View File

@ -95,6 +95,7 @@ class HuiGenericEntityRow extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${stateObj.last_changed}
capitalize
></ha-relative-time>
`
: this.config.secondary_info === "last-updated"
@ -102,6 +103,7 @@ class HuiGenericEntityRow extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${stateObj.last_updated}
capitalize
></ha-relative-time>
`
: this.config.secondary_info === "last-triggered"
@ -110,6 +112,7 @@ class HuiGenericEntityRow extends LitElement {
<ha-relative-time
.hass=${this.hass}
.datetime=${stateObj.attributes.last_triggered}
capitalize
></ha-relative-time>
`
: this.hass.localize(

1
src/panels/lovelace/editor/card-editor/hui-entity-picker-table.ts
View File

@ -103,6 +103,7 @@ export class HuiEntityPickerTable extends LitElement {
<ha-relative-time
.hass=${this.hass!}
.datetime=${lastChanged}
capitalize
></ha-relative-time>
`,
};

3
src/util/hass-attributes-util.ts
View File

@ -3,6 +3,7 @@ import { until } from "lit/directives/until";
import checkValidDate from "../common/datetime/check_valid_date";
import { formatDate } from "../common/datetime/format_date";
import { formatDateTimeWithSeconds } from "../common/datetime/format_date_time";
import { capitalizeFirstLetter } from "../common/string/capitalize-first-letter";
import { isDate } from "../common/string/is_date";
import { isTimestamp } from "../common/string/is_timestamp";
import { HomeAssistant } from "../types";
@ -159,7 +160,7 @@ export function formatAttributeName(value: string): string {
.replace(/\bip\b/g, "IP")
.replace(/\bmac\b/g, "MAC")
.replace(/\bgps\b/g, "GPS");
return value.charAt(0).toUpperCase() + value.slice(1);
return capitalizeFirstLetter(value);
}
export function formatAttributeValue(