Skip to content

Commit 9817950

Browse files
authored
chore: config command UI/UX improvement. (#1643)
1 parent 07514e6 commit 9817950

File tree

12 files changed

+50
-72
lines changed

12 files changed

+50
-72
lines changed

.changeset/five-moles-care.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22
"@asyncapi/cli": patch
33
---
44

5-
Added UI/UX improvements to start command
5+
implemented new UI/UX improvements in config command

src/commands/config/analytics.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import Command from '../../core/base';
33
import { promises as fPromises } from 'fs';
44
import { homedir } from 'os';
55
import { analyticsFlags } from '../../core/flags/config/analytics.flags';
6+
import { blueBright, redBright } from 'picocolors';
67

78
const { readFile, writeFile } = fPromises;
89

@@ -26,7 +27,7 @@ export default class Analytics extends Command {
2627
this.log('\nAnalytics enabled.\n');
2728
this.metricsMetadata.analytics_enabled = flags.enable;
2829
} else if (!flags.status) {
29-
this.log('\nPlease append the "--disable" flag to the command in case you prefer to disable analytics, or use the "--enable" flag if you want to enable analytics back again. In case you do not know the analytics current status, then you can append the "--status" flag to be aware of it.\n');
30+
this.log(`\nPlease append the ${blueBright('--disable')} flag to the command if you prefer to disable analytics, or use the ${blueBright('--enable')} flag if you want to enable analytics again. To check the current analytics status, use the ${blueBright('--status')} flag.\n`);
3031
return;
3132
}
3233
await writeFile(analyticsConfigFile, JSON.stringify(analyticsConfigFileContent), { encoding: 'utf8' });
@@ -35,20 +36,20 @@ export default class Analytics extends Command {
3536
if (analyticsConfigFileContent.analyticsEnabled === 'true') {
3637
this.log('\nAnalytics are enabled.\n');
3738
} else {
38-
this.log('\nAnalytics are disabled. Please append the "--enable" flag to the command in case you prefer to enable analytics.\n');
39+
this.log(`\n${redBright('Analytics are disabled.')} To enable analytics, use the ${blueBright('--enable')} flag.\n`);
3940
}
4041
this.metricsMetadata.analytics_status_checked = flags.status;
4142
}
4243
} catch (e: any) {
4344
switch (e.code) {
4445
case 'ENOENT':
45-
this.error(`Unable to access the analytics configuration file. We tried to access the ".asyncapi-analytics" file in in the path "${analyticsConfigFile}" but the file could not be found.`);
46+
this.error(`Unable to access the analytics configuration file. We tried to access the ${blueBright('.asyncapi-analytics')} file in the path "${blueBright(analyticsConfigFile)}" but the file could not be found.`);
4647
break;
4748
case 'EEXIST':
48-
this.error(`Unable to update the analytics configuration file. We tried to update your ".asyncapi-analytics" file in the path "${analyticsConfigFile}" but the file does not exist.`);
49+
this.error(`Unable to update the analytics configuration file. We tried to update your ".asyncapi-analytics" file in the path "${blueBright(analyticsConfigFile)}" but the file does not exist.`);
4950
break;
5051
default:
51-
this.error(`Unable to change your analytics configuration. Please check the following message for further info about the error:\n\n${e}`);
52+
this.error(`Unable to change your analytics configuration. Please check the following message for further info about the error:\n\n${redBright(e)}`);
5253
}
5354
}
5455
}

src/commands/config/context/add.ts

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {
66
ContextFileWrongFormatError,
77
} from '../../../core/errors/context-error';
88
import { addFlags } from '../../../core/flags/config/context.flags';
9+
import { blueBright } from 'picocolors';
910

