Merge master

Author: jsorohova

.github/workflows/mainCI.yml

@@ -18,10 +18,10 @@ jobs:
       security-events: write
 
     steps:
-      - name: Use Node.js 16.x
+      - name: Use Node.js 20.x
         uses: actions/checkout@v2
         with:
-          node-version: 16.x
+          node-version: 20.x
 
       - name: Install
         run: npm install

package-lock.json

@@ -83,12 +83,12 @@
         "@microsoft/applicationinsights-web": "^3.0.2",
         "@monaco-editor/loader": "^1.3.3",
         "@monaco-editor/react": "^4.6.0",
-        "@paperbits/azure": "^0.1.631",
-        "@paperbits/common": "^0.1.632",
-        "@paperbits/core": "^0.1.632",
-        "@paperbits/forms": "^0.1.632",
+        "@paperbits/azure": "^0.1.634",
+        "@paperbits/common": "^0.1.634",
+        "@paperbits/core": "^0.1.634",
+        "@paperbits/forms": "^0.1.634",
         "@paperbits/react": "1.0.8",
-        "@paperbits/styles": "^0.1.632",
+        "@paperbits/styles": "^0.1.634",
         "@webcomponents/custom-elements": "1.6.0",
         "@webcomponents/shadydom": "^1.11.0",
         "client-oauth2": "4.3.3",

package.json

@@ -112,11 +112,13 @@ import { ConfirmPasswordRuntimeModule } from "./components/users/confirm-passwor
 import { SubscriptionsRuntimeModule } from "./components/users/subscriptions/subscriptions.runtime.module";
 import { ReportsRuntimeModule } from "./components/reports/reports.runtime.module";
 import { ValidationSummaryRuntimeModule } from "./components/users/validation-summary/validationSummary.runtime.module";
+import { ClientLogger } from "./logging/clientLogger";
 
 export class ApimRuntimeModule implements IInjectorModule {
     public register(injector: IInjector): void {
         injector.bindModule(new ReactModule());
         injector.bindSingleton("logger", ConsoleLogger);
+        // injector.bindSingleton("logger", ClientLogger);
         injector.bindSingleton("traceClick", TraceClick);
         injector.bindToCollection("autostart", UnhandledErrorHandler);
         injector.bindToCollection("autostart", BalloonBindingHandler);

src/apim.runtime.module.ts

@@ -1,4 +1,4 @@
-<button id="signinB2C" class="button" data-bind="click: signIn, css: classNames, traceClick">
+<button id="signinB2C" class="button" data-action="B2C Sign in" data-bind="click: signIn, css: classNames, traceClick">
     <i class="icon-emb icon-svg-aad"></i>
     <span data-bind="text: label"></span>
 </button>

src/components/users/signin-social/ko/runtime/signin-aad-b2c.html

@@ -1,4 +1,4 @@
-<button id="signinAad" class="button" data-bind="click: signIn, css: classNames, traceClick">
+<button id="signinAad" class="button" data-action="AAD Sign in" data-bind="click: signIn, css: classNames, traceClick">
     <i class="icon-emb icon-svg-aad"></i>
     <span data-bind="text: label"></span>
 </button>

src/components/users/signin-social/ko/runtime/signin-aad.html

@@ -34,16 +34,16 @@
 
         <!-- ko if: requireHipCaptcha -->
         <hip-captcha params="{ captchaData: captchaData, onInitComplete: onCaptchaCreated }"></hip-captcha>
-        <!-- /ko -->       
-        
+        <!-- /ko -->
+
         <!-- ko if: termsEnabled && termsOfUse -->
         <terms-of-use params="{ isConsentRequired: isConsentRequired, consented: consented, termsOfUse: termsOfUse }"></terms-of-use>
         <!-- /ko -->
 
         <div class="form-group">
-            
+
             <!-- ko ifnot: working -->
-            <button type="button" id="signup" class="button button-primary" data-bind="click: signup">
+            <button type="button" id="signup" class="button button-primary" data-action="Sign up" data-bind="click: signup">
                 Sign up
             </button>
             <!-- /ko -->

src/components/users/signup/ko/runtime/signup.html

@@ -372,3 +372,14 @@ export const isRedesignEnabledSetting = "isRedesignEnabled";
  * Key of the default admin user
  */
 export const integrationUserId = '/users/integration';
+
+/**
+  * This is used to store the unique user in local storage and identify the user session in client telemetry.
+ */
+export const USER_SESSION = "userSessionId";
+export const USER_ID = "userId";
+export const USER_ACTION = "data-action";
+
+// Feature flags
+export const FEATURE_FLAGS = "featureFlags";
+export const FEATURE_CLIENT_TELEMETRY = "clientTelemetry";