Button still says "subscribe" after subscription - 4195

Author: guillermo2519

src/app/shared/menu/providers/comcol-subscribe.menu.ts

@@ -7,16 +7,24 @@
  */
 import { Injectable } from '@angular/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { TranslateService } from '@ngx-translate/core';
 import {
   combineLatest,
   Observable,
+  Subject,
 } from 'rxjs';
-import { map } from 'rxjs/operators';
+import {
+  map,
+  startWith,
+  switchMap,
+} from 'rxjs/operators';
+import { AuthService } from 'src/app/core/auth/auth.service';
 
 import { AuthorizationDataService } from '../../../core/data/feature-authorization/authorization-data.service';
 import { FeatureID } from '../../../core/data/feature-authorization/feature-id';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { SubscriptionModalComponent } from '../../subscriptions/subscription-modal/subscription-modal.component';
+import { SubscriptionsDataService } from '../../subscriptions/subscriptions-data.service';
 import { OnClickMenuItemModel } from '../menu-item/models/onclick.model';
 import { MenuItemType } from '../menu-item-type.model';
 import { PartialMenuSection } from '../menu-provider.model';
@@ -27,33 +35,64 @@ import { DSpaceObjectPageMenuProvider } from './helper-providers/dso.menu';
  */
 @Injectable()
 export class SubscribeMenuProvider extends DSpaceObjectPageMenuProvider {
+
+  private refresh$ = new Subject<void>();
+
   constructor(
+    protected authService: AuthService,
     protected authorizationService: AuthorizationDataService,
+    protected subscriptionService: SubscriptionsDataService,
     protected modalService: NgbModal,
+    protected translateService: TranslateService,
   ) {
     super();
   }
 
   public getSectionsForContext(dso: DSpaceObject): Observable<PartialMenuSection[]> {
-    return combineLatest([
-      this.authorizationService.isAuthorized(FeatureID.CanSubscribe, dso.self),
-    ]).pipe(
-      map(([canSubscribe]) => {
-        return [
-          {
-            visible: canSubscribe,
-            model: {
-              type: MenuItemType.ONCLICK,
-              text: 'subscriptions.tooltip',
-              function: () => {
-                const modalRef = this.modalService.open(SubscriptionModalComponent);
-                modalRef.componentInstance.dso = dso;
+    return this.refresh$.pipe(
+      startWith(undefined),
+      switchMap(() =>
+        combineLatest([
+          this.authorizationService.isAuthorized(FeatureID.CanSubscribe, dso.self),
+          this.authService.getAuthenticatedUserFromStore(),
+        ]),
+      ),
+      switchMap(([canSubscribe, user]) =>
+        this.subscriptionService.getSubscriptionsByPersonDSO(user.id, dso.uuid).pipe(
+          map((subscriptionRD) => {
+            const subscription = subscriptionRD.payload?.page[0];
+            const isSubscribed = subscription != null;
+            const key = isSubscribed
+              ? 'subscriptions.unsubscribe'
+              : 'subscriptions.tooltip';
+            return [
+              {
+                visible: canSubscribe,
+                model: {
+                  type: MenuItemType.ONCLICK,
+                  text: key,
+                  function: () => {
+                    if (isSubscribed) {
+                      this.subscriptionService.deleteSubscription(subscription.id).subscribe(() => {
+                        this.refresh$.next();
+                      });
+                    } else {
+                      const modalRef = this.modalService.open(SubscriptionModalComponent);
+                      modalRef.componentInstance.dso = dso;
+                      modalRef.componentInstance.updated.subscribe(() => {
+                        this.refresh$.next();
+                      });
+                      modalRef.closed.subscribe(() => {
+                      });
+                    }
+                  },
+                } as OnClickMenuItemModel,
+                icon: 'bell',
               },
-            } as OnClickMenuItemModel,
-            icon: 'bell',
-          },
-        ] as PartialMenuSection[];
-      }),
+            ] as PartialMenuSection[];
+          }),
+        ),
+      ),
     );
   }
 }

src/app/shared/subscriptions/subscription-modal/subscription-modal.component.ts

@@ -122,6 +122,8 @@ export class SubscriptionModalComponent implements OnInit {
    */
   @Output() updateSubscription: EventEmitter<Subscription> = new EventEmitter<Subscription>();
 
+  @Output() updated = new EventEmitter<void>();
+
   constructor(
     private formBuilder: UntypedFormBuilder,
     private modalService: NgbModal,
@@ -292,7 +294,8 @@ export class SubscriptionModalComponent implements OnInit {
     }
 
     combineLatest([...toBeProcessed]).subscribe((res) => {
-      this.activeModal.close();
+      this.updated.emit();
+      this.activeModal.close('updated');
     });
 
   }