1011
export default class ContextAdd extends Command {
1112
static description = 'Add a context to the store';
@@ -24,24 +25,16 @@ export default class ContextAdd extends Command {
2425

2526
try {
2627
await addContext(contextName, specFilePath);
27-
this.log(
28-
`Added context "${contextName}".\n\nYou can set it as your current context: asyncapi config context use ${contextName}\nYou can use this context when needed by passing ${contextName} as a parameter: asyncapi validate ${contextName}`
29-
);
30-
28+
this.log(`🎉 Context ${blueBright(contextName)} added successfully!\nYou can set it as your current context:\n ${blueBright('asyncapi')} ${blueBright('config')} ${blueBright('context')} ${blueBright('use')} ${blueBright(contextName)}\nYou can use this context when needed by passing ${blueBright(contextName)} as a parameter:\n ${blueBright('asyncapi')} ${blueBright('validate')} ${blueBright(contextName)}`);
3129
if (setAsCurrent) {
3230
await setCurrentContext(contextName);
33-
this.log(
34-
`The newly added context "${contextName}", is set as your current context!`
35-
);
31+
this.log(`\nThe newly added context, ${blueBright(contextName)}, is set as your current context!`);
3632
}
3733
} catch (e) {
3834
if (
3935
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
4036
) {
41-
this.log(
42-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
43-
);
44-
return;
37+
this.error(`Unable to add context. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.`);
4538
}
4639
throw e;
4740
}

src/commands/config/context/current.ts

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
ContextNotFoundError,
88
} from '../../../core/errors/context-error';
99
import { helpFlag } from '../../../core/flags/global.flags';
10+
import { blueBright } from 'picocolors';
1011

1112
export default class ContextCurrent extends Command {
1213
static description = 'Shows the current context that is being used';
@@ -21,27 +22,20 @@ export default class ContextCurrent extends Command {
2122
if (
2223
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
2324
) {
24-
this.log(
25-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
26-
);
27-
return;
25+
this.error(`Unable to show current context. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.`);
2826
} else if (e instanceof ContextFileEmptyError) {
29-
this.log(`Context file "${CONTEXT_FILE_PATH}" is empty.`);
30-
return;
27+
this.error(`Context file ${blueBright(CONTEXT_FILE_PATH)} is empty.`);
3128
} else if (
3229
e instanceof ContextNotFoundError ||
3330
(fileContent && !fileContent.current)
3431
) {
35-
this.log(
36-
'No context is set as current. Run "asyncapi config context" to see all available options.'
37-
);
38-
return;
32+
this.error(`No context is set as current.\nRun ${blueBright('asyncapi config context')} to see all available options.`);
3933
}
4034
throw e;
4135
}
4236

4337
if (fileContent) {
44-
this.log(`${fileContent.current}: ${fileContent.context}`);
38+
this.log(`${blueBright(fileContent.current)}: ${fileContent.context}`);
4539
}
4640
}
4741
}

src/commands/config/context/edit.ts

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
ContextFileEmptyError,
88
} from '../../../core/errors/context-error';
99
import { helpFlag } from '../../../core/flags/global.flags';
10+
import { blueBright } from 'picocolors';
1011

