More webapp changes+fixes

2025-12-05 16:52:02 +01:00
parent c66cd0568f
commit 8e7a540c97
40 changed files with 1944 additions and 272 deletions
@@ -0,0 +1,111 @@
+<div class="page-content">
+  @if (loading()) {
+    <div class="loading-container">
+      <nz-spin nzSimple nzSize="large"></nz-spin>
+    </div>
+  } @else if (subscription()) {
+    <div class="detail-header">
+      <button nz-button (click)="goBack()">
+        <span nz-icon nzType="arrow-left" nzTheme="outline"></span>
+        Back to Subscriptions
+      </button>
+      <div class="header-actions">
+        @if (!subscription()!.confirmed && isOwner()) {
+          <button nz-button nzType="primary" (click)="acceptSubscription()">
+            <span nz-icon nzType="check"></span>
+            Accept
+          </button>
+        }
+        @if (subscription()!.confirmed && isOwner()) {
+          <button
+            nz-button
+            nz-popconfirm
+            nzPopconfirmTitle="Deactivate this subscription?"
+            (nzOnConfirm)="deactivateSubscription()"
+          >
+            <span nz-icon nzType="stop"></span>
+            Deactivate
+          </button>
+        }
+        <button
+          nz-button
+          nzDanger
+          nz-popconfirm
+          nzPopconfirmTitle="Are you sure you want to delete this subscription?"
+          (nzOnConfirm)="deleteSubscription()"
+        >
+          <span nz-icon nzType="delete"></span>
+          Delete
+        </button>
+      </div>
+    </div>
+
+    <nz-card>
+      <div class="subscription-header">
+        <h2 class="subscription-title">Subscription</h2>
+        <nz-tag [nzColor]="getTypeLabel().color">{{ getTypeLabel().label }}</nz-tag>
+        <nz-tag [nzColor]="getStatusInfo().color">{{ getStatusInfo().label }}</nz-tag>
+      </div>
+
+      <scn-metadata-grid>
+        <scn-metadata-value label="Subscription ID">
+          <span class="mono">{{ subscription()!.subscription_id }}</span>
+        </scn-metadata-value>
+        <scn-metadata-value label="Channel">
+          <a [routerLink]="['/channels', subscription()!.channel_id]" class="channel-link">
+            @if (resolvedChannel()) {
+              <div class="resolved-name">{{ resolvedChannel()!.displayName }}</div>
+            }
+            <div class="resolved-id mono">{{ subscription()!.channel_id }}</div>
+          </a>
+        </scn-metadata-value>
+        <scn-metadata-value label="Channel Internal Name">
+          <span>{{ subscription()!.channel_internal_name }}</span>
+        </scn-metadata-value>
+        <scn-metadata-value label="Subscriber">
+          @if (resolvedSubscriber()) {
+            <div class="resolved-name">{{ resolvedSubscriber()!.displayName }}</div>
+            <div class="resolved-id mono">{{ subscription()!.subscriber_user_id }}</div>
+          } @else {
+            <span class="mono">{{ subscription()!.subscriber_user_id }}</span>
+          }
+        </scn-metadata-value>
+        <scn-metadata-value label="Channel Owner">
+          @if (resolvedOwner()) {
+            <div class="resolved-name">{{ resolvedOwner()!.displayName }}</div>
+            <div class="resolved-id mono">{{ subscription()!.channel_owner_user_id }}</div>
+          } @else {
+            <span class="mono">{{ subscription()!.channel_owner_user_id }}</span>
+          }
+        </scn-metadata-value>
+        <scn-metadata-value label="Confirmed">
+          @if (subscription()!.confirmed) {
+            <nz-tag nzColor="green">Yes</nz-tag>
+          } @else {
+            <nz-tag nzColor="orange">No</nz-tag>
+          }
+        </scn-metadata-value>
+        <scn-metadata-value label="Active">
+          @if (subscription()!.active) {
+            <nz-tag nzColor="green">Yes</nz-tag>
+          } @else {
+            <nz-tag nzColor="red">No</nz-tag>
+          }
+        </scn-metadata-value>
+        <scn-metadata-value label="Created">
+          <div class="timestamp-absolute">{{ subscription()!.timestamp_created | date:'yyyy-MM-dd HH:mm:ss' }}</div>
+          <div class="timestamp-relative">{{ subscription()!.timestamp_created | relativeTime }}</div>
+        </scn-metadata-value>
+      </scn-metadata-grid>
+    </nz-card>
+  } @else {
+    <nz-card>
+      <div class="not-found">
+        <p>Subscription not found</p>
+        <button nz-button nzType="primary" (click)="goBack()">
+          Back to Subscriptions
+        </button>
+      </div>
+    </nz-card>
+  }
+</div>