Week Planner Card Plus and ICS Calendar Tools

I Needed a way to edit, Delete and add events by just clicking the day and found week planner card but was missing these small things so i added them. Oh i almost forgot I made it responsive too.

This is working GREAT for my local calendars and google calendars. Working great for the DIY Family Calendar (skylight) project. Thought i would share and hopes other people find it useful too. (New)Google support now too for deleting events.

It does need my other new integration “ics calendar tools” this allows deleting and updating local calendar events.


New “schedule” view

I tried to document everything as best i could so any questions post here or repo.

with this you need to use new card just add “-plus” to card in yaml as example type: custom:week-planner-card-plus this is required for card to work and is in documentation.

Here is link to my custom integration “ics-calendar-tools” that is required for local calendars i want to keep all i can local.

Note certain calendars have limitations. CalDAV cannot edit or delete events. But you can add events Google cannot edit events. But You can add and delete events Local calendars you can delete, add and edit events with ics calendar tools addon!

Basic Usage

New built-in Add dialog (recommended)

This uses the Plus card’s built-in Add dialog:

  • Clicking a totally empty day opens Add
  • Clicking empty space within a day that already has events opens Add
  • Clicking an event opens Edit (and the calendar is preselected based on the clicked event)
type: custom:week-planner-card-plus
tapEmptyDayToAdd: false           # legacy scripted popup (leave off)
clickEmptyDayToAddPlus: true      # NEW built-in dialog
calendars:
  - entity: calendar.family_calendar

Legacy scripted Add dialog (older dashboards)

This uses the old “scripted” Add flow (kept for backwards compatibility).

type: custom:week-planner-card-plus
tapEmptyDayToAdd: true            # legacy scripted popup
clickEmptyDayToAddPlus: false     # disable built-in dialog
calendars:
  - entity: calendar.family_calendar

Tip: Use only one add mode. Set either tapEmptyDayToAdd or clickEmptyDayToAddPlus to true — not both.


Notes on Repeat (Recurring Events)

  • Cloud calendars (Google/CalDAV/etc.): recurring events are created using Home Assistant’s calendar APIs (built-in dialog).
  • Local Calendar (.ics): recurring events require writing an RRULE into the .ics file — use ICS Calendar Tools for add/update/delete with repeat support.

Options

clickEmptyDayToAddPlus (boolean)

When true, empty-day / empty-space clicks open the built-in Add dialog (recommended).

tapEmptyDayToAdd (boolean)

Legacy mode. When true, empty-day clicks use the older scripted Add flow.


Companion integration (Local Calendar editing)

If you want Local Calendar .ics edit/delete/repeat to behave like cloud calendars, install:

1 Like

I’m away for a couple of days but will definitely be giving this a spin with my Skylight Family Calendar implementation once I’m home.

I’m trying to delete google calendar events from my family skylight calendar, and when deleting an event, I get an error from my HA instance of the following: No matching event found to delete. and a floating message

Action ics_calendar_tools.delete_event not found.

when I try to delete said event. Will restarting my HA instance and see if that fixes it.

Did you install ics_calendar_tools that is required for local calendar update and delete functions. Link is in first post
I have not tested this with cloud based calendars only local calendars.

I had not installed the ICS update function integration, but even after installing it, restarting HACS and trying again, same behavior. It seems that at least Google Calendar doesn’t use a ICS style calendars maybe?

Possibly. Did you restart Home assistant after installing? I could add Google support or I should say make tool work with Google/cloud based calendars. Try a reboot and see if that fixes it
If you go to developer tools then action and search for ics does it show anything? Should show 2 entities

I will work on adding google support i think thats by ID not ICS so should be doable

I did reboot the HA server instance after installing the second integration, and no change in behavior.

In regards to the entities, are these the correct ones?

no you should see these delete event from local calendar and update event in local calendar

did you actually install in home assistant? it should show in “integrations”

