fix(migrations): improve migration to take @use and @forward into acc (#14298)

Author: ChronosSF

projects/igniteui-angular/migrations/update-18_0_0/index.spec.ts

@@ -35,7 +35,10 @@ describe(`Update to ${version}`, () => {
     beforeEach(() => {
         appTree = new UnitTestTree(new EmptyTree());
         appTree.create('/angular.json', JSON.stringify(configJson));
-        appTree.create('/testSrc/styles.scss', '');
+        appTree.create('/testSrc/styles.scss', `
+@use "mockStyles.scss";
+@forward something;
+`);
     });
 
     const migrationName = 'migration-38';
@@ -434,8 +437,12 @@ describe(`Update to ${version}`, () => {
 
     it('should add default CSS rule to set all components to their previous Large defaults', async () => {
         const tree = await schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
-        expect(tree.readContent('/testSrc/styles.scss')).toContain(
+        expect(tree.readContent('/testSrc/styles.scss')).toEqual(
 `
+@use "mockStyles.scss";
+@forward something;
+// Specifies large size for all components to match the previous defaults
+// This may not be needed for your project. Please consult https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/update-guide for more details.
 :root {
     --ig-size: var(--ig-size-large);
 }

projects/igniteui-angular/migrations/update-18_0_0/index.ts

@@ -100,12 +100,23 @@ export default (): Rule => async (host: Tree, context: SchematicContext) => {
             }
 
             const content = cssBuffer.toString('utf-8');
-            const newContent = `
+            let newContent = `
 // Specifies large size for all components to match the previous defaults
 // This may not be needed for your project. Please consult https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/update-guide for more details.
 :root {
     --ig-size: var(--ig-size-large);
-}\n` + content;
+}\n`;
+
+            const lastUse = content.lastIndexOf('@use');
+            const lastForward = content.lastIndexOf('@forward');
+            if (lastUse > -1 || lastForward > -1) {
+                const lastLinePos = Math.max(lastForward, lastUse);
+                const fragment = content.substring(lastLinePos);
+                const insertPos = fragment.indexOf(';') + lastLinePos + 1;
+                newContent = content.substring(0, insertPos) + newContent + content.substring(insertPos + 1);
+            } else {
+                newContent = newContent + content;
+            }
 
             // Write the new content to the CSS file
             host.overwrite(stylesPath, newContent);