Merge remote-tracking branch 'origin/vnext' into ttonev/both-side-pinning-samples

Author: ChronosSF

angular.json

@@ -39,7 +39,12 @@
                 "node_modules"
               ]
             },
-            "browser": "src/main.ts"
+            "browser": "src/main.ts",
+             "server": "src/main.server.ts",
+            "outputMode": "static",
+            "ssr": {
+                "entry": "src/server.ts"
+            }
           },
           "configurations": {
             "production": {
@@ -159,7 +164,12 @@
               ]
             },
             "preserveSymlinks": true,
-            "browser": "projects/app-lob/src/main.ts"
+            "browser": "projects/app-lob/src/main.ts",
+            "server": "projects/app-lob/src/main.server.ts",
+            "outputMode": "static",
+            "ssr": {
+              "entry": "projects/app-lob/src/server.ts"
+            }
           },
           "configurations": {
             "production": {
@@ -284,7 +294,12 @@
                 "node_modules"
               ]
             },
-            "browser": "projects/app-crm/src/main.ts"
+            "browser": "projects/app-crm/src/main.ts",
+            "server": "projects/app-crm/src/main.server.ts",
+            "outputMode": "static",
+            "ssr": {
+              "entry": "projects/app-crm/src/server.ts"
+            }
           },
           "configurations": {
             "production": {

azure-devops/templates/cd-template.yml

@@ -61,7 +61,7 @@ steps:
       workingDir: ${{ parameters.workingDir }}
       verbose: false
       customCommand: ${{ parameters.customCommand }}
-  
+
 #  - task: PowerShell@2
 #    displayName: 'Replace with licensed igniteui-angular'
 #    inputs:
@@ -126,10 +126,10 @@ steps:
     displayName: 'Update web.config file'
     workingDirectory: ${{ parameters.workingDir }}
 
-#  - script: |
-#      mv "$(Build.SourcesDirectory)/${{ parameters.targetFolder }}/browser/index.csr.html" "$(Build.SourcesDirectory)/${{ parameters.targetFolder }}/browser/index.html"
-#      echo "File renamed successfully."
-#    displayName: Rename index.csr.html to index.html
+  - script: |
+     mv "$(Build.SourcesDirectory)/${{ parameters.targetFolder }}/browser/index.csr.html" "$(Build.SourcesDirectory)/${{ parameters.targetFolder }}/browser/index.html"
+     echo "File renamed successfully."
+    displayName: Rename index.csr.html to index.html
 
   - script: |
       sourcePath="$(Build.SourcesDirectory)/${{ parameters.targetFolder }}/browser"

gulpfile.js

@@ -3,6 +3,8 @@ const fs = require("fs");
 const path = require("path");
 const es = require('event-stream');
 const fsExtra = require("fs-extra");
+const yargs = require("yargs");
+const { hideBin } = require('yargs/helpers');
 
 require('ts-node').register({
     transpileOnly: true,
@@ -14,7 +16,7 @@ require('ts-node').register({
 });
 
 const { generateLiveEditing } = require('igniteui-live-editing');
-const argv = require("yargs").argv;
+const argv = yargs(hideBin(process.argv)).parse();
 
 const submodule = "igniteui-live-editing-samples";
 
@@ -63,66 +65,6 @@ gulp.task("overwrite-package-json", (done) => {
     done();
 });
 
-const createPrependerdLobStructure = (cb) => {
-    const folders = [
-        './dist/app-lob/samples',
-        './dist/app-lob/samples/grid',
-        './dist/app-lob/samples/tree-grid',
-        './dist/app-lob/samples/grid-finjs-dock-manager',
-        './dist/app-lob/samples/hierarchical-grid',
-        './dist/app-lob/grid',
-        './dist/app-lob/tree-grid',
-        './dist/app-lob/grid-finjs-dock-manager',
-        './dist/app-lob/hierarchical-grid'
-    ];
-    folders.forEach(dir => {
-        if (!fs.existsSync(dir)) {
-            fs.mkdirSync(dir);
-        }
-    });
-    cb();
-}
-
-const addPrerenderedLobPages = (cb) => {
-    const { metadata } = require('./projects/app-lob/src/app/metadata');
-    const indexFilePath = path.resolve(__dirname, './', 'dist/app-lob/browser', 'index.html');
-
-    // read in the index.html file
-    fs.readFile(indexFilePath, 'utf8', function (err, data) {
-        if (err) {
-            return console.error(err);
-        }
-
-        metadata.forEach(({ url, title, description, og_url, folder }) => {
-            let result = data;
-            result = result.replace(/\$OG_TITLE/g, title);
-            result = result.replace(/\$OG_DESCRIPTION/g, description);
-            result = result.replace(/\$OG_URL/g, og_url);
-
-            let filename = url.substring(1).replace(/\//g, '-');
-            if (filename.length) {
-                filename = filename + '.html';
-            } else {
-                filename = 'index.html';
-            }
-
-            fs.writeFile(path.resolve(__dirname, './', './dist/app-lob/samples/' + folder, filename), result, (err) => {
-                if (err) {
-                    console.log(err);
-                }
-            });
-            fs.writeFile(path.resolve(__dirname, './', './dist/app-lob/' + folder, filename), result, (err) => {
-                if (err) {
-                    console.log(err);
-                }
-            });
-        })
-    })
-    cb();
-}
-
-exports.prerenderPages = gulp.series(createPrependerdLobStructure, addPrerenderedLobPages);
-
 gulp.task("watch-live-editing", gulp.series("generate-live-editing", () => {
     gulp.watch(["./src/**/*.*", "!./src/assets/**", "./live-editing/**/*.*", "package.json"], function () {
         Object.keys(require.cache).forEach(function (key) {

live-editing/configs/QueryBuilderConfigGenerator.ts

@@ -1,9 +1,12 @@
-import { Config, IConfigGenerator} from 'igniteui-live-editing'
+import { Config, IConfigGenerator } from 'igniteui-live-editing'
 import { BaseAppConfig } from './BaseConfig';
 export class QueryBuilderConfigGenerator implements IConfigGenerator {
     public generateConfigs(): Config[] {
         const configs = new Array<Config>();
 
+        const HTTPConfig = structuredClone(BaseAppConfig);
+        HTTPConfig.providers.push({ 'provider': 'provideHttpClient(),', 'import': '@angular/common/http' });
+
         configs.push(new Config({
             component: 'QueryBuilderSample1Component',
             appConfig: BaseAppConfig,
@@ -23,12 +26,19 @@ export class QueryBuilderConfigGenerator implements IConfigGenerator {
             shortenComponentPathBy: "/interactions/query-builder/"
         }));
 
-        // configs.push(new Config({
-        //     component: 'QueryBuilderSqlSampleComponent',
-        //     additionalDependencies: ["sql-formatter"],
-        //     appConfig: BaseAppConfig,
-        //     shortenComponentPathBy: "/interactions/query-builder/"
-        // })); // sql-formatter is not available in the live editing environment and cannot be enabled per config atm
+        configs.push(new Config({
+            component: 'QueryBuilderRequestSampleComponent',
+            additionalFiles: ["/src/app/interactions/query-builder/query-builder-style/layout.scss"],
+            appConfig: HTTPConfig,
+            shortenComponentPathBy: "/interactions/query-builder/"
+        }));
+
+        configs.push(new Config({
+            component: 'QueryBuilderSqlSampleComponent',
+            additionalDependencies: ["sql-formatter"],
+            appConfig: HTTPConfig,
+            shortenComponentPathBy: "/interactions/query-builder/"
+        }));
 
         return configs;
     }

live-editing/configs/ThemingConfigGenerator.ts

@@ -1,3 +1,11 @@
+import {
+    IgxCardComponent,
+    IgxCardContentDirective,
+    IgxCardHeaderComponent,
+    IgxChipComponent,
+    IgxIconComponent,
+    IgxPrefixDirective,
+} from "igniteui-angular";
 import {AppModuleConfig, Config, IConfigGenerator} from 'igniteui-live-editing'
 import { BaseAppConfig } from './BaseConfig';;
 export class ThemingConfigGenerator implements IConfigGenerator {
@@ -36,6 +44,12 @@ export class ThemingConfigGenerator implements IConfigGenerator {
             shortenComponentPathBy: '/theming/'
         }));
 
+        configs.push(new Config({
+            component: 'RoundnessComponent',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: '/theming/roundness/'
+        }));
+
         configs.push(new Config({
             component: 'AnimationsSampleComponent',
             appConfig: BaseAppConfig,