Browse Source

Change input theme selection value to enum(number)

pull/14445/head
Mahmut Gundogdu 4 years ago
parent
commit
696f8a2a04
  1. 15
      npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts
  2. 4
      npm/ng-packs/packages/schematics/src/commands/change-theme/model.ts
  3. 14
      npm/ng-packs/packages/schematics/src/commands/change-theme/schema.json
  4. 425
      npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts
  5. 14
      npm/ng-packs/packages/schematics/src/commands/change-theme/theme-options.enum.ts

15
npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts

@ -1,12 +1,12 @@
import { Rule, SchematicContext, SchematicsException, Tree } from '@angular-devkit/schematics'; import { Rule, SchematicContext, SchematicsException, Tree } from '@angular-devkit/schematics';
import { isLibrary, updateWorkspace, WorkspaceDefinition } from '../../utils'; import { isLibrary, updateWorkspace, WorkspaceDefinition } from '../../utils';
import { allStyles, StyleDefinition, styleMap } from './style-map'; import { allStyles, styleMap } from './style-map';
import { ProjectDefinition } from '@angular-devkit/core/src/workspace'; import { ProjectDefinition } from '@angular-devkit/core/src/workspace';
import { JsonArray, JsonValue } from '@angular-devkit/core'; import { JsonArray, JsonValue } from '@angular-devkit/core';
import { ChangeThemeOptions } from './model'; import { ChangeThemeOptions } from './model';
import { ThemeOptionsEnum } from './theme-options.enum';
export default function (_options: ChangeThemeOptions): Rule { export default function (_options: ChangeThemeOptions): Rule {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
return async (_: Tree, __: SchematicContext) => { return async (_: Tree, __: SchematicContext) => {
const targetThemeName = _options.name; const targetThemeName = _options.name;
const selectedProject = _options.targetProject; const selectedProject = _options.targetProject;
@ -23,7 +23,7 @@ export default function (_options: ChangeThemeOptions): Rule {
function updateProjectStyle( function updateProjectStyle(
projectName: string, projectName: string,
workspace: WorkspaceDefinition, workspace: WorkspaceDefinition,
targetThemeName: string, targetThemeName: ThemeOptionsEnum,
) { ) {
const project = workspace.projects.get(projectName); const project = workspace.projects.get(projectName);
@ -41,7 +41,10 @@ function updateProjectStyle(
const sanitizedStyles = removeThemeBasedStyles(styles); const sanitizedStyles = removeThemeBasedStyles(styles);
const newStyles = getStylesOfSelectedTheme(targetThemeName); const newStyles = styleMap.get(targetThemeName);
if (!newStyles) {
throw new SchematicsException('The theme does not found');
}
targetOption.styles = [...newStyles, ...sanitizedStyles] as JsonArray; targetOption.styles = [...newStyles, ...sanitizedStyles] as JsonArray;
} }
@ -80,7 +83,3 @@ export const styleCompareFn = (item1: string | object, item2: string | object) =
return o1.bundleName && o2.bundleName && o1.bundleName == o2.bundleName; return o1.bundleName && o2.bundleName && o1.bundleName == o2.bundleName;
}; };
export function getStylesOfSelectedTheme(theme: string): StyleDefinition[] {
return styleMap[theme];
}

4
npm/ng-packs/packages/schematics/src/commands/change-theme/model.ts

@ -1,4 +1,6 @@
import { ThemeOptionsEnum } from './theme-options.enum';
export type ChangeThemeOptions = { export type ChangeThemeOptions = {
name: string; name: ThemeOptionsEnum;
targetProject: string; targetProject: string;
}; };

14
npm/ng-packs/packages/schematics/src/commands/change-theme/schema.json

@ -6,17 +6,17 @@
"properties": { "properties": {
"name": { "name": {
"description": "The file extension or preprocessor to use for style files.", "description": "The file extension or preprocessor to use for style files.",
"type": "string", "type": "integer",
"default": "basic", "default": 1,
"enum": ["basic", "lepton", "leptonx-lite", "leptonx"], "enum": [1, 2, 3, 4],
"x-prompt": { "x-prompt": {
"message": "Which theme would you like to use?", "message": "Which theme would you like to use?",
"type": "list", "type": "list",
"items": [ "items": [
{ "value": "basic", "label": "basic" }, { "value": 1, "label": "Basic" },
{ "value": "lepton", "label": "lepton" }, { "value": 2, "label": "Lepton" },
{ "value": "leptonx-lite", "label": "leptonx-lite" }, { "value": 3, "label": "LeptonXLite" },
{ "value": "leptonx", "label": "leptonx" } { "value": 4, "label": "LeptonX" }
] ]
} }
}, },

425
npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts

@ -8,219 +8,216 @@ export type StyleDefinition =
} }
| string; | string;
export type StyleMapType = { export const styleMap = new Map<ThemeOptionsEnum, StyleDefinition[]>();
[key: string]: StyleDefinition[];
};
export const styleMap: StyleMapType = { styleMap.set(ThemeOptionsEnum.Basic, [
[ThemeOptionsEnum.basic]: [ {
{ input: 'node_modules/bootstrap/dist/css/bootstrap.rtl.min.css',
input: 'node_modules/bootstrap/dist/css/bootstrap.rtl.min.css', inject: false,
inject: false, bundleName: 'bootstrap-rtl.min',
bundleName: 'bootstrap-rtl.min', },
}, {
{ input: 'node_modules/bootstrap/dist/css/bootstrap.min.css',
input: 'node_modules/bootstrap/dist/css/bootstrap.min.css', inject: true,
inject: true, bundleName: 'bootstrap-ltr.min',
bundleName: 'bootstrap-ltr.min', },
}, ]);
],
[ThemeOptionsEnum['leptonx-lite']]: [
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.css',
inject: false,
bundleName: 'bootstrap-dim',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.css',
inject: false,
bundleName: 'ng-bundle',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.css',
inject: false,
bundleName: 'layout-bundle',
},
{
input: 'node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.css',
inject: false,
bundleName: 'abp-bundle',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.rtl.css',
inject: false,
bundleName: 'bootstrap-dim.rtl',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.rtl.css',
inject: false,
bundleName: 'ng-bundle.rtl',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.rtl.css',
inject: false,
bundleName: 'layout-bundle.rtl',
},
{
input: 'node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.rtl.css',
inject: false,
bundleName: 'abp-bundle.rtl',
},
],
[ThemeOptionsEnum.lepton]: [
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.min.css',
inject: false,
bundleName: 'lepton1',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.min.css',
inject: false,
bundleName: 'lepton2',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.min.css',
inject: false,
bundleName: 'lepton3',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.min.css',
inject: false,
bundleName: 'lepton4',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.min.css',
inject: false,
bundleName: 'lepton5',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.min.css',
inject: false,
bundleName: 'lepton6',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.rtl.min.css',
inject: false,
bundleName: 'lepton1.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.rtl.min.css',
inject: false,
bundleName: 'lepton2.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.rtl.min.css',
inject: false,
bundleName: 'lepton3.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.rtl.min.css',
inject: false,
bundleName: 'lepton4.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.rtl.min.css',
inject: false,
bundleName: 'lepton5.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.rtl.min.css',
inject: false,
bundleName: 'lepton6.rtl',
},
],
[ThemeOptionsEnum.leptonx]: [
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dark.css',
inject: false,
bundleName: 'dark',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/light.css',
inject: false,
bundleName: 'light',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dim.css',
inject: false,
bundleName: 'dim',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.css',
inject: false,
bundleName: 'bootstrap-dim',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.css',
inject: false,
bundleName: 'bootstrap-dark',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.css',
inject: false,
bundleName: 'bootstrap-light',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.css',
inject: false,
bundleName: 'ng-bundle',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.css',
inject: false,
bundleName: 'layout-bundle',
},
{
input: 'node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.css',
inject: false,
bundleName: 'abp-bundle',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dark.rtl.css',
inject: false,
bundleName: 'dark.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/light.rtl.css',
inject: false,
bundleName: 'light.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dim.rtl.css',
inject: false,
bundleName: 'dim.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.rtl.css',
inject: false,
bundleName: 'bootstrap-dim.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.rtl.css',
inject: false,
bundleName: 'bootstrap-dark.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.rtl.css',
inject: false,
bundleName: 'bootstrap-light.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.rtl.css',
inject: false,
bundleName: 'ng-bundle.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.rtl.css',
inject: false,
bundleName: 'layout-bundle.rtl',
},
{
input: 'node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.rtl.css',
inject: false,
bundleName: 'abp-bundle.rtl',
},
],
};
export const allStyles = Object.values(styleMap).reduce((acc, val) => [...acc, ...val], []); styleMap.set(ThemeOptionsEnum.Lepton, [
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.min.css',
inject: false,
bundleName: 'lepton1',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.min.css',
inject: false,
bundleName: 'lepton2',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.min.css',
inject: false,
bundleName: 'lepton3',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.min.css',
inject: false,
bundleName: 'lepton4',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.min.css',
inject: false,
bundleName: 'lepton5',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.min.css',
inject: false,
bundleName: 'lepton6',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.rtl.min.css',
inject: false,
bundleName: 'lepton1.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.rtl.min.css',
inject: false,
bundleName: 'lepton2.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.rtl.min.css',
inject: false,
bundleName: 'lepton3.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.rtl.min.css',
inject: false,
bundleName: 'lepton4.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.rtl.min.css',
inject: false,
bundleName: 'lepton5.rtl',
},
{
input: 'node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.rtl.min.css',
inject: false,
bundleName: 'lepton6.rtl',
},
]);
styleMap.set(ThemeOptionsEnum.LeptonX, [
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dark.css',
inject: false,
bundleName: 'dark',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/light.css',
inject: false,
bundleName: 'light',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dim.css',
inject: false,
bundleName: 'dim',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.css',
inject: false,
bundleName: 'bootstrap-dim',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.css',
inject: false,
bundleName: 'bootstrap-dark',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.css',
inject: false,
bundleName: 'bootstrap-light',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.css',
inject: false,
bundleName: 'ng-bundle',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.css',
inject: false,
bundleName: 'layout-bundle',
},
{
input: 'node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.css',
inject: false,
bundleName: 'abp-bundle',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dark.rtl.css',
inject: false,
bundleName: 'dark.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/light.rtl.css',
inject: false,
bundleName: 'light.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/dim.rtl.css',
inject: false,
bundleName: 'dim.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.rtl.css',
inject: false,
bundleName: 'bootstrap-dim.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.rtl.css',
inject: false,
bundleName: 'bootstrap-dark.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.rtl.css',
inject: false,
bundleName: 'bootstrap-light.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.rtl.css',
inject: false,
bundleName: 'ng-bundle.rtl',
},
{
input: 'node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.rtl.css',
inject: false,
bundleName: 'layout-bundle.rtl',
},
{
input: 'node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.rtl.css',
inject: false,
bundleName: 'abp-bundle.rtl',
},
]);
styleMap.set(ThemeOptionsEnum.LeptonXLite, [
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.css',
inject: false,
bundleName: 'bootstrap-dim',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.css',
inject: false,
bundleName: 'ng-bundle',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.css',
inject: false,
bundleName: 'layout-bundle',
},
{
input: 'node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.css',
inject: false,
bundleName: 'abp-bundle',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.rtl.css',
inject: false,
bundleName: 'bootstrap-dim.rtl',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.rtl.css',
inject: false,
bundleName: 'ng-bundle.rtl',
},
{
input: 'node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.rtl.css',
inject: false,
bundleName: 'layout-bundle.rtl',
},
{
input: 'node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.rtl.css',
inject: false,
bundleName: 'abp-bundle.rtl',
},
]);
// the code written by Github co-pilot. thank go-pilot. You are the best sidekick.
export const allStyles = Array.from(styleMap.values()).reduce((acc, val) => [...acc, ...val], []);

14
npm/ng-packs/packages/schematics/src/commands/change-theme/theme-options.enum.ts

@ -1,6 +1,8 @@
export const ThemeOptionsEnum = Object.freeze({ // this enum create by https://raw.githubusercontent.com/abpframework/abp/rel-6.0/framework/src/Volo.Abp.Cli.Core/Volo/Abp/Cli/ProjectBuilding/Building/Theme.cs
basic: 'basic',
lepton: 'lepton', export enum ThemeOptionsEnum {
'leptonx-lite': 'leptonx-lite', Basic = 1,
leptonx: 'leptonx', Lepton = 2,
}); LeptonXLite = 3,
LeptonX = 4,
}

Loading…
Cancel
Save