(chore): Enable feature flag for Pro

src/app/modules/channel-container/channel-container.component.html

 <ng-container *ngIf="channel; else loader">
- <ng-container *ngIf="!channel.pro || isOwner || isAdmin; else isProChannel">
+ <ng-container
+ *ngIf="!proEnabled || !channel.pro || isOwner || isAdmin; else isProChannel"
+ >
  <m-channel #channelComponent></m-channel>
  </ng-container>
  <ng-template #isProChannel>

src/app/modules/channel-container/channel-container.component.ts

@@ -14,6 +14,7 @@ import { ChannelComponent } from '../channels/channel.component';
 import { ProChannelComponent } from '../pro/channel/channel.component';
 import { Session } from '../../services/session';
 import { SiteService } from '../../services/site.service';
+import { FeaturesService } from '../../services/features.service';
 
 @Component({
  selector: 'm-channel-container',
@@ -40,7 +41,8 @@ export class ChannelContainerComponent implements OnInit, OnDestroy {
  protected router: Router,
  protected client: Client,
  protected session: Session,
- protected site: SiteService
+ protected site: SiteService,
+ protected features: FeaturesService
  ) {}
 
  ngOnInit(): void {
@@ -81,15 +83,18 @@ export class ChannelContainerComponent implements OnInit, OnDestroy {
  const response: MindsChannelResponse = (await this.client.get(
  `api/v1/channel/${this.username}`
  )) as MindsChannelResponse;
+
  this.channel = response.channel;
 
- // NOTE: Temporary workaround until channel component supports children routes
- if (
+ const shouldRedirectToProHandler =
  !this.site.isProDomain &&
  this.channel.pro &&
  !this.isOwner &&
- !this.isAdmin
- ) {
+ !this.isAdmin &&
+ this.proEnabled;
+
+ // NOTE: Temporary workaround until channel component supports children routes
+ if (shouldRedirectToProHandler) {
  this.router.navigate(['/pro', this.channel.username], {
  replaceUrl: true,
  });
@@ -109,4 +114,8 @@ export class ChannelContainerComponent implements OnInit, OnDestroy {
  get isAdmin() {
  return this.site.isAdmin;
  }
+
+ get proEnabled() {
+ return this.features.has('pro');
+ }
 }

src/app/modules/channels/sidebar/sidebar.html

@@ -263,14 +263,16 @@
  </button>
  </div>
 
- <a
- *ngIf="false && showBecomeProButton"
- class="m-btn m-link-btn m-btn--with-icon m-btn--slim m-btn--action"
- routerLink="/pro"
- >
- <i class="material-icons">business_center</i>
- <span i18n>Become Pro</span>
- </a>
+ <ng-container *mIfFeature="'pro'">
+ <a
+ *ngIf="showBecomeProButton"
+ class="m-btn m-link-btn m-btn--with-icon m-btn--slim m-btn--action"
+ routerLink="/pro"
+ >
+ <i class="material-icons">business_center</i>
+ <span i18n>Become Pro</span>
+ </a>
+ </ng-container>
 
  <a
  *ngIf="showProSettings"

src/app/modules/newsfeed/newsfeed.component.html

@@ -126,16 +126,16 @@
  <span>Upgrade to Plus</span>
  </a>
 
- <a
- class="m-page--sidebar--navigation--item"
- routerLink="/pro"
- *ngIf="
- false && (session.isLoggedIn() && !session.getLoggedInUser().pro)
- "
- >
- <i class="material-icons">business_center</i>
- <span>Become Pro</span>
- </a>
+ <ng-container *mIfFeature="'pro'">
+ <a
+  class="m-page--sidebar--navigation--item"
+  routerLink="/pro"
+ *ngIf="session.isLoggedIn() && !session.getLoggedInUser().pro"
+ >
+  <i class="material-icons">business_center</i>
+  <span>Become Pro</span>
+ </a>
+ </ng-container>
 
  <a
  class="m-page--sidebar--navigation--item"