1112
export default class ContextEdit extends Command {
1213
static description = 'Edit a context in the store';
@@ -23,20 +24,14 @@ export default class ContextEdit extends Command {
2324

2425
try {
2526
await editContext(contextName, newSpecFilePath);
26-
this.log(
27-
`Edited context "${contextName}".\n\nYou can set it as your current context: asyncapi config context use ${contextName}\nYou can use this context when needed by passing ${contextName} as a parameter: asyncapi validate ${contextName}`
28-
);
27+
this.log(`🎉 Context ${blueBright(contextName)} edited successfully!\nYou can set it as your current context:\n ${blueBright('asyncapi')} ${blueBright('config')} ${blueBright('context')} ${blueBright('use')} ${blueBright(contextName)}\nYou can use this context when needed by passing ${blueBright(contextName)} as a parameter:\n ${blueBright('asyncapi')} ${blueBright('validate')} ${blueBright(contextName)}`);
2928
} catch (e) {
3029
if (
3130
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
3231
) {
33-
this.log(
34-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
35-
);
36-
return;
32+
this.error(`Unable to edit context. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.`);
3733
} else if (e instanceof ContextFileEmptyError) {
38-
this.log(`Context file "${CONTEXT_FILE_PATH}" is empty.`);
39-
return;
34+
this.error(`Context file ${blueBright(CONTEXT_FILE_PATH)} is empty.`);
4035
}
4136
throw e;
4237
}

src/commands/config/context/init.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@ import { Args } from '@oclif/core';
22
import Command from '../../../core/base';
33
import { initContext } from '../../../core/models/Context';
44
import { helpFlag } from '../../../core/flags/global.flags';
5-
5+
import { blueBright } from 'picocolors';
66
export default class ContextInit extends Command {
77
static description = 'Initialize context';
88
static flags = helpFlag();
99

1010
static contextFilePathMessage = `Specify directory in which context file should be created:
11-
- current directory : asyncapi config context init . (default)
12-
- root of current repository : asyncapi config context init ./
13-
- user's home directory : asyncapi config context init ~`;
11+
- current directory : ${blueBright('asyncapi config context init .')}(default)
12+
- root of current repository : ${blueBright('asyncapi config context init ./ ')}
13+
- user's home directory : ${blueBright('asyncapi config context init ~`')}`;
1414

1515
static args = {
1616
'context-file-path': Args.string({description: `${ContextInit.contextFilePathMessage}`, required: false})
@@ -21,6 +21,6 @@ export default class ContextInit extends Command {
2121
const contextFilePath = args['context-file-path'];
2222

2323
const contextWritePath = await initContext(contextFilePath as string);
24-
this.log(`Initialized context ${contextWritePath}`);
24+
this.log(`🎉 Context initialized at ${blueBright(contextWritePath)}`);
2525
}
2626
}

src/commands/config/context/list.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
ContextFileWrongFormatError,
1010
} from '../../../core/errors/context-error';
1111
import { helpFlag } from '../../../core/flags/global.flags';
12+
import { blueBright } from 'picocolors';
1213

1314
export default class ContextList extends Command {
1415
static description = 'List all the stored contexts in the store';
@@ -19,24 +20,22 @@ export default class ContextList extends Command {
1920
const fileContent = await loadContextFile();
2021

2122
if (await isContextFileEmpty(fileContent)) {
22-
this.log(`Context file "${CONTEXT_FILE_PATH}" is empty.`);
23+
this.log(`Context file ${blueBright(CONTEXT_FILE_PATH)} is empty.`);
2324
return;
2425
}
2526

2627
if (fileContent) {
2728
for (const [contextName, filePath] of Object.entries(
2829
fileContent.store
2930
)) {
30-
this.log(`${contextName}: ${filePath}`);
31+
this.log(`${blueBright(contextName)}: ${filePath}`);
3132
}
3233
}
3334
} catch (e) {
3435
if (
3536
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
3637
) {
37-
this.log(
38-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
39-
);
38+
this.log(`Unable to list contexts. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.\n`);
4039
return;
4140
}
4241
throw e;

src/commands/config/context/remove.ts

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
ContextFileEmptyError,
88
} from '../../../core/errors/context-error';
99
import { helpFlag } from '../../../core/flags/global.flags';
10+
import { blueBright } from 'picocolors';
1011

1112
export default class ContextRemove extends Command {
1213
static description = 'Delete a context from the store';
@@ -22,18 +23,14 @@ export default class ContextRemove extends Command {
2223

2324
try {
2425
await removeContext(contextName);
25-
this.log(`${contextName} successfully deleted`);
26+
this.log(`Context ${blueBright(contextName)} removed successfully!\n`);
2627
} catch (e) {
2728
if (
2829
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
2930
) {
30-
this.log(
31-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
32-
);
33-
return;
31+
this.error(`Unable to remove context. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.`);
3432
} else if (e instanceof ContextFileEmptyError) {
35-
this.log(`Context file "${CONTEXT_FILE_PATH}" is empty.`);
36-
return;
33+
this.error(`Context file ${blueBright(CONTEXT_FILE_PATH)} is empty.`);
3734
}
3835
throw e;
3936
}

src/commands/config/context/use.ts

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
ContextFileEmptyError,
88
} from '../../../core/errors/context-error';
99
import { helpFlag } from '../../../core/flags/global.flags';
10+
import { blueBright } from 'picocolors';
1011

1112
export default class ContextUse extends Command {
1213
static description = 'Set a context as current';
@@ -22,17 +23,14 @@ export default class ContextUse extends Command {
2223

2324
try {
2425
await setCurrentContext(contextName);
25-
this.log(`${contextName} is set as current`);
26+
this.log(`Context ${blueBright(contextName)} is now set as current.`);
2627
} catch (e) {
2728
if (
2829
e instanceof (MissingContextFileError || ContextFileWrongFormatError)
2930
) {
30-
this.log(
31-
'You have no context file configured. Run "asyncapi config context init" to initialize it.'
32-
);
33-
return;
31+
this.error(`Unable to set the current context. You have no context file configured.\nRun ${blueBright('asyncapi config context init')} to initialize it.`);
3432
} else if (e instanceof ContextFileEmptyError) {
35-
this.log(`Context file "${CONTEXT_FILE_PATH}" is empty.`);
33+
this.error(`Context file ${blueBright(CONTEXT_FILE_PATH)} is empty.`);
3634
return;
3735
}
3836
throw e;

src/commands/config/versions.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import Command from '../../core/base';
22
import { helpFlag } from '../../core/flags/global.flags';
3+
import { blueBright, gray } from 'picocolors';
34

45
export default class Versions extends Command {
56
static description = 'Show versions of AsyncAPI tools used';
@@ -30,7 +31,7 @@ export default class Versions extends Command {
3031
}
3132

3233
// Showing information available with `--version` flag.
33-
this.log(this.config.userAgent);
34+
this.log(gray(`\n${this.config.userAgent}\n`));
3435

3536
// Iteration through the array containing all dependencies '@asyncapi/*'
3637
// along with their versions.
@@ -49,6 +50,6 @@ export default class Versions extends Command {
4950
}
5051
}
5152

52-
this.log(`Repository: ${this.config.pjson.homepage}`);
53+
this.log(`Repository: ${blueBright(this.config.pjson.homepage)}`);
5354
}
5455
}

0 commit comments

Comments
 (0)