fix: fix broken image in ocx src + fix storybook builds

.github/workflows/storybook.yml

@@ -1,5 +1,11 @@
 name: Deploy Storybook
-on: push
+on: 
+  push:
+    branches:
+      - '**'
+  pull_request_target:
+      branches:
+        - 'main'
 jobs:
   deploy-storybooks:
     runs-on: ubuntu-latest

libs/angular-accelerator/assets/styles.scss

@@ -1,7 +1,7 @@
 /* You can add global styles to this file, and also import other style files */
 
-@import 'node_modules/primeflex/primeflex.scss';
+@import '/node_modules/primeflex/primeflex.scss';
 
-@import 'node_modules/@onecx/portal-layout-styles/src/styles/shell/shell.scss';
+@import '/node_modules/@onecx/portal-layout-styles/src/styles/shell/shell.scss';
 
-@import 'node_modules/@onecx/portal-layout-styles/src/styles/primeng/theme-light.scss';
+@import '/node_modules/@onecx/portal-layout-styles/src/styles/primeng/theme-light.scss';

libs/angular-accelerator/src/lib/directives/src.directive.ts

@@ -1,10 +1,13 @@
 import { HttpClient } from '@angular/common/http'
-import { Directive, ElementRef, Input } from '@angular/core'
+import { Directive, ElementRef, EventEmitter, Input, Output } from '@angular/core'
 
 @Directive({ selector: '[ocxSrc]' })
 export class SrcDirective {
   private _src: string | undefined
 
+  // eslint-disable-next-line @angular-eslint/no-output-native
+  @Output() error = new EventEmitter<void>()
+
   @Input()
   get ocxSrc(): string | undefined {
     return this._src
@@ -20,21 +23,27 @@ export class SrcDirective {
                 URL.revokeObjectURL(url)
               }
               this.el.nativeElement.src = url
+              this.el.nativeElement.style.visibility = 'initial'
             },
             error: () => {
-              this.el.nativeElement.src = 'error'
+              this.error.emit()
+              this.el.nativeElement.style.visibility = 'initial'
             },
           })
         } else {
           this.el.nativeElement.src = value
+          this.el.nativeElement.style.visibility = 'initial'
         }
       } catch (error) {
         console.log('Cannot parse URL ', value, error)
         this.el.nativeElement.src = value
+        this.el.nativeElement.style.visibility = 'initial'
       }
       this._src = value
     }
   }
 
-  constructor(private el: ElementRef, private httpClient: HttpClient) {}
+  constructor(private el: ElementRef, private httpClient: HttpClient) {
+    this.el.nativeElement.style.visibility = 'hidden'
+  }
 }

libs/portal-integration-angular/assets/styles.scss

@@ -1,9 +1,8 @@
 /* You can add global styles to this file, and also import other style files */
-@import 'node_modules/primeflex/primeflex.scss';
-// @import '../../../node_modules/primeicons/primeicons';
+@import '/node_modules/primeflex/primeflex.scss';
 
-@import 'node_modules/@onecx/portal-layout-styles/src/styles/shell/shell.scss';
+@import '/node_modules/@onecx/portal-layout-styles/src/styles/shell/shell.scss';
 
-@import 'node_modules/@onecx/portal-layout-styles/src/styles/primeng/theme-light.scss';
+@import '/node_modules/@onecx/portal-layout-styles/src/styles/primeng/theme-light.scss';
 
-@import 'node_modules/@onecx/portal-integration-angular/assets/loading-indicator.directive.scss';
+@import '/node_modules/@onecx/portal-integration-angular/assets/loading-indicator.directive.scss';

libs/portal-integration-angular/project.json

@@ -59,8 +59,15 @@
         "libName": "portal-integration-angular"
       }
     },
+    "copy-additional-styles": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "mkdir -p node_modules/@onecx/portal-integration-angular/assets/ && cp libs/portal-integration-angular/src/lib/core/directives/loading-indicator.directive.scss node_modules/@onecx/portal-integration-angular/assets/"
+      }
+    },
     "storybook": {
       "executor": "@storybook/angular:start-storybook",
+      "dependsOn": ["copy-additional-styles"],
       "options": {
         "port": 4400,
         "configDir": "libs/portal-integration-angular/.storybook",
@@ -82,6 +89,7 @@
     },
     "build-storybook": {
       "executor": "@storybook/angular:build-storybook",
+      "dependsOn": ["copy-additional-styles"],
       "outputs": ["{options.outputDir}"],
       "options": {
         "outputDir": "dist/storybook/portal-integration-angular",

libs/portal-integration-angular/src/lib/core/components/portal-page/portal-page.component.scss

@@ -1,4 +1,4 @@
-@import '@onecx/styles/shell/_variables.scss';
+@import '@onecx/portal-layout-styles/src/styles/shell/_variables.scss';
 :host {
   display: block;
   padding: var(--page-padding, 1rem);

libs/portal-integration-angular/src/lib/core/components/portal-viewport/portal-viewport.component.scss

@@ -1,4 +1,4 @@
-@import '@onecx/styles/shell/_variables.scss';
+@import '@onecx/portal-layout-styles/src/styles/shell/_variables.scss';
 
 ocx-announcement-banner > div {
   position: relative;

package.json

@@ -26,7 +26,7 @@
     "@ngrx/store-devtools": "^15.3.0",
     "@ngx-translate/core": "^14.0.0",
     "@ngx-translate/http-loader": "^7.0.0",
-    "@onecx/styles": "file:libs/portal-layout-styles/src/styles",
+    "@onecx/portal-layout-styles": "file:libs/portal-layout-styles/",
     "axios": "^1.0.0",
     "chart.js": "^4.4.0",
     "d3-scale-chromatic": "^3.0.0",