feat: a calendar to subscribe to, and the backlog's corners

- Each person can subscribe their dates in Google Calendar, Outlook or
  Apple Calendar: GET /api/calendar/{token}.ics (no session) brings
  their unfinished tickets with a due date (assigned or followed), the
  planned and running sprints and the planned releases of their
  projects, as all-day events linking to the web. The token is made,
  renewed or dropped under /me/calendar (and in GraphQL); in the web,
  from «Calendario» in «Mi trabajo».
- The backlog panel keeps the selected rows' background inside its
  rounded corners.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

libs/web/tracker/presenters/src/lib/pages/backlog.page.ts

@@ -178,6 +178,8 @@ import { initials, PRIORITY, statusLook, typeLook } from '../ui/copy';
       margin: 0;
       padding: 0.25rem 0;
       list-style: none;
+      /* Selected rows have a background: kept inside the rounded corners. */
+      overflow: hidden;
     }
     .ts-backlog__row {
       display: grid;

libs/web/tracker/presenters/src/lib/pages/my-work.ts

@@ -6,9 +6,12 @@ import {
   DOCUMENT,
   inject,
   OnInit,
+  TemplateRef,
+  viewChild,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
 import { PiIconComponent, PiSkeletonComponent } from '@pi/ui';
+import { DrawerService } from '@task-stream/web/shared/ui';
 import {
   HomeFacade,
   ProjectsFacade,
@@ -28,6 +31,7 @@ import {
   statusLook,
   typeLook,
 } from '../ui/copy';
+import { CalendarFeedComponent } from '../ui/calendar-feed';
 
 const VISIBLE = 12;
 
@@ -40,7 +44,12 @@ const VISIBLE = 12;
 @Component({
   selector: 'ts-my-work',
   changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [RouterLink, PiIconComponent, PiSkeletonComponent],
+  imports: [
+    RouterLink,
+    PiIconComponent,
+    PiSkeletonComponent,
+    CalendarFeedComponent,
+  ],
   template: `
     @if (!home.loaded()) {
       <div class="ts-work">
@@ -58,6 +67,14 @@ const VISIBLE = 12;
             <span class="ts-muted ts-mono"
               >{{ home.mineTotal() }} abiertos</span
             >
+            <button
+              type="button"
+              class="ts-plain-link ts-work__calendar"
+              (click)="openCalendar()"
+            >
+              <pi-icon icon="calendar" size="x-small" aria-hidden="true" />
+              Calendario
+            </button>
           </header>
           @if (home.qaFailed()) {
             <p class="ts-work__alert" role="status">
@@ -228,6 +245,9 @@ const VISIBLE = 12;
         </div>
       </div>
     }
+    <ng-template #calendarPanel>
+      <ts-calendar-feed />
+    </ng-template>
   `,
   styles: `
     :host {
@@ -250,14 +270,20 @@ const VISIBLE = 12;
     .ts-work__panel {
       padding: 1.375rem 1.5rem 1.25rem;
     }
+    .ts-work__calendar {
+      display: inline-flex;
+      gap: 0.25rem;
+      align-items: center;
+      font-size: 0.875rem;
+    }
     .ts-work__head {
       display: flex;
       align-items: baseline;
-      justify-content: space-between;
       gap: 1rem;
       margin-bottom: 0.875rem;
       h2 {
-        margin: 0;
+        /* Pushes the count and the calendar link to the right. */
+        margin: 0 auto 0 0;
         font-size: 1.125rem;
         font-weight: 700;
       }
@@ -415,6 +441,9 @@ const VISIBLE = 12;
 })
 export class MyWorkComponent implements OnInit {
   protected readonly home = inject(HomeFacade);
+  private readonly drawer = inject(DrawerService);
+  private readonly calendarPanel =
+    viewChild.required<TemplateRef<unknown>>('calendarPanel');
   private readonly projects = inject(ProjectsFacade);
   private readonly document = inject(DOCUMENT);
   private readonly destroyRef = inject(DestroyRef);
@@ -483,4 +512,8 @@ export class MyWorkComponent implements OnInit {
       release.projectId
     );
   }
+
+  protected openCalendar(): void {
+    this.drawer.open('Tu calendario', this.calendarPanel());
+  }
 }