feat: features

Author: meta-d

apps/cloud/src/app/@core/services/feature/feature.service.ts

@@ -19,7 +19,7 @@ export class FeatureService {
 	constructor(private http: HttpClient) {}
 
 	getFeatureToggleDefinition() {
-		return this.http.get(`${this.API_URL}/definition`).toPromise();
+		return this.http.get<IFeature[]>(`${this.API_URL}/definition`)
 	}
 
 	getParentFeatures(

apps/cloud/src/app/@shared/feature-toggle/feature-toggle.component.html

@@ -13,7 +13,7 @@
 		<mat-slide-toggle class="inline-flex" [checked]="enabledFeature(feature)" (change)="featureChanged($event.checked, feature)"></mat-slide-toggle>
 	  </mat-expansion-panel-header>
 
-	@if (feature?.children.length > 0) {
+	@if (feature.children?.length > 0) {
 	  <mat-list displayDensity="cosy">
 		@for (child of feature.children; track child.code) {
 		  <mat-list-item>
@@ -30,3 +30,9 @@
 	</mat-expansion-panel>
   }
 </mat-accordion>
+
+@if (loading()) {
+  <div class="absolute left-0 top-0 w-full h-full flex justify-center items-center">
+	<mat-progress-spinner [mode]="'indeterminate'" [diameter]="22" color="accent" />
+  </div>
+}

apps/cloud/src/app/@shared/feature-toggle/feature-toggle.component.ts

@@ -1,11 +1,13 @@
-import { Component, DestroyRef, OnInit, inject } from '@angular/core'
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop'
+import { Component, DestroyRef, effect, inject, signal } from '@angular/core'
+import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop'
 import { MatDialog } from '@angular/material/dialog'
 import { ActivatedRoute } from '@angular/router'
-import { IFeature, IFeatureOrganization, IFeatureToggle } from '@metad/contracts'
+import { IFeature, IFeatureOrganization } from '@metad/contracts'
 import { NgmCountdownConfirmationComponent } from '@metad/ocap-angular/common'
-import { combineLatest, firstValueFrom, of } from 'rxjs'
-import { distinctUntilChanged, map, shareReplay, startWith, switchMap, tap, withLatestFrom } from 'rxjs/operators'
+import { derivedFrom } from 'ngxtension/derived-from'
+import { injectRouteData } from 'ngxtension/inject-route-data'
+import { of, pipe } from 'rxjs'
+import { map, switchMap, tap } from 'rxjs/operators'
 import { environment } from '../../../environments/environment'
 import { FeatureService, FeatureStoreService, Store } from '../../@core/services'
 import { TranslationBaseComponent } from '../language/translation-base.component'
@@ -15,53 +17,62 @@ import { TranslationBaseComponent } from '../language/translation-base.component
   templateUrl: './feature-toggle.component.html',
   styleUrls: ['./feature-toggle.component.scss']
 })
-export class FeatureToggleComponent extends TranslationBaseComponent implements OnInit {
+export class FeatureToggleComponent extends TranslationBaseComponent {
   private readonly _activatedRoute = inject(ActivatedRoute)
   private readonly _featureService = inject(FeatureService)
   private readonly _featureStoreService = inject(FeatureStoreService)
   private readonly _storeService = inject(Store)
   private readonly _matDialog = inject(MatDialog)
   readonly destroyRef = inject(DestroyRef)
 
-  loading = false
-  featureToggles = []
-  featureTogglesDefinitions: IFeatureToggle[] = []
+  readonly isOrganization = injectRouteData('isOrganization')
 
-  public readonly isOrganization$ = this._activatedRoute.data.pipe(
-    startWith(this._activatedRoute.snapshot.data),
-    map((data) => data?.isOrganization),
-    distinctUntilChanged(),
-    takeUntilDestroyed(),
-    shareReplay(1)
-  )
-  public readonly organization$ = this._storeService.selectedOrganization$
+  // loading = false
+  readonly loading = signal(false)
+  readonly featureToggles = signal([])
+  // featureTogglesDefinitions: IFeatureToggle[] = []
+
+  // public readonly isOrganization$ = this._activatedRoute.data.pipe(
+  //   startWith(this._activatedRoute.snapshot.data),
+  //   map((data) => data?.isOrganization),
+  //   distinctUntilChanged(),
+  //   takeUntilDestroyed(),
+  //   shareReplay(1)
+  // )
+  readonly organization = toSignal(this._storeService.selectedOrganization$)
 
-  public readonly features$ = this._featureService.getParentFeatures(['children']).pipe(
+  readonly features$ = this._featureService.getParentFeatures(['children']).pipe(
     map(({ items }) => items),
   )
-
-  public readonly featureTenant$ = this._storeService.featureTenant$
-
-  public readonly featureOrganizations$ = this.isOrganization$.pipe(
-    switchMap((isOrganization) => (isOrganization ? this.organization$ : of(null))),
-    switchMap((organization) => {
-      const request = {}
-      if (organization) {
-        request['organizationId'] = organization.id
-      }
-      return this._featureStoreService.loadFeatureOrganizations(['feature'], request).pipe(map(({ items }) => items))
-    }),
-    takeUntilDestroyed(),
-    shareReplay(1)
+  // readonly features$ = this._featureService.getFeatureToggleDefinition()
+
+  readonly featureTenant = toSignal(this._storeService.featureTenant$)
+
+  readonly featureOrganizations = derivedFrom(
+    [this.isOrganization],
+    pipe(
+      switchMap(([isOrganization]) => (isOrganization ? this._storeService.selectedOrganization$ : of(null))),
+      switchMap((organization) => {
+        const request = {}
+        if (organization) {
+          request['organizationId'] = organization.id
+        }
+        return this._featureStoreService.loadFeatureOrganizations(['feature'], request).pipe(map(({ items }) => items))
+      })
+    ),
+    { initialValue: [] }
   )
 
-  ngOnInit(): void {
-    combineLatest([this.featureTenant$, this.featureOrganizations$])
-      .pipe(
-        withLatestFrom(combineLatest([this.isOrganization$, this.organization$])),
-        takeUntilDestroyed(this.destroyRef)
-      )
-      .subscribe(([[featureTenant, featureOrganizations], [isOrganization, organization]]) => {
+  constructor() {
+    super()
+
+    this.loading.set(true)
+    effect(
+      () => {
+        const isOrganization = this.isOrganization()
+        const organization = this.organization()
+        const featureTenant = this.featureTenant()
+        const featureOrganizations = this.featureOrganizations()
         if (isOrganization && organization) {
           this._storeService.featureOrganizations = featureOrganizations
         }
@@ -77,75 +88,92 @@ export class FeatureToggleComponent extends TranslationBaseComponent implements
           }
         })
 
-        this.featureToggles = featureToggles
+        this.featureToggles.set(featureToggles)
+        console.log(featureToggles)
 
-        this.loading = false
-      })
-
-    this._storeService.featureToggles$
-      .pipe(
-        tap((toggles) => (this.featureTogglesDefinitions = toggles)),
-        takeUntilDestroyed(this.destroyRef)
-      )
-      .subscribe()
+        this.loading.set(false)
+      },
+      { allowSignalWrites: true }
+    )
   }
 
+  // ngOnInit(): void {
+
+  //   combineLatest([this.featureTenant$, this.featureOrganizations$])
+  //     .pipe(
+  //       withLatestFrom(combineLatest([this.isOrganization$, this.organization$])),
+  //       takeUntilDestroyed(this.destroyRef)
+  //     )
+  //     .subscribe(([[featureTenant, featureOrganizations], [isOrganization, organization]]) => {
+
+  //     })
+
+  //   this._storeService.featureToggles$
+  //     .pipe(
+  //       tap((toggles) => (this.featureTogglesDefinitions = toggles)),
+  //       takeUntilDestroyed(this.destroyRef)
+  //     )
+  //     .subscribe()
+  // }
+
   getFeatures() {
     this._featureStoreService.loadFeatures(['children']).pipe(takeUntilDestroyed(this.destroyRef)).subscribe()
   }
 
   async featureChanged(isEnabled: boolean, feature: IFeature) {
-    const result = await firstValueFrom(
-      this._matDialog
-        .open(NgmCountdownConfirmationComponent, {
-          data: {
-            recordType: feature.description,
-            isEnabled: isEnabled
+    this._matDialog
+      .open(NgmCountdownConfirmationComponent, {
+        data: {
+          recordType: feature.description,
+          isEnabled: isEnabled
+        }
+      })
+      .afterClosed()
+      .pipe(
+        switchMap((result) => {
+          if (result) {
+            return this.emitFeatureToggle({ feature, isEnabled: !!isEnabled })
           }
         })
-        .afterClosed()
-    )
-
-    if (result) {
-      await this.emitFeatureToggle({ feature, isEnabled: !!isEnabled })
-    } else {
-      if (!environment.IS_ELECTRON) {
-        window.location.reload()
-      }
-    }
+      )
+      .subscribe()
   }
 
-  async emitFeatureToggle({ feature, isEnabled }: { feature: IFeature; isEnabled: boolean }) {
-    const isOrganization = await firstValueFrom(this.isOrganization$)
-    const organization = await firstValueFrom(this.organization$)
+  emitFeatureToggle({ feature, isEnabled }: { feature: IFeature; isEnabled: boolean }) {
+    const isOrganization = this.isOrganization()
+    const organization = this.organization()
     const { id: featureId } = feature
     const request = {
       featureId,
+      feature,
       isEnabled
     }
     if (organization && isOrganization) {
       const { id: organizationId } = organization
       request['organizationId'] = organizationId
     }
-    await firstValueFrom(this._featureStoreService.changedFeature(request))
-    if (!environment.IS_ELECTRON) {
-      window.location.reload()
-    }
+    return this._featureStoreService.changedFeature(request).pipe(
+      tap(() => {
+        if (!environment.IS_ELECTRON) {
+          window.location.reload()
+        }
+      })
+    )
   }
 
   enabledFeature(row: IFeature) {
-    const featureOrganization = this.featureToggles.find(
-      (featureOrganization: IFeatureOrganization) => featureOrganization.featureId === row.id
+    const featureOrganization = this.featureToggles().find(
+      (featureOrganization: IFeatureOrganization) => featureOrganization.feature.code === row.code
     )
-    if (featureOrganization && featureOrganization.isEnabled === false) {
+    if (featureOrganization) {
       return featureOrganization.isEnabled
     }
 
-    const featureToggle = this.featureTogglesDefinitions.find((item: IFeatureToggle) => item.name == row.code)
-    if (featureToggle) {
-      return featureToggle.enabled
-    }
+    // const featureToggle = this.featureTogglesDefinitions.find((item: IFeatureToggle) => item.code == row.code)
+    // if (featureToggle) {
+    //   return featureToggle.enabled
+    // }
 
-    return true
+    return false
   }
 }

apps/cloud/src/app/features/chat/chat-input/chat-input.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common'
-import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core'
+import { ChangeDetectionStrategy, Component, effect, inject, signal } from '@angular/core'
 import { toSignal } from '@angular/core/rxjs-interop'
 import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms'
 import { RouterModule } from '@angular/router'
@@ -34,6 +34,12 @@ export class ChatInputComponent {
   readonly prompt = toSignal(this.promptControl.valueChanges)
   readonly answering = this.chatService.answering
 
+  constructor() {
+    effect(() => {
+      this.answering() ? this.promptControl.disable() : this.promptControl.enable()
+    })
+  }
+
   send() {
     this.ask(this.prompt().trim())
   }

apps/cloud/src/app/features/chatbi/copilot/schema.ts

@@ -5,7 +5,8 @@ import {
   DataSettingsSchema,
   OrderBySchema,
   SlicerSchema,
-  TimeSlicerSchema
+  TimeSlicerSchema,
+  VariableSchema
 } from '@metad/ocap-core'
 import { EChartsOptions } from '@metad/story/story'
 import { z } from 'zod'
@@ -31,6 +32,6 @@ export const ChatAnswerSchema = z.object({
   top: z.number().optional().describe('The number of top members'),
   slicers: z.array(SlicerSchema).optional().describe('The slicers to filter data'),
   timeSlicers: z.array(TimeSlicerSchema).optional().describe('The time slicers to filter data'),
-  variables: z.array(SlicerSchema).optional().describe('The variables to the query of cube'),
+  variables: z.array(VariableSchema).optional().describe('The variables to the query of cube'),
   questions: z.array(z.string().describe('More suggestion prompts, 3 will be enough.')).describe(`Give user more question prompts about how to drilldown other dimensions or one of dimension members, for examples: '分析<某维度1>成员<xxx>在<某维度2>上的<度量>分布'`)
 })