ci: hide dropbox token

.github/workflows/deploy.yml

@@ -15,3 +15,5 @@ jobs:
       - uses: 69pmb/deploy/workflow/deploy@main
         with:
           url: ${{ secrets.DEPLOY_URL }}
+          args: 'DROPBOX_TOKEN,${{ secrets.DROPBOX_TOKEN }}'
+          confFile: '/usr/share/nginx/html/assets/configuration.json'

.gitignore

@@ -34,6 +34,7 @@
 npm-debug.log
 testem.log
 /typings
+src/assets/configuration.json
 
 # e2e
 /e2e/*.js

src/app/services/configuration.service.ts

@@ -0,0 +1,30 @@
+import {Injectable} from '@angular/core';
+import {from, Observable, of} from 'rxjs';
+import {tap} from 'rxjs/operators';
+
+export type Configuration = Record<'token', string>;
+
+@Injectable({
+  providedIn: 'root',
+})
+export class ConfigurationService {
+  configuration!: Configuration;
+
+  load(): Observable<Configuration> {
+    return this.configuration
+      ? of(this.configuration)
+      : from(fetch('./assets/configuration.json').then(res => res.json())).pipe(
+          tap((configuration: Configuration) => {
+            this.configuration = configuration;
+          })
+        );
+  }
+
+  get(): Configuration {
+    if (this.configuration) {
+      return this.configuration;
+    } else {
+      throw new Error('Configuration is not loaded');
+    }
+  }
+}

src/app/services/dropbox.service.ts

@@ -4,18 +4,22 @@ import {UtilsService} from './utils.service';
 import {Dropbox as DropboxConstant} from '@utils/dropbox';
 import {Observable, catchError, from, map, of, switchMap} from 'rxjs';
 import {Reactive} from '../utils/reactive';
+import {ConfigurationService} from './configuration.service';
 
 @Injectable({providedIn: 'root'})
 export class DropboxService {
   files = new Reactive<files.ListFolderResult | undefined>();
 
-  constructor(private serviceUtils: UtilsService) {
+  constructor(
+    private serviceUtils: UtilsService,
+    private configurationService: ConfigurationService
+  ) {
     this.listFiles().subscribe(f => this.files.set(f));
   }
 
-  static getDbx(): Dropbox {
+  getDbx(): Dropbox {
     return new Dropbox({
-      accessToken: DropboxConstant.DROPBOX_TOKEN,
+      accessToken: this.configurationService.get().token,
     });
   }
 
@@ -25,7 +29,7 @@ export class DropboxService {
 
   private listFiles(): Observable<files.ListFolderResult | undefined> {
     return from(
-      DropboxService.getDbx().filesListFolder({
+      this.getDbx().filesListFolder({
         path: DropboxConstant.DROPBOX_FOLDER,
       })
     ).pipe(
@@ -47,7 +51,7 @@ export class DropboxService {
 
   downloadFile(fileName: string): Observable<string> {
     return from(
-      DropboxService.getDbx().filesDownload({
+      this.getDbx().filesDownload({
         path: DropboxService.getPath(fileName),
       })
     ).pipe(

src/app/utils/dropbox.ts

@@ -1,7 +1,4 @@
 export class Dropbox {
-  static readonly DROPBOX_TOKEN =
-    'G-_ZeiEAvB0AAAAAAAANQd4IMHRr7Y9aTvAiivg-8LImbDKmo9pdu95_SIioW3lR';
-
   static readonly DROPBOX_FOLDER = '/XML/';
   static readonly DROPBOX_COMPOSITION_FILE = 'final';
   static readonly DROPBOX_FICHIER_FILE = 'fichier';

src/assets/configuration.json

@@ -0,0 +1 @@
+{"token": "{{DROPBOX_TOKEN}}"}

src/main.ts

@@ -1,4 +1,9 @@
-import {enableProdMode, isDevMode, importProvidersFrom} from '@angular/core';
+import {
+  enableProdMode,
+  isDevMode,
+  importProvidersFrom,
+  APP_INITIALIZER,
+} from '@angular/core';
 import {environment} from './environments/environment';
 import {AppComponent} from './app/app.component';
 import {ServiceWorkerModule} from '@angular/service-worker';
@@ -28,6 +33,11 @@ import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 import {ClipboardModule} from '@angular/cdk/clipboard';
 import {BrowserModule, bootstrapApplication} from '@angular/platform-browser';
 import {provideAnimations} from '@angular/platform-browser/animations';
+import {
+  Configuration,
+  ConfigurationService,
+} from '@services/configuration.service';
+import {Observable} from 'rxjs';
 
 if (environment.production) {
   enableProdMode();
@@ -77,6 +87,15 @@ bootstrapApplication(AppComponent, {
         return int;
       },
     },
+    {
+      provide: APP_INITIALIZER,
+      useFactory:
+        (conf: ConfigurationService): (() => Observable<Configuration>) =>
+        () =>
+          conf.load(),
+      deps: [ConfigurationService],
+      multi: true,
+    },
     provideAnimations(),
     provideHttpClient(withInterceptorsFromDi()),
   ],