Cute little expired badge

src-ui/src/app/components/manage/share-links/share-link-bundle-list/share-link-bundle-list.component.html

@@ -80,6 +80,9 @@
                 <td>
                   @if (bundle.expiration) {
                     {{ bundle.expiration | date: 'short' }}
+                    @if (isExpired(bundle.expiration)) {
+                      <span class="badge text-bg-danger ms-2" i18n>Expired</span>
+                    }
                   }
                   @if (!bundle.expiration) {
                     <span i18n>Never</span>

src-ui/src/app/components/manage/share-links/share-link-bundle-list/share-link-bundle-list.component.spec.ts

@@ -123,6 +123,19 @@ describe('ShareLinkBundleListComponent', () => {
     expect(service.list).toHaveBeenLastCalledWith(2, 25, 'created', true)
   })
 
+  it('marks expired share link bundles', () => {
+    service.list.mockReturnValue(
+      of({
+        count: 1,
+        results: [sampleBundle({ expiration: '2000-01-01T00:00:00.000Z' })],
+      })
+    )
+
+    fixture.detectChanges()
+
+    expect(fixture.nativeElement.textContent).toContain('Expired')
+  })
+
   it('stores a changed page size and reloads from the first page', () => {
     fixture.detectChanges()
     const settingsService = TestBed.inject(SettingsService)

src-ui/src/app/components/manage/share-links/share-link-bundle-list/share-link-bundle-list.component.ts

@@ -195,6 +195,10 @@ export class ShareLinkBundleListComponent
     return SHARE_LINK_BUNDLE_FILE_VERSION_LABELS[version] ?? version
   }
 
+  isExpired(expiration?: string): boolean {
+    return !!expiration && Date.parse(expiration) <= Date.now()
+  }
+
   private replaceBundle(updated: ShareLinkBundleSummary): void {
     const bundles = this.bundles()
     const index = bundles.findIndex((bundle) => bundle.id === updated.id)

src-ui/src/app/components/manage/share-links/share-link-list/share-link-list.component.html

@@ -36,6 +36,9 @@
               <td>
                 @if (link.expiration) {
                   {{ link.expiration | date: 'short' }}
+                  @if (isExpired(link.expiration)) {
+                    <span class="badge text-bg-danger ms-2" i18n>Expired</span>
+                  }
                 } @else {
                   <span i18n>Never</span>
                 }

src-ui/src/app/components/manage/share-links/share-link-list/share-link-list.component.spec.ts

@@ -75,6 +75,24 @@ describe('ShareLinkListComponent', () => {
     expect(service.list).toHaveBeenLastCalledWith(2, 25, 'created', true)
   })
 
+  it('marks expired share links', () => {
+    service.list.mockReturnValue(
+      of({
+        count: 1,
+        results: [
+          {
+            ...link,
+            expiration: '2000-01-01T00:00:00.000Z',
+          },
+        ],
+      })
+    )
+
+    fixture.detectChanges()
+
+    expect(fixture.nativeElement.textContent).toContain('Expired')
+  })
+
   it('stores a changed page size and reloads from the first page', () => {
     const settingsService = TestBed.inject(SettingsService)
     jest.spyOn(settingsService, 'get').mockReturnValueOnce({ share_links: 25 })

src-ui/src/app/components/manage/share-links/share-link-list/share-link-list.component.ts

@@ -120,6 +120,10 @@ export class ShareLinkListComponent
     return SHARE_LINK_BUNDLE_FILE_VERSION_LABELS[version] ?? version
   }
 
+  isExpired(expiration?: string): boolean {
+    return !!expiration && Date.parse(expiration) <= Date.now()
+  }
+
   copy(link: ShareLink): void {
     if (this.clipboard.copy(this.getShareUrl(link))) {
       this.copiedID.set(link.id)