update devkit

baloise-incubator · Mar 5, 2024 · b3d997e · b3d997e
1 parent 9e5a469
commit b3d997e
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 19 deletions.
diff --git a/docs/stories/development/02-upgrade/upgrade-guide.v16.stories.mdx b/docs/stories/development/02-upgrade/upgrade-guide.v16.stories.mdx
@@ -55,17 +55,35 @@ Here's a summary of the key changes:
 
 <Markdown>
   {`
-| Old Package Name                                     | New Package Name           | Description                                                                             |
-| :--------------------------------------------------- | :------------------------- | :-------------------------------------------------------------------------------------- |
-| @baloise/design-system-components                    | @baloise/ds-core           | Core features of the Design System like Web-Components, Components-Styles and Utilities |
-| @baloise/design-system-components-angular            | @baloise/ds-angular-module | Angular component and provider library based on Angular Module and ESBuild              |
-| @baloise/design-system-components-angular/standalone | @baloise/ds-angular        | Angular component and provider library based on Angular Standalone and ESBuild          |
-| @baloise/design-system-components-angular/legacy     | @baloise/ds-angular-legacy | Angular component and provider library based on Angular Module and Webpack              |
-| @baloise/design-system-components-react              | @baloise/ds-react          | React component library                                                                 |
-| @baloise/design-system-components-vue                | @baloise/ds-vue            | Vue component library                                                                   |
-| @baloise/design-system-components-table              | @baloise/ds-table          | AG-Grid components and styles                                                           |
-| @baloise/design-system-cli                           | @baloise/ds-devkit         | Angular and NX schematics                                                               |
-| @baloise/design-system-\\\*                          | @baloise/ds-\\\*           |                                                                                         |
+| Old Package Name                                         |       | New Package Name               |
+| :------------------------------------------------------- | :---: | :----------------------------- |
+| \`@baloise/design-system-components\`                    | **→** | \`@baloise/ds-core\`           |
+| \`@baloise/design-system-components-angular\`            | **→** | \`@baloise/ds-angular-module\` |
+| \`@baloise/design-system-components-angular/standalone\` | **→** | \`@baloise/ds-angular\`        |
+| \`@baloise/design-system-components-angular/legacy\`     | **→** | \`@baloise/ds-angular-legacy\` |
+| \`@baloise/design-system-components-react\`              | **→** | \`@baloise/ds-react\`          |
+| \`@baloise/design-system-components-vue\`                | **→** | \`@baloise/ds-vue\`            |
+| \`@baloise/design-system-components-table\`              | **→** | \`@baloise/ds-table\`          |
+| \`@baloise/design-system-cli\`                           | **→** | \`@baloise/ds-devkit\`         |
+| \`@baloise/design-system-*\`                          | **→** | \`@baloise/ds-\\\*\`           |
+`}
+</Markdown>
+
+#### New Packages
+
+<Markdown>
+  {`
+| Package Name                   | Description                                                                             |
+| :----------------------------- | :-------------------------------------------------------------------------------------- |
+| \`@baloise/ds-core\`           | Core features of the Design System like Web-Components, Components-Styles and Utilities |
+| \`@baloise/ds-angular-module\` | Angular component and provider library based on Angular Module and ESBuild              |
+| \`@baloise/ds-angular\`        | Angular component and provider library based on Angular Standalone and ESBuild          |
+| \`@baloise/ds-angular-legacy\` | Angular component and provider library based on Angular Module and Webpack              |
+| \`@baloise/ds-react\`          | React component library                                                                 |
+| \`@baloise/ds-vue\`            | Vue component library                                                                   |
+| \`@baloise/ds-table\`          | AG-Grid components and styles                                                           |
+| \`@baloise/ds-devkit\`         | Angular and NX schematics                                                               |
+| \`@baloise/ds-*\`           |                                                                                         |
 `}
 </Markdown>
 

diff --git a/packages/devkit/src/ng-upgrade-16/index.ts b/packages/devkit/src/ng-upgrade-16/index.ts
@@ -6,7 +6,7 @@ import { findNodes } from '@schematics/angular/utility/ast-utils'
 import * as ts from '@schematics/angular/third_party/github.com/Microsoft/TypeScript/lib/typescript'
 import { glob } from 'glob'
 
-import { SchemaOptions } from './schema'
+import { AngularType, SchemaOptions } from './schema'
 import { getWorkspace } from '@schematics/angular/utility/workspace'
 import { join } from 'path'
 
@@ -47,7 +47,7 @@ export default function (options: SchemaOptions): Rule {
   }
 }
 
-export function changePackageName(_options: any): Rule {
+export function changePackageName(options: SchemaOptions): Rule {
   return (tree: Tree, _context: SchematicContext) => {
     const packageJsonPath = '/package.json'
     const packageJsonContent = tree.read(packageJsonPath)
@@ -73,7 +73,14 @@ export function changePackageName(_options: any): Rule {
       }
     }
 
-    changePackage('design-system-components-angular', 'ds-angular')
+    if (options.angularType === AngularType.Standalone) {
+      changePackage('design-system-components-angular', 'ds-angular')
+    } else if (options.angularType === AngularType.Module) {
+      changePackage('design-system-components-angular', 'ds-angular-module')
+    } else if (options.angularType === AngularType.Legacy) {
+      changePackage('design-system-components-angular', 'ds-angular-legacy')
+    }
+
     changePackage('design-system-components', 'ds-core')
 
     changePackage('design-system-css', 'ds-css')
@@ -132,7 +139,7 @@ export function updateImports(config: RenameConfig): Rule {
           }, moduleSpecifier)
 
           // Extract imported items
-          const namedImports = node.importClause?.namedBindings?.getText(sourceFile) || ''
+          const namedImports = node.importClause?.getText(sourceFile) || ''
           const importClause = namedImports ? `${namedImports}` : ''
 
           const recorder = fileChanges[filePath] || []

diff --git a/packages/devkit/src/ng-upgrade-16/schema.json b/packages/devkit/src/ng-upgrade-16/schema.json
@@ -3,6 +3,13 @@
   "$id": "bds-ng-upgrade-16",
   "title": "Upgrade an angular application the v16 of Baloise Design System",
   "type": "object",
-  "properties": {},
-  "required": []
+  "properties": {
+    "angularType": {
+      "x-prompt": "How do you use the Design System in your app?",
+      "type": "string",
+      "default": "Standalone (ESBuild)",
+      "enum": ["Standalone (ESBuild)", "Module-Based (ESBuild)", "Legacy Module-Based (Webpack)"]
+    }
+  },
+  "required": ["angularType"]
 }
diff --git a/packages/devkit/src/ng-upgrade-16/schema.ts b/packages/devkit/src/ng-upgrade-16/schema.ts
@@ -1,2 +1,13 @@
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
-export interface SchemaOptions {}
+export enum AngularType {
+  Standalone = 'Standalone (ESBuild)',
+  Module = 'Module-Based (ESBuild)',
+  Legacy = 'Legacy Module-Based (Webpack)',
+}
+
+
+export interface SchemaOptions {
+  /**
+   * Defines how the angular lib is used
+   */
+  angularType: AngularType
+}