@emblaochist ill install google calendar integration and will write support for “event ID” into tool. give me a day or 2. For now once you get ics tools installed correctly give it a test with local calendar it works very good but google support coming soon.

1 Like

Thanks a ton, @randr! This was a huge improvement over an already awesome solution to replicate the Skylight calendar behavior, so very, very much appreciated that you’re adding google calendar support!

Did you test it on local Calendar it should work perfectly once you get ics calendar tools installed. would like to know it works for you with local calendars. I am currently researching the google calendar API to get this integrated.

I don’t have any local calendars within HA, so I can’t speak to how well it works for a local calendar at the moment. I could replicate a few events from my HA calendar, I suppose, to test with and see?

You could. but just wait ill get google working too

This is now working with Google. V1.1.9 should be good to go. download latest version of week-planner-card-plus to get google support.

2 Likes

Does anything extra need to be done beyond installing the latest version?

I have it but tapping a day doesn’t see, to do anything and attempting an edit on a Google calendar event fails:

image

I have the ICS Calendar tools integration installed too.

You might have installed v1.1.9a check hacs again should be v1.1.9 I reverted code but hacs might have kept the “a” version. Check hacs again and install v1.1.9. Sorry about that. 1.1.9 works trust me :slight_smile: maybe select different version from hacs download and manually pic 1.1.9 reinstall and it will work.

@Orange-GT3 Also edit is not supported on official google integration so it wont work in our calendar only Add and Delete are supported. Thats what version 1.1.9a was attempting to do is get editing event working for google but we cant even edit a google event in HA native app(local calendars we can actually edit, delete and add). so if you can Add and Delete google event that is where code is at current state. let me know if delete works and if it does that is at this point best we can do. i am working on getting edit for cloud based working and also adding the option for repeat events but this will be in version 2.0!

I checked and it was definitely 1.1.9 but I redownloaded it anyway.

OK, that’s good to know.

It does. I added a new event using the original ‘Add event’ button and when I clicked on it and hit ‘delete’, it got deleted.

Clicking on an empty part of the calendar does not trigger an ‘add’ though. I can see ‘add’ when I click on an existing event…

clicking empty “Day” should bring up that same add event dialog. maybe my add event script is different then yours? but even if that was case it should still open dialog on empty day.

Thank you for working with me on this and i apologize for the confusion its my first HACS contribution so im learning HACS too.

I’m relieved to know delete works for google! had me worried there for a min. This is a step in right direction and much improved from before. I will work on the edit feature on cloud based calendars but that might be something needing to be added to google integration itself but im looking into it.

My ‘add event’ button looks like this in the yaml:

type: horizontal-stack
cards:
  - type: custom:bubble-card
    card_type: button
    button_type: name
    card_layout: large
    name: Add Event
    icon: mdi:calendar-plus
    tap_action:
      action: navigate
      navigation_path: "#addcalendarevent"
    styles: >
      * { font-size: 1.05em !important; }

      ha-card { --bubble-main-background-color: #393745 !important; width:
      300px; }    

      .bubble-icon { --mdc-icon-size: 30px !important; color: snow !important;
      opacity: 1; }

      .bubble-icon-container { background: #393745 !important; display: flex; }

      .bubble-name { color: snow !important; opacity: 1; display: flex;
      line-height: 18px; flex-direction: row; justify-content: center;
      flex-grow: 1; margin: 0 40px 0 0; pointer-events: none; position:
      relative; overflow: hidden; }
    sub_button:
      main: []
      bottom: []
    button_action:
      tap_action:
        action: navigate
        navigation_path: "#addcalendarevent"

There isn’t anything remotely like that in the yaml where week-planner-card-plus is invoked.

No need to apologise. I can’t even code so what you are doing to improve the Skylight calendar implementation is awesome.

@Orange-GT3 In your dashboard.yaml(raw configuration) you did change card from week-planner-card to week-planner-card-plus right?