@dialpad/eslint-plugin-dialtone 1.0.2 → 1.1.1
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.
- package/docs/rules/{old-svg-icons.md → deprecated-icons.md} +13 -2
- package/lib/rules/deprecated-icons.js +114 -0
- package/package.json +1 -1
- package/tests/lib/rules/{old-svg-icons.js → deprecated-icons.js} +28 -7
- package/docs/rules/old-vue-icons.md +0 -21
- package/lib/rules/old-svg-icons.js +0 -51
- package/lib/rules/old-vue-icons.js +0 -50
- package/tests/lib/rules/old-vue-icons.js +0 -34
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
# Finds
|
|
1
|
+
# Finds deprecated dialtone svg and vue icons usage (deprecated-icons)
|
|
2
2
|
|
|
3
3
|
We separated icons from dialtone into dialtone-icons repo,
|
|
4
|
-
so we are deprecating old svg icons on dialtone once the migrations are finished.
|
|
4
|
+
so we are deprecating old svg and vue icons on dialtone once the migrations are finished.
|
|
5
5
|
|
|
6
6
|
## Rule Details
|
|
7
7
|
|
|
@@ -12,6 +12,8 @@ Examples of **incorrect** code for this rule:
|
|
|
12
12
|
```js
|
|
13
13
|
import svgLockIcon from '@dialpad/dialtone/lib/build/svg/system/lock.svg';
|
|
14
14
|
import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/dist/svg/system/lock.svg';
|
|
15
|
+
import IconSettings from '@dialpad/dialtone/vue/icons/IconSettings';
|
|
16
|
+
import IconSettings from '../node_modules/@dialpad/dialtone/vue/icons/IconSettings';
|
|
15
17
|
```
|
|
16
18
|
|
|
17
19
|
Examples of **correct** code for this rule:
|
|
@@ -26,3 +28,12 @@ import svgLockIcon from '@dialpad/dialtone-icons/dist/svg/lock.svg';
|
|
|
26
28
|
import { DtIcon } from '@dialpad/dialtone-vue';
|
|
27
29
|
<dt-icon name="lock" />
|
|
28
30
|
```
|
|
31
|
+
|
|
32
|
+
## Exceptions
|
|
33
|
+
|
|
34
|
+
For now, we are allowing the importing of `brand` and `spot illustrations` icons from dialtone, so this rule will not trigger if you import an
|
|
35
|
+
icon like:
|
|
36
|
+
|
|
37
|
+
```js
|
|
38
|
+
import dialpadAiIcon from '../../node_modules/@dialpad/dialtone/lib/build/svg/brand/dialpad-ai.svg';
|
|
39
|
+
```
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @fileoverview Finds old dialtone svg icons usage
|
|
3
|
+
* @author julio ortega
|
|
4
|
+
*/
|
|
5
|
+
"use strict";
|
|
6
|
+
|
|
7
|
+
//------------------------------------------------------------------------------
|
|
8
|
+
// Rule Definition
|
|
9
|
+
//------------------------------------------------------------------------------
|
|
10
|
+
|
|
11
|
+
/** @type {import('eslint').Rule.RuleModule} */
|
|
12
|
+
module.exports = {
|
|
13
|
+
meta: {
|
|
14
|
+
type: 'suggestion', // `problem`, `suggestion`, or `layout`
|
|
15
|
+
docs: {
|
|
16
|
+
description: 'Finds deprecated svg and vue icon imports from dialtone',
|
|
17
|
+
recommended: false,
|
|
18
|
+
url: 'https://github.com/dialpad/eslint-plugin-dialtone/blob/main/docs/rules/deprecated-icons.md', // URL to the documentation page for this rule
|
|
19
|
+
},
|
|
20
|
+
fixable: null, // Or `code` or `whitespace`
|
|
21
|
+
schema: [], // Add a schema if the rule has options
|
|
22
|
+
messages: {
|
|
23
|
+
avoidDeprecatedImport: 'Avoid usage of old dialtone icons [deprecated]. Check https://dialpad.design/components/icon.html for details.',
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
create(context) {
|
|
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
|
+
|
|
98
|
+
//----------------------------------------------------------------------
|
|
99
|
+
// Public
|
|
100
|
+
//----------------------------------------------------------------------
|
|
101
|
+
|
|
102
|
+
return {
|
|
103
|
+
ImportDeclaration(node) {
|
|
104
|
+
const matched = iconRegex.exec(node.source.value);
|
|
105
|
+
if (!matched || matched.input.includes('/brand/') || matched.input.includes('/spot/') || isBrandIcon(matched.input)) return;
|
|
106
|
+
|
|
107
|
+
context.report({
|
|
108
|
+
node: node,
|
|
109
|
+
messageId: 'avoidDeprecatedImport',
|
|
110
|
+
});
|
|
111
|
+
}
|
|
112
|
+
};
|
|
113
|
+
},
|
|
114
|
+
};
|
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
// Requirements
|
|
9
9
|
//------------------------------------------------------------------------------
|
|
10
10
|
|
|
11
|
-
const rule = require("../../../lib/rules/
|
|
11
|
+
const rule = require("../../../lib/rules/deprecated-icons"), RuleTester = require("eslint").RuleTester;
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
//------------------------------------------------------------------------------
|
|
@@ -16,12 +16,24 @@ const rule = require("../../../lib/rules/old-svg-icons"), RuleTester = require("
|
|
|
16
16
|
//------------------------------------------------------------------------------
|
|
17
17
|
|
|
18
18
|
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
19
|
-
ruleTester.run("
|
|
19
|
+
ruleTester.run("deprecated-icons", rule, {
|
|
20
20
|
valid: [
|
|
21
21
|
{
|
|
22
22
|
name: 'New icon import',
|
|
23
23
|
code: "import svgLockIcon from '@dialpad/dialtone-icons/dist/svg/lock.svg';",
|
|
24
24
|
},
|
|
25
|
+
{
|
|
26
|
+
name: 'Brand SVG icon import',
|
|
27
|
+
code: "import dialpadAiIcon from '../../node_modules/@dialpad/dialtone/lib/build/svg/brand/dialpad-ai.svg';",
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
name: 'Brand VUE icon import',
|
|
31
|
+
code: "import IconDialpadAi from '@dialpad/dialtone/vue/icons/IconDialpadAi';",
|
|
32
|
+
},
|
|
33
|
+
{
|
|
34
|
+
name: 'Spot illustration import',
|
|
35
|
+
code: "import SpotBrowserTableGraph from '@dialpad/dialtone/vue/spot/SpotBrowserTableGraph';",
|
|
36
|
+
},
|
|
25
37
|
{
|
|
26
38
|
name: 'Dialtone Styles import',
|
|
27
39
|
code: "import dialtoneCSS from '@dialpad/dialtone/lib/build/less/dialtone.less';",
|
|
@@ -30,22 +42,31 @@ ruleTester.run("old-svg-icons", rule, {
|
|
|
30
42
|
|
|
31
43
|
invalid: [
|
|
32
44
|
{
|
|
33
|
-
name: 'Old icon import from build',
|
|
45
|
+
name: 'Old SVG icon import from build',
|
|
34
46
|
code: "import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/build/svg/system/lock.svg';",
|
|
35
47
|
errors: [
|
|
36
48
|
{
|
|
37
|
-
messageId: "
|
|
49
|
+
messageId: "avoidDeprecatedImport"
|
|
38
50
|
}
|
|
39
51
|
],
|
|
40
52
|
},
|
|
41
53
|
{
|
|
42
|
-
name: 'Old icon import from dist',
|
|
54
|
+
name: 'Old SVG icon import from dist',
|
|
43
55
|
code: "import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/dist/svg/system/lock.svg';",
|
|
44
56
|
errors: [
|
|
45
57
|
{
|
|
46
|
-
messageId: "
|
|
58
|
+
messageId: "avoidDeprecatedImport"
|
|
47
59
|
}
|
|
48
60
|
],
|
|
49
|
-
}
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
name: 'Old VUE icon import',
|
|
64
|
+
code: "import IconSettings from '@dialpad/dialtone/vue/icons/IconSettings';",
|
|
65
|
+
errors: [
|
|
66
|
+
{
|
|
67
|
+
messageId: "avoidDeprecatedImport"
|
|
68
|
+
}
|
|
69
|
+
],
|
|
70
|
+
},
|
|
50
71
|
],
|
|
51
72
|
});
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
# Finds old dialtone vue icons usage (old-vue-icons)
|
|
2
|
-
|
|
3
|
-
We separated icons from dialtone into dialtone-icons repo,
|
|
4
|
-
so we are deprecating old vue icons on dialtone once the migrations are finished.
|
|
5
|
-
|
|
6
|
-
## Rule Details
|
|
7
|
-
|
|
8
|
-
This rule aims to inform developers that they're importing icons from dialtone instead of using dtIcon component from dialtone-vue.
|
|
9
|
-
|
|
10
|
-
Examples of **incorrect** code for this rule:
|
|
11
|
-
|
|
12
|
-
```js
|
|
13
|
-
import IconSettings from '@dialpad/dialtone/vue/icons/IconSettings';
|
|
14
|
-
```
|
|
15
|
-
|
|
16
|
-
Examples of **correct** code for this rule:
|
|
17
|
-
|
|
18
|
-
```js
|
|
19
|
-
import { DtIcon } from '@dialpad/dialtone-vue';
|
|
20
|
-
<dt-icon name="settings" />
|
|
21
|
-
```
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Finds old dialtone svg icons usage
|
|
3
|
-
* @author julio ortega
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Rule Definition
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
/** @type {import('eslint').Rule.RuleModule} */
|
|
12
|
-
module.exports = {
|
|
13
|
-
meta: {
|
|
14
|
-
type: 'suggestion', // `problem`, `suggestion`, or `layout`
|
|
15
|
-
docs: {
|
|
16
|
-
description: 'Finds old svg icons imports from dialtone',
|
|
17
|
-
recommended: false,
|
|
18
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/blob/main/docs/rules/old-svg-icons.md', // URL to the documentation page for this rule
|
|
19
|
-
},
|
|
20
|
-
fixable: null, // Or `code` or `whitespace`
|
|
21
|
-
schema: [], // Add a schema if the rule has options
|
|
22
|
-
messages: {
|
|
23
|
-
avoidSVGImport: 'Avoid usage of old dialtone icons [deprecated]. Check https://dialpad.design/components/icon.html for details.',
|
|
24
|
-
},
|
|
25
|
-
},
|
|
26
|
-
create(context) {
|
|
27
|
-
// variables should be defined here
|
|
28
|
-
|
|
29
|
-
//----------------------------------------------------------------------
|
|
30
|
-
// Helpers
|
|
31
|
-
//----------------------------------------------------------------------
|
|
32
|
-
|
|
33
|
-
// any helper functions should go here or else delete this section
|
|
34
|
-
|
|
35
|
-
//----------------------------------------------------------------------
|
|
36
|
-
// Public
|
|
37
|
-
//----------------------------------------------------------------------
|
|
38
|
-
|
|
39
|
-
return {
|
|
40
|
-
ImportDeclaration(node) {
|
|
41
|
-
const foundIndex = node.source.value.toLowerCase().search(/@dialpad\/dialtone\/.*\.svg/g);
|
|
42
|
-
if (foundIndex === -1) return;
|
|
43
|
-
|
|
44
|
-
context.report({
|
|
45
|
-
node: node,
|
|
46
|
-
messageId: 'avoidSVGImport',
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
},
|
|
51
|
-
};
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Finds old dialtone vue icons usage
|
|
3
|
-
* @author julio ortega
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Rule Definition
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
/** @type {import('eslint').Rule.RuleModule} */
|
|
12
|
-
module.exports = {
|
|
13
|
-
meta: {
|
|
14
|
-
type: 'suggestion', // `problem`, `suggestion`, or `layout`
|
|
15
|
-
docs: {
|
|
16
|
-
description: 'Finds old vue icons imports from dialtone',
|
|
17
|
-
recommended: false,
|
|
18
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/blob/main/docs/rules/old-vue-icons.md', // URL to the documentation page for this rule
|
|
19
|
-
},
|
|
20
|
-
fixable: null, // Or `code` or `whitespace`
|
|
21
|
-
schema: [], // Add a schema if the rule has options
|
|
22
|
-
messages: {
|
|
23
|
-
avoidVueImport: 'Avoid usage of old dialtone vue icons [deprecated]. Use DtIcon component instead https://vue.dialpad.design/?path=/docs/components-icon--default'
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
create(context) {
|
|
28
|
-
// variables should be defined here
|
|
29
|
-
|
|
30
|
-
//----------------------------------------------------------------------
|
|
31
|
-
// Helpers
|
|
32
|
-
//----------------------------------------------------------------------
|
|
33
|
-
|
|
34
|
-
// any helper functions should go here or else delete this section
|
|
35
|
-
|
|
36
|
-
//----------------------------------------------------------------------
|
|
37
|
-
// Public
|
|
38
|
-
//----------------------------------------------------------------------
|
|
39
|
-
|
|
40
|
-
return {
|
|
41
|
-
ImportDeclaration(node) {
|
|
42
|
-
if (!node.source.value.toLowerCase().includes('@dialpad/dialtone/vue')) return;
|
|
43
|
-
context.report({
|
|
44
|
-
node: node,
|
|
45
|
-
messageId: 'avoidVueImport',
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
},
|
|
50
|
-
};
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Finds old dialtone vue icons usage
|
|
3
|
-
* @author julio ortega
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Requirements
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const rule = require("../../../lib/rules/old-vue-icons"), RuleTester = require("eslint").RuleTester;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
//------------------------------------------------------------------------------
|
|
15
|
-
// Tests
|
|
16
|
-
//------------------------------------------------------------------------------
|
|
17
|
-
|
|
18
|
-
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
19
|
-
ruleTester.run("old-vue-icons", rule, {
|
|
20
|
-
valid: [
|
|
21
|
-
{
|
|
22
|
-
name: 'Dialtone-vue DtIcon import',
|
|
23
|
-
code: "import { DtIcon } from '@dialpad/dialtone-vue';",
|
|
24
|
-
},
|
|
25
|
-
],
|
|
26
|
-
|
|
27
|
-
invalid: [
|
|
28
|
-
{
|
|
29
|
-
name: 'Dialtone vue icon import',
|
|
30
|
-
code: "import IconSettingsOld from '@dialpad/dialtone/vue/icons/IconSettings';",
|
|
31
|
-
errors: [{ messageId: 'avoidVueImport' }],
|
|
32
|
-
},
|
|
33
|
-
],
|
|
34
|
-
});
|