From 01a4b55ed8fda91cf335154a5f00082de9823fe9 Mon Sep 17 00:00:00 2001 From: Bram Kragten Date: Wed, 14 Dec 2022 17:27:05 +0100 Subject: [PATCH] Use entity picker in calendar event editor (#14772) --- .../calendar/dialog-calendar-event-detail.ts | 2 +- .../calendar/dialog-calendar-event-editor.ts | 45 +++++++++---------- src/panels/calendar/ha-full-calendar.ts | 24 +++++----- .../show-dialog-calendar-event-detail.ts | 7 ++- .../show-dialog-calendar-event-editor.ts | 3 +- 5 files changed, 36 insertions(+), 45 deletions(-) diff --git a/src/panels/calendar/dialog-calendar-event-detail.ts b/src/panels/calendar/dialog-calendar-event-detail.ts index adb732c08e..276459a0da 100644 --- a/src/panels/calendar/dialog-calendar-event-detail.ts +++ b/src/panels/calendar/dialog-calendar-event-detail.ts @@ -47,7 +47,7 @@ class DialogCalendarEventDetail extends LitElement { if (params.entry) { const entry = params.entry!; this._data = entry; - this._calendarId = params.calendarId || params.calendars[0].entity_id; + this._calendarId = params.calendarId; } } diff --git a/src/panels/calendar/dialog-calendar-event-editor.ts b/src/panels/calendar/dialog-calendar-event-editor.ts index 5330108172..4efbeec587 100644 --- a/src/panels/calendar/dialog-calendar-event-editor.ts +++ b/src/panels/calendar/dialog-calendar-event-editor.ts @@ -1,6 +1,5 @@ import "@material/mwc-button"; import { mdiClose } from "@mdi/js"; -import { ComboBoxLitRenderer } from "@vaadin/combo-box/lit"; import { addDays, addHours, @@ -8,16 +7,20 @@ import { differenceInMilliseconds, startOfHour, } from "date-fns/esm"; +import { HassEntity } from "home-assistant-js-websocket"; import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; import { customElement, property, state } from "lit/decorators"; import memoizeOne from "memoize-one"; import { fireEvent } from "../../common/dom/fire_event"; +import { computeStateDomain } from "../../common/entity/compute_state_domain"; +import { supportsFeature } from "../../common/entity/supports-feature"; import { isDate } from "../../common/string/is_date"; +import "../../components/entity/ha-entity-picker"; import "../../components/ha-date-input"; import "../../components/ha-textarea"; import "../../components/ha-time-input"; import { - Calendar, + CalendarEntityFeature, CalendarEventMutableParams, createCalendarEvent, deleteCalendarEvent, @@ -27,14 +30,9 @@ import { HomeAssistant } from "../../types"; import "../lovelace/components/hui-generic-entity-row"; import "./ha-recurrence-rule-editor"; import { showConfirmEventDialog } from "./show-confirm-event-dialog-box"; -import { CalendarEventDetailDialogParams } from "./show-dialog-calendar-event-detail"; import { CalendarEventEditDialogParams } from "./show-dialog-calendar-event-editor"; -const rowRenderer: ComboBoxLitRenderer = ( - item -) => html` - ${item.name} -`; +const CALENDAR_DOMAINS = ["calendar"]; @customElement("dialog-calendar-event-editor") class DialogCalendarEventEditor extends LitElement { @@ -44,9 +42,7 @@ class DialogCalendarEventEditor extends LitElement { @state() private _info?: string; - @state() private _params?: CalendarEventDetailDialogParams; - - @state() private _calendars: Calendar[] = []; + @state() private _params?: CalendarEventEditDialogParams; @state() private _calendarId?: string; @@ -68,8 +64,13 @@ class DialogCalendarEventEditor extends LitElement { this._error = undefined; this._info = undefined; this._params = params; - this._calendars = params.calendars; - this._calendarId = params.calendarId || this._calendars[0].entity_id; + this._calendarId = + params.calendarId || + Object.values(this.hass.states).find( + (stateObj) => + computeStateDomain(stateObj) === "calendar" && + supportsFeature(stateObj, CalendarEntityFeature.CREATE_EVENT) + )?.entity_id; if (params.entry) { const entry = params.entry!; this._allDay = isDate(entry.dtstart); @@ -99,7 +100,6 @@ class DialogCalendarEventEditor extends LitElement { if (!this._params) { return; } - this._calendars = []; this._calendarId = undefined; this._params = undefined; this._dtstart = undefined; @@ -172,19 +172,16 @@ class DialogCalendarEventEditor extends LitElement { @change=${this._handleDescriptionChanged} autogrow > - + > @@ -281,6 +278,9 @@ class DialogCalendarEventEditor extends LitElement { `; } + private _isEditableCalendar = (entityStateObj: HassEntity) => + supportsFeature(entityStateObj, CalendarEntityFeature.CREATE_EVENT); + private _getLocaleStrings = memoizeOne((startDate?: Date, endDate?: Date) => // en-CA locale used for date format YYYY-MM-DD // en-GB locale used for 24h time format HH:MM:SS @@ -557,9 +557,6 @@ class DialogCalendarEventEditor extends LitElement { ha-rrule { display: block; } - ha-combo-box { - display: block; - } ha-svg-icon { width: 40px; margin-right: 8px; diff --git a/src/panels/calendar/ha-full-calendar.ts b/src/panels/calendar/ha-full-calendar.ts index f913ba78d0..e0e2a114d3 100644 --- a/src/panels/calendar/ha-full-calendar.ts +++ b/src/panels/calendar/ha-full-calendar.ts @@ -200,7 +200,7 @@ export class HAFullCalendar extends LitElement { : ""}
- ${this._mutableCalendars.length > 0 + ${this._hasMutableCalendars ? html` { - const entityStateObj = this.hass.states[selCal.entity_id]; - return ( - entityStateObj && - supportsFeature(entityStateObj, CalendarEntityFeature.CREATE_EVENT) - ); - }) - .map((cal) => cal); + // Return if there are calendars that support creating events + private get _hasMutableCalendars(): boolean { + return this.calendars.some((selCal) => { + const entityStateObj = this.hass.states[selCal.entity_id]; + return ( + entityStateObj && + supportsFeature(entityStateObj, CalendarEntityFeature.CREATE_EVENT) + ); + }); } private _createEvent(_info) { @@ -289,7 +287,6 @@ export class HAFullCalendar extends LitElement { // current actual month, as for that one the current day is automatically highlighted and // defaulting to a different day in the event creation dialog would be weird. showCalendarEventEditDialog(this, { - calendars: this._mutableCalendars, selectedDate: this._activeView === "dayGridWeek" || this._activeView === "dayGridDay" || @@ -309,7 +306,6 @@ export class HAFullCalendar extends LitElement { entityStateObj && supportsFeature(entityStateObj, CalendarEntityFeature.DELETE_EVENT); showCalendarEventDetailDialog(this, { - calendars: this.calendars, calendarId: info.event.extendedProps.calendar, entry: info.event.extendedProps.eventData, color: info.event.backgroundColor, diff --git a/src/panels/calendar/show-dialog-calendar-event-detail.ts b/src/panels/calendar/show-dialog-calendar-event-detail.ts index 05306294b4..659db3b1b6 100644 --- a/src/panels/calendar/show-dialog-calendar-event-detail.ts +++ b/src/panels/calendar/show-dialog-calendar-event-detail.ts @@ -1,10 +1,9 @@ import { fireEvent } from "../../common/dom/fire_event"; -import { Calendar, CalendarEventData } from "../../data/calendar"; +import { CalendarEventData } from "../../data/calendar"; export interface CalendarEventDetailDialogParams { - calendars: Calendar[]; // When creating new events, is the list of calendar entities that support creation - calendarId?: string; - entry?: CalendarEventData; + calendarId: string; + entry: CalendarEventData; canDelete?: boolean; canEdit?: boolean; updated: () => void; diff --git a/src/panels/calendar/show-dialog-calendar-event-editor.ts b/src/panels/calendar/show-dialog-calendar-event-editor.ts index f2ab58a4f6..6f6fddcf22 100644 --- a/src/panels/calendar/show-dialog-calendar-event-editor.ts +++ b/src/panels/calendar/show-dialog-calendar-event-editor.ts @@ -1,8 +1,7 @@ import { fireEvent } from "../../common/dom/fire_event"; -import { Calendar, CalendarEventData } from "../../data/calendar"; +import { CalendarEventData } from "../../data/calendar"; export interface CalendarEventEditDialogParams { - calendars: Calendar[]; // When creating new events, is the list of calendar entities that support creation calendarId?: string; selectedDate?: Date; // When provided is used as the pre-filled date for the event creation dialog entry?: CalendarEventData;