✨ feat(template): add custom templates

RedJue · RedJue · commit 5225dfbbe338 · 2021-07-09T14:37:42.000+08:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,13 +4,8 @@ All notable changes to the "git-int-commit-plugin" extension will be documented
 
 Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
 
-## [1.0.6]
--   🎈 perf(commitTemplate): 增加配置增加icon标签，可以自定义图标显示的位置
--   🐞 fix(commitContent): 解决在没有body或者footer的情况下会多出换行的bug
-
 ## [1.0.5]
 -   ✨ feat(commitTemplate): 插件新增提交模板配置
-
 ## [1.0.4]
 -   🌈Style:[change icons](https://github.com/RedJue/git-commit-plugin/commit/611ecfb6c2cbf14436141056cc87da4530117c66)
 -   🐞Fix:issue [#36](https://github.com/RedJue/git-commit-plugin/issues/36)
diff --git a/README.md b/README.md
@@ -87,8 +87,10 @@ A detailed explanation can be found in this [document](https://docs.google.com/d
     "customTypeName"
 ] or [
    {
+       // If there are duplicate labels, rewrite the config，otherwise add As a new configuration addition
        "label": "customTypeName",
-       "detail": "customTypeDetail"
+       "detail": "customTypeDetail",
+       "icon":"customIcon"
    }
 ]
 ```
@@ -110,7 +112,9 @@ A detailed explanation can be found in this [document](https://docs.google.com/d
     },
     {
         "templateName": "git-cz",
-        "templateContent": "<type>(<scope>):<space><icon><space><subject><enter><body><enter><footer>"
+        "templateContent": "<type>(<scope>):<space><icon><space><subject><enter><body><enter><footer>",
+         // Set as default commit template
+        "default":true
     }
 ]
 ```
diff --git a/git-commit-plugin-1.0.1.vsix b/git-commit-plugin-1.0.1.vsix
diff --git a/src/config/commit-detail.ts b/src/config/commit-detail.ts
@@ -9,6 +9,7 @@ export interface CommitDetailType extends QuickPickItem {
 }
 //最大的 subject 限制字数 Max subject words
 export const MaxSubjectWords = workspace.getConfiguration('GitCommitPlugin').get<boolean>('MaxSubjectWords') || 20;
+
 export const CommitDetailType: Array<CommitDetailType> = [
     {
         label: '<Scope>',
@@ -43,12 +44,18 @@ export const CommitDetailType: Array<CommitDetailType> = [
         key: 'complete',
         detail: '完成 commit 的编写'
     },
+    {
+        label: 'Select template for commit',
+        key: 'template',
+        detail: '选择提交使用的模板'
+    },
     {
         label: 'Back',
         key: 'back',
         detail: '返回 commit type 选择页'
     }
 ];
+
 export const CommitDetailQuickPickOptions: QuickPickOptions = {
     matchOnDescription: true,
     matchOnDetail: true,
diff --git a/src/config/commit-type.ts b/src/config/commit-type.ts
@@ -4,11 +4,13 @@ import { workspace, QuickPickItem } from 'vscode';
  * @description git commit 提交类型
  */
 export interface CommitType extends QuickPickItem {
-    icon: string;
+    icon?: string;
 }
-
+//是否展现 Emoji图标 show Emoji or not
+const isShowEmoji = workspace.getConfiguration('GitCommitPlugin').get<boolean>('ShowEmoji');
 //新增的自定义commit type add custom Commit Type
 const CustomCommitType = workspace.getConfiguration('GitCommitPlugin').get<boolean>('CustomCommitType');
+
 let CommitType: Array<CommitType> = [
     {
         label: 'feat',
@@ -61,37 +63,52 @@ let CommitType: Array<CommitType> = [
         icon:'🐳'
     },
     {
-        label: '↩revert',
+        label: 'revert',
         detail: '回滚到上一个版本',
-        icon:''
+        icon:'↩'
     }
 ];
 
-// if (!isShowEmoji) {
-//     CommitType = CommitType.map((commitType) => {
-//         const labelArr = [...commitType.label];
-//         labelArr.shift();
-//         commitType.label = labelArr.join('').trim();
-//         return commitType;
-//     });
-// }
 if (Array.isArray(CustomCommitType)) {
-    const costom_commit_type: Array<CommitType> = CustomCommitType.map((item, index) => {
+    CustomCommitType.forEach((item) => {
         let label = '',icon='',detail = '';
         if (typeof item === 'string') {
             label = detail = item;
         }
-        if (Object.prototype.toString.call(item) === '[object Object]') {
-            Reflect.has(item, 'label') && (label = item.label);
-            Reflect.has(item, 'detail') && (detail = item.detail);
-            Reflect.has(item, 'icon') && (icon = item.icon);
-        }
-        return {
+        const resultType = {
             label,
-            detail,
-            icon
+            icon,
+            detail
         };
+        if (Object.prototype.toString.call(item) === '[object Object]') {
+            if(Reflect.has(item, 'label')){resultType.label = item.label;}else{Reflect.deleteProperty(resultType,'label');};
+            if(Reflect.has(item, 'detail')){resultType.detail = item.detail;}else{Reflect.deleteProperty(resultType,'detail');};
+            if(Reflect.has(item, 'icon')){resultType.icon = item.icon;}else{Reflect.deleteProperty(resultType,'icon');};
+        }
+        const target = CommitType.find((type)=>type.label === item.label);
+       
+        if(target !== undefined){
+            Object.assign(target,resultType);
+        }else{
+            CommitType.unshift(resultType);
+        }
     });
-    CommitType = costom_commit_type.concat(CommitType);
 }
+if (!isShowEmoji) {
+    CommitType = CommitType.map((commitType) => {
+        commitType.icon = '';
+        return commitType;
+    });
+}
+
+if(isShowEmoji){
+    CommitType.forEach((item)=>{
+        // If there is an icon display
+        if(typeof item.icon === 'string' && item.icon.length > 0){        
+            item.label = `${item.icon} ${item.label}`;
+        }
+    });
+}
+  
+
 export default CommitType;
diff --git a/src/config/default-temp.ts b/src/config/default-temp.ts
@@ -0,0 +1,9 @@
+export const Angular =   {
+    'templateName': 'Angular',
+    'templateContent': '<icon><space><type>(<scope>):<space><subject><enter><body><enter><footer>'
+};
+
+export const GitCz = {
+    'templateName': 'git-cz',
+    'templateContent': '<type>(<scope>):<space><icon><space><subject><enter><body><enter><footer>'
+};
diff --git a/src/config/template-type.ts b/src/config/template-type.ts
@@ -1,4 +1,5 @@
 import { workspace, QuickPickItem } from 'vscode';
+import * as defaultTemp from './default-temp';
 
 /**
  * @description git commit template 类型
@@ -8,18 +9,28 @@ export interface CommitTemplateType extends QuickPickItem {
     detail: string;
 	templateName: string;
 	templateContent: string;
+    /** default template */
+    default?:boolean;
 }
 let CommitTemplate: Array<CommitTemplateType> = new Array<CommitTemplateType>();
 const configTemplate = workspace.getConfiguration('GitCommitPlugin').get<Array<CommitTemplateType>>('Templates');
 if (Array.isArray(configTemplate)) {
     CommitTemplate = configTemplate.map((item, index) => {
-        let templateName = '', label = '', detail = '', templateContent = '';
         return {
             label: item.templateName,
             detail: item.templateContent,
             templateName: item.templateName,
             templateContent:item.templateContent,
-        }
+            default:item.default || false
+        };
     });
+
 }
+const def:Array<CommitTemplateType> =  Object.values(defaultTemp).map((item)=>({
+    label: item.templateName,
+    detail: item.templateContent,
+    templateName: item.templateName,
+    templateContent:item.templateContent,
+}));
+CommitTemplate = CommitTemplate.concat(def);
 export default CommitTemplate;
diff --git a/src/extension.ts b/src/extension.ts
@@ -1,22 +1,24 @@
 // The module 'vscode' contains the VS Code extensibility API
 // Import the module and reference it with the alias vscode in your code below
-import { workspace } from 'vscode';
 import * as vscode from 'vscode';
 import { GitExtension } from './types/git';
 import CommitType from './config/commit-type';
 import { CommitDetailType, CommitDetailQuickPickOptions, MaxSubjectWords } from './config/commit-detail';
 import CommitInputType from './config/commit-input';
 import CommitTemplate from './config/template-type';
+import {Angular} from './config/default-temp';
 export interface GitMessage {
     [index: string]: string;
+    templateName:string;
+    templateContent:string;
+    icon:string;
     type: string;
     scope: string;
     subject: string;
     body: string;
     footer: string;
 }
-//是否展现 Emoji图标 show Emoji or not
-const isShowEmoji = workspace.getConfiguration('GitCommitPlugin').get<boolean>('ShowEmoji');
+
 // this method is called when your extension is activated
 // your extension is activated the very first time the command is executed
 export function activate(context: vscode.ExtensionContext) {
@@ -47,8 +49,8 @@ export function activate(context: vscode.ExtensionContext) {
     }
     //组合信息 Portfolio information
     function messageCombine(config: GitMessage) {
-        let result = config.templateContent;
-        result = isShowEmoji ? result.replace(/<icon>/g, config.icon) : result.replace(/<icon>/g, '');
+        let result = config.templateContent || Angular.templateContent;
+        result = config.icon ? result.replace(/<icon>/g, config.icon) : result.replace(/<icon>/g, '');
         result = config.type !=='' ? result.replace(/<type>/g, config.type) : result.replace(/<type>/g, '');
         result = config.scope !=='' ? result.replace(/<scope>/g, config.scope) : result.replace(/<scope>/g, '');
         result = config.subject !=='' ? result.replace(/<subject>/g, config.subject) : result.replace(/<subject>/g, '');
@@ -57,9 +59,6 @@ export function activate(context: vscode.ExtensionContext) {
         result = result.replace(/<enter>/g, '\n\n');
         result = result.replace(/<space>/g, ' ');
         return result.trim();
-        // return [`${config.type}${config.scope ? '(' + config.scope + ')' : ''}: ${config.subject} -- ${config.templateName}`, config.body, config.footer]
-        //     .filter((item) => item)
-        //     .join('\n\n');
     }
     const gitExtension = getGitExtension();
     if (!gitExtension?.enabled) {
@@ -69,7 +68,6 @@ export function activate(context: vscode.ExtensionContext) {
 
     //获取当前的 git仓库实例 Get git repo instance
     let repo: any = gitExtension.getAPI(1).repositories[0];
-    console.log(repo, 'repo');
 
     //输入提交详情 Input message detail
     const inputMessageDetail = (_key: string | number) => {
@@ -94,9 +92,26 @@ export function activate(context: vscode.ExtensionContext) {
             recursiveInputMessage(startMessageInput);
         });
     };
+    //是否存在模板 If has template
+    const existTemplete = () =>{
+        return Array.isArray(CommitTemplate) && CommitTemplate.length > 0;
+    };
+    //完成输入 Complete input message
+    const completeInputMessage = (select?:boolean) =>{
+        vscode.commands.executeCommand('workbench.view.scm');
+        if(existTemplete() && !select){
+            const defaultTemp = CommitTemplate.find((item)=>item.default);
+            if(defaultTemp !== undefined){
+                message_config.templateName = defaultTemp.templateName;
+                message_config.templateContent = defaultTemp.templateContent;
+            }
+        }
+        repo.inputBox.value = messageCombine(message_config);
+    };
     // 递归输入信息 Recursive input message
     const recursiveInputMessage = (startMessageInput?: () => void) => {
         CommitDetailQuickPickOptions.placeHolder = '搜索提交描述(Search Commit Describe)';
+
         const _CommitDetailType: Array<CommitDetailType> = JSON.parse(JSON.stringify(CommitDetailType));
         _CommitDetailType.map((item: any) => {
             if (item.isEdit) {
@@ -109,8 +124,7 @@ export function activate(context: vscode.ExtensionContext) {
             if (label !== '') {
                 const _key = select?.key || 'body';
                 if (_key === 'complete') {
-                    vscode.commands.executeCommand('workbench.view.scm');
-                    repo.inputBox.value = messageCombine(message_config);
+                    completeInputMessage();
                     clearMessage();
                     return false;
                 }
@@ -119,6 +133,10 @@ export function activate(context: vscode.ExtensionContext) {
                     clearMessage();
                     return false;
                 }
+                if(_key === 'template'){
+                    SelectTemplate();
+                    return false;
+                }
                 inputMessageDetail(_key);
             } else {
                 clearMessage();
@@ -127,10 +145,13 @@ export function activate(context: vscode.ExtensionContext) {
     };
     //开始输入 Start input
     const startMessageInput = () => {
-        CommitDetailQuickPickOptions.placeHolder = '搜索 Git 提交类型(Search Commit Type)';
+        CommitDetailQuickPickOptions.placeHolder = '搜索 Git 提交类型(Search Commit Type)'; 
         vscode.window.showQuickPick(CommitType, CommitDetailQuickPickOptions).then((select) => {
-            const label = (select && select.label) || '';
+            let label = (select && select.label) || '';
             const icon = (select && select.icon) || '';
+            if(typeof icon === 'string' && icon.length > 0){
+                label = label.split(' ')[1];
+            }
             message_config.type = label;
             message_config.icon = icon;
             if (label !== '') {
@@ -139,7 +160,7 @@ export function activate(context: vscode.ExtensionContext) {
         });
     };
     //选择commit 提交的模板
-    const SelectTemplate = () => {
+    const SelectTemplate = () => {      
         CommitDetailQuickPickOptions.placeHolder = '选择提交使用的模板';
         vscode.window
             .showQuickPick(CommitTemplate, CommitDetailQuickPickOptions).then((select) => {
@@ -148,8 +169,8 @@ export function activate(context: vscode.ExtensionContext) {
                 message_config.templateName = templateName;
                 message_config.templateContent = templateContent;
                 if (templateName !== '') {
-                    startMessageInput();
-                    // recursiveInputMessage(startMessageInput);
+                    completeInputMessage(true);
+                    clearMessage();
                 }
             });
     };
@@ -161,7 +182,7 @@ export function activate(context: vscode.ExtensionContext) {
                 return repo.rootUri.path === uri._rootUri.path;
             });
         }
-        SelectTemplate();
+        startMessageInput();    
     });
     context.subscriptions.push(disposable);
 }

Original file line number	Diff line number	Diff line change
`@@ -87,8 +87,10 @@ A detailed explanation can be found in this [document](https://docs.google.com/d`
`87`	`87`	`"customTypeName"`
`88`	`88`	`] or [`
`89`	`89`	`{`
	`90`	`+ // If there are duplicate labels, rewrite the config，otherwise add As a new configuration addition`
`90`	`91`	`"label": "customTypeName",`
`91`		`- "detail": "customTypeDetail"`
	`92`	`+ "detail": "customTypeDetail",`
	`93`	`+ "icon":"customIcon"`
`92`	`94`	`}`
`93`	`95`	`]`
`94`	`96`	```
`@@ -110,7 +112,9 @@ A detailed explanation can be found in this [document](https://docs.google.com/d`
`110`	`112`	`},`
`111`	`113`	`{`
`112`	`114`	`"templateName": "git-cz",`
`113`		`- "templateContent": "<type>(<scope>):<space><icon><space><subject><enter><body><enter><footer>"`
	`115`	`+ "templateContent": "<type>(<scope>):<space><icon><space><subject><enter><body><enter><footer>",`
	`116`	`+ // Set as default commit template`
	`117`	`+ "default":true`
`114`	`118`	`}`
`115`	`119`	`]`
`116`	`120`	```