Start with the frontend for a change, skeleton so I can see it

2026-09-10 11:48:00 +00:00 · 2026-09-05 17:06:40 -07:00
parent 154a1932d8
commit 5f4ac876e4
5 changed files with 140 additions and 0 deletions
@@ -14,6 +14,7 @@ import { DocumentListComponent } from './components/document-list/document-list.
 import { DocumentAttributesComponent } from './components/manage/document-attributes/document-attributes.component'
 import { MailComponent } from './components/manage/mail/mail.component'
 import { SavedViewsComponent } from './components/manage/saved-views/saved-views.component'
+import { ShareLinksComponent } from './components/manage/share-links/share-links.component'
 import { WorkflowsComponent } from './components/manage/workflows/workflows.component'
 import { NotFoundComponent } from './components/not-found/not-found.component'
 import { DirtyDocGuard } from './guards/dirty-doc.guard'
@@ -310,6 +311,24 @@ export const routes: Routes = [
          componentName: 'SavedViewsComponent',
        },
      },
+      {
+        path: 'share-links',
+        component: ShareLinksComponent,
+        canActivate: [PermissionsGuard],
+        data: {
+          requiredPermissionAny: [
+            {
+              action: PermissionAction.View,
+              type: PermissionType.ShareLink,
+            },
+            {
+              action: PermissionAction.View,
+              type: PermissionType.ShareLinkBundle,
+            },
+          ],
+          componentName: 'ShareLinksComponent',
+        },
+      },
    ],
  },

@@ -244,6 +244,15 @@
                <i-bs class="me-2" name="window-stack"></i-bs><span class="nav-link-label"><ng-container i18n>Saved Views</ng-container></span>
              </a>
            </li>
+            @if (canManageShareLinks) {
+              <li class="nav-item app-link">
+                <a class="nav-link" routerLink="share-links" routerLinkActive="active" (click)="closeMenu()"
+                  ngbPopover="Share links" i18n-ngbPopover [disablePopover]="!slimSidebarPopoversEnabled" placement="end"
+                  container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
+                  <i-bs class="me-2" name="link"></i-bs><span class="nav-link-label"><ng-container i18n>Share links</ng-container></span>
+                </a>
+              </li>
+            }
            <li class="nav-item app-link"
              *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Workflow }"
              tourAnchor="tour.workflows">
@@ -221,6 +221,19 @@ export class AppFrameComponent
    return this.appTitleSetting() || environment.appTitle
  }

+  get canManageShareLinks(): boolean {
+    return (
+      this.permissionsService.currentUserCan(
+        PermissionAction.View,
+        PermissionType.ShareLink
+      ) ||
+      this.permissionsService.currentUserCan(
+        PermissionAction.View,
+        PermissionType.ShareLinkBundle
+      )
+    )
+  }
+
  get customAppTitle(): string {
    return this.appTitleSetting()
  }
@@ -0,0 +1,37 @@
+<pngx-page-header
+  title="Share links"
+  i18n-title
+  info="Manage public links to individual documents and document bundles."
+  i18n-info
+></pngx-page-header>
+
+<ul
+  ngbNav
+  #nav="ngbNav"
+  class="nav-tabs"
+  [activeId]="activeNavID()"
+  (activeIdChange)="selectTab($event)"
+>
+  @if (canViewDocumentLinks) {
+    <li [ngbNavItem]="ShareLinksNavIDs.DocumentLinks">
+      <button ngbNavLink i18n>Document links</button>
+      <ng-template ngbNavContent>
+        <div class="border border-top-0 rounded-bottom p-3 text-muted" i18n>
+          Manage links to individual documents here.
+        </div>
+      </ng-template>
+    </li>
+  }
+  @if (canViewBundles) {
+    <li [ngbNavItem]="ShareLinksNavIDs.Bundles">
+      <button ngbNavLink i18n>Bundles</button>
+      <ng-template ngbNavContent>
+        <div class="border border-top-0 rounded-bottom p-3 text-muted" i18n>
+          Manage share link bundles here.
+        </div>
+      </ng-template>
+    </li>
+  }
+</ul>
+
+<div [ngbNavOutlet]="nav"></div>
@@ -0,0 +1,62 @@
+import { Component, inject, signal } from '@angular/core'
+import { ActivatedRoute, Router } from '@angular/router'
+import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap'
+import {
+  PermissionAction,
+  PermissionsService,
+  PermissionType,
+} from 'src/app/services/permissions.service'
+import { PageHeaderComponent } from '../../common/page-header/page-header.component'
+
+export enum ShareLinksNavIDs {
+  DocumentLinks = 'documents',
+  Bundles = 'bundles',
+}
+
+@Component({
+  selector: 'pngx-share-links',
+  templateUrl: './share-links.component.html',
+  imports: [NgbNavModule, PageHeaderComponent],
+})
+export class ShareLinksComponent {
+  private readonly route = inject(ActivatedRoute)
+  private readonly router = inject(Router)
+  private readonly permissionsService = inject(PermissionsService)
+
+  readonly ShareLinksNavIDs = ShareLinksNavIDs
+  readonly activeNavID = signal(this.getInitialNavID())
+
+  get canViewDocumentLinks(): boolean {
+    return this.permissionsService.currentUserCan(
+      PermissionAction.View,
+      PermissionType.ShareLink
+    )
+  }
+
+  get canViewBundles(): boolean {
+    return this.permissionsService.currentUserCan(
+      PermissionAction.View,
+      PermissionType.ShareLinkBundle
+    )
+  }
+
+  selectTab(tab: ShareLinksNavIDs): void {
+    this.activeNavID.set(tab)
+    void this.router.navigate([], {
+      relativeTo: this.route,
+      queryParams: { type: tab },
+      queryParamsHandling: 'merge',
+    })
+  }
+
+  private getInitialNavID(): ShareLinksNavIDs {
+    const requestedTab = this.route.snapshot.queryParamMap.get('type')
+    if (requestedTab === ShareLinksNavIDs.Bundles && this.canViewBundles) {
+      return ShareLinksNavIDs.Bundles
+    }
+    if (this.canViewDocumentLinks) {
+      return ShareLinksNavIDs.DocumentLinks
+    }
+    return ShareLinksNavIDs.Bundles
+  }
+}