fix(settings): show the locked-groups row on the M3U rail and roll the relock timeout back to the recovered value

- The M3U groups rail now renders the same "N locked · Enter PIN to show"
  row as the portal category rail, so locked groups no longer vanish
  without an in-context unlock.
- A failed relock-timeout write rolls back to the value read after the
  settings retry, not to the pre-retry default.

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

libs/ui/components/src/lib/channel-list-container/channel-list-container.component.html

@@ -63,6 +63,7 @@
                 [favoriteIds]="favoriteIds()"
                 [hiddenGroupTitles]="hiddenGroupTitles()"
                 [lockedGroupTitles]="lockedGroupTitles()"
+                [withheldGroupCount]="withheldGroupCount()"
                 [managementGroups]="managementGroups()"
                 [sidebarWidth]="sidebarWidth()"
                 (channelSelected)="onChannelSelected($event)"

libs/ui/components/src/lib/channel-list-container/channel-list-container.component.ts

@@ -340,6 +340,20 @@ export class ChannelListContainerComponent implements OnInit, OnDestroy {
         }
         return this.parentalLock.lockedGroupTitles(playlistId);
     });
+    /**
+     * Groups of this playlist the lock currently withholds; the groups rail
+     * shows one "N locked · Enter PIN to show" row for them, as the portal
+     * category rail does.
+     */
+    readonly withheldGroupCount = computed(() => {
+        const withheld = this.withheldGroupTitles();
+        if (withheld.size === 0) {
+            return 0;
+        }
+        return this.managementGroups().filter((group) =>
+            withheld.has(group.key)
+        ).length;
+    });
     /** Group titles currently withheld: locked AND the lock is active. */
     private readonly withheldGroupTitles = computed(() => {
         this.parentalLock.version();

libs/ui/components/src/lib/channel-list-container/groups-view/groups-view.component.html

@@ -170,6 +170,29 @@
                             }
                         </div>
                     }
+                    @if (withheldGroupCount() > 0) {
+                        <button
+                            type="button"
+                            class="groups-locked-row"
+                            data-test-id="groups-locked-row"
+                            (click)="requestParentalUnlock()"
+                            [attr.aria-label]="
+                                'PARENTAL_LOCK.UNLOCK_TO_SHOW' | translate
+                            "
+                        >
+                            <mat-icon>lock</mat-icon>
+                            <span class="groups-locked-row__label">
+                                {{
+                                    'PARENTAL_LOCK.LOCKED_CATEGORIES_ROW'
+                                        | translate
+                                            : { count: withheldGroupCount() }
+                                }}
+                            </span>
+                            <span class="groups-locked-row__hint">
+                                {{ 'PARENTAL_LOCK.UNLOCK_TO_SHOW' | translate }}
+                            </span>
+                        </button>
+                    }
                 </div>
             </div>
         </aside>

libs/ui/components/src/lib/channel-list-container/groups-view/groups-view.component.scss

@@ -327,3 +327,50 @@
         padding-inline-end: 0;
     }
 }
+
+// Same affordance as the portal category rail's locked row: the parent
+// sees that groups are withheld and can unlock from here.
+.groups-locked-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    width: 100%;
+    margin-top: 4px;
+    padding: 8px 12px;
+    border: 1px dashed var(--mat-sys-outline-variant);
+    border-radius: 10px;
+    background: transparent;
+    color: var(--mat-sys-on-surface-variant);
+    font: inherit;
+    font-size: 0.8125rem;
+    text-align: left;
+    cursor: pointer;
+
+    &:hover,
+    &:focus-visible {
+        background: var(--mat-sys-surface-container);
+        color: var(--mat-sys-on-surface);
+        outline: none;
+    }
+
+    mat-icon {
+        font-size: 18px;
+        width: 18px;
+        height: 18px;
+        flex-shrink: 0;
+    }
+
+    &__label {
+        flex: 1;
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
+
+    &__hint {
+        font-size: 0.6875rem;
+        opacity: 0.8;
+        white-space: nowrap;
+    }
+}

libs/ui/components/src/lib/channel-list-container/groups-view/groups-view.component.spec.ts

@@ -565,6 +565,21 @@ describe('GroupsViewComponent', () => {
         expect(groupLockToggled).toHaveBeenCalledTimes(2);
     });
 
+    it('shows the locked-groups row while groups are withheld and unlocks from it', async () => {
+        const row = () =>
+            fixture.nativeElement.querySelector(
+                '[data-test-id="groups-locked-row"]'
+            ) as HTMLButtonElement | null;
+        expect(row()).toBeNull();
+
+        fixture.componentRef.setInput('withheldGroupCount', 2);
+        fixture.detectChanges();
+        expect(row()).not.toBeNull();
+
+        row()?.click();
+        expect(parentalLock.requestUnlock).toHaveBeenCalled();
+    });
+
     it('offers no group lock menu while the feature is off', () => {
         const event = new MouseEvent('contextmenu', { cancelable: true });
         component.onGroupContextMenu('Sports', event);

libs/ui/components/src/lib/channel-list-container/groups-view/groups-view.component.ts

@@ -157,6 +157,8 @@ export class GroupsViewComponent {
     readonly managementGroups = input<GroupManagementDialogGroup[] | null>(
         null
     );
+    /** Groups the active lock withholds; > 0 renders the unlock row. */
+    readonly withheldGroupCount = input(0);
 
     /** Current outer sidebar width */
     readonly sidebarWidth = input<number | null>(null);
@@ -523,6 +525,10 @@ export class GroupsViewComponent {
         this.groupLockToggled.emit({ groupKey, locked: lock });
     }
 
+    async requestParentalUnlock(): Promise<void> {
+        await this.parentalLock.requestUnlock();
+    }
+
     async openGroupManagement(): Promise<void> {
         // The dialog lists every group by name, locked ones included, and can
         // rewrite the locks — so it sits behind the PIN like the portal