@dialpad/eslint-plugin-dialtone 1.1.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
# Finds deprecated components that should be replaced by Dialtone Vue components
|
|
2
|
+
|
|
3
|
+
## Rule Details
|
|
4
|
+
|
|
5
|
+
This informs developers of deprecated product side components that should be replaced by Dialtone Vue components. It will suggest a replacement component.
|
|
6
|
+
|
|
7
|
+
Currently the components with the below filenames are considered deprecated:
|
|
8
|
+
|
|
9
|
+
- select_menu
|
|
10
|
+
|
|
11
|
+
This rule specifically targets components in ubervoice. If you are using Dialtone Vue outside of ubervoice you may want to disable this rule.
|
|
12
|
+
|
|
13
|
+
Examples of **incorrect** code for this rule:
|
|
14
|
+
|
|
15
|
+
**import of a deprecated component**:
|
|
16
|
+
|
|
17
|
+
```js
|
|
18
|
+
import SelectMenu from '../components/select_menu.vue';
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
Examples of **correct** code for this rule:
|
|
22
|
+
|
|
23
|
+
**import of a Dialtone Vue component**:
|
|
24
|
+
|
|
25
|
+
```js
|
|
26
|
+
import { DtComboboxWithPopover } from '@dialpad/dialtone-vue';
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
**import of a custom local component**:
|
|
30
|
+
|
|
31
|
+
```js
|
|
32
|
+
import MyComponent from './my_component.vue';
|
|
33
|
+
```
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @fileoverview Detects usages of old dialpad product side components which should be replaced by Dialtone components.
|
|
3
|
+
* @author Brad Paugh
|
|
4
|
+
*/
|
|
5
|
+
"use strict";
|
|
6
|
+
|
|
7
|
+
//------------------------------------------------------------------------------
|
|
8
|
+
// Rule Definition
|
|
9
|
+
//------------------------------------------------------------------------------
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
/** @type {import('eslint').Rule.RuleModule} */
|
|
14
|
+
module.exports = {
|
|
15
|
+
meta: {
|
|
16
|
+
type: 'suggestion', // `problem`, `suggestion`, or `layout`
|
|
17
|
+
docs: {
|
|
18
|
+
description: "Detects usages of deprecated components that should be replaced by Dialtone Vue components",
|
|
19
|
+
recommended: false,
|
|
20
|
+
url: 'https://github.com/dialpad/eslint-plugin-dialtone/blob/main/docs/rules/deprecated-component.md', // URL to the documentation page for this rule
|
|
21
|
+
},
|
|
22
|
+
fixable: null, // Or `code` or `whitespace`
|
|
23
|
+
schema: [], // Add a schema if the rule has options
|
|
24
|
+
messages: {
|
|
25
|
+
deprecatedComponent: '{{ componentName }} is deprecated and should be replaced with the Dialtone Vue {{ replacement }} component.\n{{ link }}',
|
|
26
|
+
}
|
|
27
|
+
},
|
|
28
|
+
|
|
29
|
+
create(context) {
|
|
30
|
+
const deprecatedComponents = [
|
|
31
|
+
{
|
|
32
|
+
fileName: 'select_menu',
|
|
33
|
+
componentName: 'SelectMenu',
|
|
34
|
+
replacement: 'DtComboboxWithPopover',
|
|
35
|
+
link: 'https://vue.dialpad.design/?path=/story/recipes-comboboxes-combobox-with-popover--default'
|
|
36
|
+
}
|
|
37
|
+
]
|
|
38
|
+
|
|
39
|
+
//----------------------------------------------------------------------
|
|
40
|
+
// Public
|
|
41
|
+
//----------------------------------------------------------------------
|
|
42
|
+
|
|
43
|
+
return {
|
|
44
|
+
ImportDeclaration(node) {
|
|
45
|
+
let foundIndex;
|
|
46
|
+
|
|
47
|
+
deprecatedComponents.forEach(item => {
|
|
48
|
+
const regex = new RegExp(`^.*${item.fileName}(?:\\.vue)?$`, 'g');
|
|
49
|
+
foundIndex = node.source.value.toLowerCase().search(regex);
|
|
50
|
+
|
|
51
|
+
if (foundIndex !== -1) {
|
|
52
|
+
context.report({
|
|
53
|
+
node: node,
|
|
54
|
+
messageId: 'deprecatedComponent',
|
|
55
|
+
data: {
|
|
56
|
+
componentName: item.componentName,
|
|
57
|
+
replacement: item.replacement,
|
|
58
|
+
link: item.link
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
},
|
|
65
|
+
};
|
|
66
|
+
},
|
|
67
|
+
};
|
|
@@ -24,15 +24,85 @@ module.exports = {
|
|
|
24
24
|
},
|
|
25
25
|
},
|
|
26
26
|
create(context) {
|
|
27
|
-
const iconRegex = /.*@dialpad\/dialtone\/(vue\/.*|.+\.svg)/
|
|
27
|
+
const iconRegex = /.*@dialpad\/dialtone\/(vue\/.*|.+\.svg)/gim;
|
|
28
|
+
const brandIconsList = [
|
|
29
|
+
'IconAirtable',
|
|
30
|
+
'IconAmex',
|
|
31
|
+
'IconAppStoreBadge',
|
|
32
|
+
'IconApple',
|
|
33
|
+
'IconAsana',
|
|
34
|
+
'IconBrandDialpadMeetings',
|
|
35
|
+
'IconBrandDialpad',
|
|
36
|
+
'IconBullhorn',
|
|
37
|
+
'IconClockify',
|
|
38
|
+
'IconCopperCrm',
|
|
39
|
+
'IconDialpadAi',
|
|
40
|
+
'IconDinersClub',
|
|
41
|
+
'IconDiscover',
|
|
42
|
+
'IconEvernote',
|
|
43
|
+
'IconFacebook',
|
|
44
|
+
'IconFreshsalesCrm',
|
|
45
|
+
'IconFront',
|
|
46
|
+
'IconGmail',
|
|
47
|
+
'IconGoogleBusinessMessaging',
|
|
48
|
+
'IconGoogleCalendar',
|
|
49
|
+
'IconGoogleDocs',
|
|
50
|
+
'IconGoogleDrive',
|
|
51
|
+
'IconGoogleGlyph',
|
|
52
|
+
'IconGreenhouse',
|
|
53
|
+
'IconHighfive',
|
|
54
|
+
'IconHubspot',
|
|
55
|
+
'IconInstagram',
|
|
56
|
+
'IconIntercom',
|
|
57
|
+
'IconJcb',
|
|
58
|
+
'IconJiraServiceDesk',
|
|
59
|
+
'IconLineMessenger',
|
|
60
|
+
'IconLinkedin',
|
|
61
|
+
'IconMaestro',
|
|
62
|
+
'IconMastercard',
|
|
63
|
+
'IconMessenger',
|
|
64
|
+
'IconMicrosoftDynamics365',
|
|
65
|
+
'IconMicrosoftTeams',
|
|
66
|
+
'IconMicrosoft',
|
|
67
|
+
'IconMiro',
|
|
68
|
+
'IconMondayCom',
|
|
69
|
+
'IconOffice365',
|
|
70
|
+
'IconPipedrive',
|
|
71
|
+
'IconPlayStoreBadge',
|
|
72
|
+
'IconSalesforceGlyph',
|
|
73
|
+
'IconSalesforceLogo',
|
|
74
|
+
'IconServicenow',
|
|
75
|
+
'IconSlack',
|
|
76
|
+
'IconSnapchat',
|
|
77
|
+
'IconTelegram',
|
|
78
|
+
'IconTiktok',
|
|
79
|
+
'IconToggl',
|
|
80
|
+
'IconTwitter',
|
|
81
|
+
'IconUnionPay',
|
|
82
|
+
'IconViber',
|
|
83
|
+
'IconVisa',
|
|
84
|
+
'IconWeChat',
|
|
85
|
+
'IconWhatsapp',
|
|
86
|
+
'IconZendesk',
|
|
87
|
+
'IconZohoCrm',
|
|
88
|
+
'IconZohoDesk',
|
|
89
|
+
'IconZoho',
|
|
90
|
+
'IconZoom',
|
|
91
|
+
];
|
|
92
|
+
|
|
93
|
+
function isBrandIcon(source) {
|
|
94
|
+
const iconName = source.split('/').pop();
|
|
95
|
+
return brandIconsList.includes(iconName);
|
|
96
|
+
}
|
|
97
|
+
|
|
28
98
|
//----------------------------------------------------------------------
|
|
29
99
|
// Public
|
|
30
100
|
//----------------------------------------------------------------------
|
|
31
101
|
|
|
32
102
|
return {
|
|
33
103
|
ImportDeclaration(node) {
|
|
34
|
-
const matched = iconRegex.exec(node.source.value
|
|
35
|
-
if (!matched ||matched.input.includes('/brand/') || matched.input.includes('/spot/')) return;
|
|
104
|
+
const matched = iconRegex.exec(node.source.value);
|
|
105
|
+
if (!matched || matched.input.includes('/brand/') || matched.input.includes('/spot/') || isBrandIcon(matched.input)) return;
|
|
36
106
|
|
|
37
107
|
context.report({
|
|
38
108
|
node: node,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dialpad/eslint-plugin-dialtone",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "dialtone eslint plugin",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Dialpad",
|
|
@@ -26,9 +26,9 @@
|
|
|
26
26
|
"url": "https://github.com/juliodialpad"
|
|
27
27
|
},
|
|
28
28
|
{
|
|
29
|
-
"name": "
|
|
30
|
-
"email": "
|
|
31
|
-
"url": "https://github.com/
|
|
29
|
+
"name": "Ignacio Ropolo",
|
|
30
|
+
"email": "ignacio.ropolo@dialpad.com",
|
|
31
|
+
"url": "https://github.com/iropolo"
|
|
32
32
|
}
|
|
33
33
|
],
|
|
34
34
|
"repository": "git@github.com:dialpad/eslint-plugin-dialtone.git",
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @fileoverview Detects usages of old dialpad product side components which should be replaced by Dialtone components.
|
|
3
|
+
* @author Brad Paugh
|
|
4
|
+
*/
|
|
5
|
+
"use strict";
|
|
6
|
+
|
|
7
|
+
//------------------------------------------------------------------------------
|
|
8
|
+
// Requirements
|
|
9
|
+
//------------------------------------------------------------------------------
|
|
10
|
+
|
|
11
|
+
const rule = require("../../../lib/rules/deprecated-component"), RuleTester = require("eslint").RuleTester;
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
//------------------------------------------------------------------------------
|
|
15
|
+
// Tests
|
|
16
|
+
//------------------------------------------------------------------------------
|
|
17
|
+
|
|
18
|
+
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
19
|
+
ruleTester.run("deprecated-component", rule, {
|
|
20
|
+
valid: [
|
|
21
|
+
{
|
|
22
|
+
name: 'Non deprecated component',
|
|
23
|
+
code: "import MyComponent from './my_component';",
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
name: 'Component that contains select_menu in the filename, but is not the file we are looking for',
|
|
27
|
+
code: "import SelectMenuOption from '../components/select_menu_option';",
|
|
28
|
+
},
|
|
29
|
+
],
|
|
30
|
+
|
|
31
|
+
invalid: [
|
|
32
|
+
{
|
|
33
|
+
name: 'Deprecated SelectMenu',
|
|
34
|
+
code: "import SelectMenu from '../components/select_menu';",
|
|
35
|
+
errors: [
|
|
36
|
+
{
|
|
37
|
+
messageId: "deprecatedComponent"
|
|
38
|
+
}
|
|
39
|
+
],
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
name: 'Deprecated SelectMenu .vue',
|
|
43
|
+
code: "import SelectMenu from '../components/select_menu.vue';",
|
|
44
|
+
errors: [
|
|
45
|
+
{
|
|
46
|
+
messageId: "deprecatedComponent"
|
|
47
|
+
}
|
|
48
|
+
],
|
|
49
|
+
},
|
|
50
|
+
],
|
|
51
|
+
});
|
|
@@ -23,9 +23,13 @@ ruleTester.run("deprecated-icons", rule, {
|
|
|
23
23
|
code: "import svgLockIcon from '@dialpad/dialtone-icons/dist/svg/lock.svg';",
|
|
24
24
|
},
|
|
25
25
|
{
|
|
26
|
-
name: 'Brand icon import',
|
|
26
|
+
name: 'Brand SVG icon import',
|
|
27
27
|
code: "import dialpadAiIcon from '../../node_modules/@dialpad/dialtone/lib/build/svg/brand/dialpad-ai.svg';",
|
|
28
28
|
},
|
|
29
|
+
{
|
|
30
|
+
name: 'Brand VUE icon import',
|
|
31
|
+
code: "import IconDialpadAi from '@dialpad/dialtone/vue/icons/IconDialpadAi';",
|
|
32
|
+
},
|
|
29
33
|
{
|
|
30
34
|
name: 'Spot illustration import',
|
|
31
35
|
code: "import SpotBrowserTableGraph from '@dialpad/dialtone/vue/spot/SpotBrowserTableGraph';",
|