format code and clean up settings

.vscode/settings.json

@@ -1,3 +1,4 @@
 {
-  "editor.insertSpaces": false
+  "editor.insertSpaces": false,
+  "editor.defaultFormatter": "esbenp.prettier-vscode"
 }

package.json

@@ -250,12 +250,12 @@
       "type": "object",
       "title": "CircleCI",
       "properties": {
-        "circleci.apiToken": {
+        "circleci-vscode.apiToken": {
           "type": "string",
           "default": null,
           "markdownDescription": "A CircleCI API Token. This can be generated on your [Personal API Tokens](https://app.circleci.com/settings/user/tokens) page."
         },
-        "circleci.VCSProvider": {
+        "circleci-vscode.VcsProvider": {
           "type": "string",
           "default": "github",
           "enum": [
@@ -268,7 +268,7 @@
           ],
           "description": "Your VCS Provider."
         },
-        "circleci.customBranches": {
+        "circleci-vscode.customBranches": {
           "type": "array",
           "items": {
             "type": "string"
@@ -278,23 +278,23 @@
           ],
           "description": "Add any custom branches you'd like to list Pipelines for. These will be displayed in addition to the currently checked-out branch."
         },
-        "circleci.autoLoadWorkflows": {
+        "circleci-vscode.autoLoadWorkflows": {
           "type": "boolean",
           "default": true,
-          "markdownDescription": "Automatically load Pipeline Workflows."
+          "description": "Automatically load Pipeline Workflows."
         },
-        "circleci.autoLoadWorkflowJobs": {
+        "circleci-vscode.autoLoadWorkflowJobs": {
           "type": "boolean",
           "default": true,
-          "markdownDescription": "Automatically load Workflow Jobs."
+          "description": "Automatically load Workflow Jobs."
         },
-        "circleci.pipelineReloadInterval": {
+        "circleci-vscode.pipelineReloadInterval": {
           "type": "number",
           "default": 120,
           "minimum": 0,
           "markdownDescription": "Seconds to wait before reloading all Pipelines. This will load in any new Workflows. Set to `0` to disable."
         },
-        "circleci.workflowReloadInterval": {
+        "circleci-vscode.workflowReloadInterval": {
           "type": "number",
           "default": 10,
           "minimum": 0,

src/extension.ts

@@ -1,4 +1,10 @@
-import { window, workspace, ExtensionContext, Disposable, extensions, commands } from 'vscode';
+import {
+  window,
+  workspace,
+  ExtensionContext,
+  Disposable,
+  extensions,
+} from 'vscode';
 import constants from './lib/constants';
 import config from './lib/config';
 import gitService from './lib/git-service';
@@ -7,7 +13,7 @@ import PipelinesTree from './lib/pipelines-tree';
 import registerGlobalCommands from './lib/global-commands';
 import WelcomeWebView from './views/welcome-webview';
 import UpgradeWebView from './views/upgrade-webview';
-import { l, splitVersion } from './lib/utils';
+import { splitVersion } from './lib/utils';
 
 let pipelinesTree: PipelinesTree;
 let exportedContext: ExtensionContext;
@@ -18,7 +24,9 @@ export async function activate(context: ExtensionContext): Promise<void> {
 
   const extension = extensions.getExtension(constants.EXTENSION_ID)!;
   const currentVersion = extension.packageJSON.version;
-  const previousVersion = context.globalState.get<string>(constants.EXTENSION_VERSION);
+  const previousVersion = context.globalState.get<string>(
+    constants.EXTENSION_VERSION
+  );
 
   if (!workspace.workspaceFolders || !workspace.workspaceFolders.length) {
     // NOTE: This was getting annoying. Maybe we can
@@ -63,41 +71,44 @@ export async function activate(context: ExtensionContext): Promise<void> {
 
 export function deactivate(): void {
   pipelinesTree && pipelinesTree.dispose();
-  globalCommands.forEach(command => command.dispose());
+  globalCommands.forEach((command) => command.dispose());
 }
 
-async function showStartupView(currentVersion: string, previousVersion: string | undefined) {
+async function showStartupView(
+  currentVersion: string,
+  previousVersion: string | undefined
+): Promise<void> {
   const welcomeWebView = new WelcomeWebView(currentVersion);
   const upgradeWebView = new UpgradeWebView(currentVersion);
 
-	if (previousVersion === undefined) {
-		return welcomeWebView.show();
-	}
+  if (previousVersion === undefined) {
+    return welcomeWebView.show();
+  }
 
   const [currentMajor, currentMinor] = splitVersion(currentVersion);
   const [previousMajor, previousMinor] = splitVersion(previousVersion);
 
   // Don't do anything if...
-	if (
+  if (
     // The versions are the same major and minor
     (currentMajor === previousMajor && currentMinor === previousMinor) ||
     // A major downgrade occurred
     currentMajor < previousMajor ||
     // A minor downgrade occurred
     (currentMajor === previousMajor && currentMinor < previousMinor)
-	) {
-		return;
-	}
+  ) {
+    return;
+  }
 
   // Show upgrade view if...
-	if (
+  if (
     // A major upgrade occurred
     currentMajor !== previousMajor ||
     // A minor upgrade occurred
     (currentMajor === previousMajor && currentMinor > previousMinor)
   ) {
-		upgradeWebView.show();
-	}
+    upgradeWebView.show();
+  }
 }
 
 export function getContext(): ExtensionContext {

src/lib/config.ts

@@ -13,7 +13,7 @@ export class Config {
   }
 
   get(key: keyof ConfigItems): ConfigItems[typeof key] {
-    const config = workspace.getConfiguration('circleci');
+    const config = workspace.getConfiguration('circleci-vscode');
     return config[key] as ConfigItems[typeof key];
   }
 

src/lib/git-service.ts

@@ -14,7 +14,7 @@ export class GitService {
 
   private changeCallback?: () => void;
 
-  constructor(public vcs: ConfigItems['VCSProvider']) {
+  constructor(public vcs: ConfigItems['VcsProvider']) {
     this.rootPath = workspace.workspaceFolders![0].uri.fsPath;
   }
 
@@ -108,7 +108,7 @@ export class GitService {
 export default async function gitService(): Promise<GitService> {
   if (!exportedService) {
     exportedService = new GitService(
-      config().get(ConfigKey.VCSProvider) as ConfigItems['VCSProvider']
+      config().get(ConfigKey.VcsProvider) as ConfigItems['VcsProvider']
     );
     await exportedService.setup();
   }

src/lib/types.ts

@@ -1,6 +1,6 @@
 export enum ConfigKey {
   APIToken = 'apiToken',
-  VCSProvider = 'VCSProvider',
+  VcsProvider = 'VcsProvider',
   CustomBranches = 'customBranches',
   AutoLoadWorkflows = 'autoLoadWorkflows',
   AutoLoadWorkflowJobs = 'autoLoadWorkflowJobs',
@@ -15,7 +15,7 @@ export type ConfigItems = {
   [ConfigKey.AutoLoadWorkflowJobs]: boolean;
   [ConfigKey.PipelineReloadInterval]: number;
   [ConfigKey.WorkflowReloadInterval]: number;
-  [ConfigKey.VCSProvider]: 'github' | 'bitbucket';
+  [ConfigKey.VcsProvider]: 'github' | 'bitbucket';
 };
 
 export type GitSet = {

src/lib/utils.ts

@@ -139,6 +139,6 @@ export function interpolate(
   }, value);
 }
 
-export function splitVersion(version: string) {
-  return version.split('.').map(v => parseInt(v, 10));
+export function splitVersion(version: string): number[] {
+  return version.split('.').map((v) => parseInt(v, 10));
 }

src/views/job-tests.ts

@@ -1,4 +1,9 @@
-import { commands, Disposable, TreeItem, TreeItemCollapsibleState } from 'vscode';
+import {
+  commands,
+  Disposable,
+  TreeItem,
+  TreeItemCollapsibleState,
+} from 'vscode';
 import constants from '../lib/constants';
 import { getAsset, l } from '../lib/utils';
 import Job from './job';

src/views/job.ts

@@ -1,12 +1,18 @@
-import { Disposable, env, TreeItem, TreeItemCollapsibleState, window } from 'vscode';
+import {
+  Disposable,
+  env,
+  TreeItem,
+  TreeItemCollapsibleState,
+  window,
+} from 'vscode';
 import { Job as JobData } from 'circle-client';
 import constants from '../lib/constants';
 import {
   getAsset,
   interpolate,
   openInBrowser,
   statusDescriptions,
-  l
+  l,
 } from '../lib/utils';
 import circleClient from '../lib/circle-client';
 import Workflow from './workflow';
@@ -54,7 +60,6 @@ export default class Job extends TreeItem implements Disposable {
     } else {
       return statusDescriptions['loading'];
     }
-
   }
 
   private statusIcon(status?: string): string {
@@ -68,7 +73,9 @@ export default class Job extends TreeItem implements Disposable {
   }
 
   private loadDetails(): void {
-    if (this.job.type !== 'build') { return; }
+    if (this.job.type !== 'build') {
+      return;
+    }
 
     circleClient().then((client) => {
       client
@@ -105,7 +112,7 @@ export default class Job extends TreeItem implements Disposable {
   }
 
   disposeRows(): void {
-    this.rows.forEach(row => {
+    this.rows.forEach((row) => {
       if ('dispose' in row) {
         // @ts-ignore
         row.dispose();
@@ -172,7 +179,10 @@ export default class Job extends TreeItem implements Disposable {
       );
     }
 
-    (await circleClient()).approveWorkflowJob(this.workflow.workflow.id, this.job.approval_request_id!);
+    (await circleClient()).approveWorkflowJob(
+      this.workflow.workflow.id,
+      this.job.approval_request_id!
+    );
     window.showInformationMessage(l('jobCanceled', 'Job approved.'));
     setTimeout(this.reload.bind(this), 1000);
   }

src/views/resources-item.ts

@@ -4,7 +4,9 @@ import Loader from './loader';
 import Empty from './empty';
 import { l } from '../lib/utils';
 
-export default abstract class ResourcesItem extends TreeItem implements Disposable {
+export default abstract class ResourcesItem
+  extends TreeItem
+  implements Disposable {
   protected prefixRows: TreeItem[] = [];
   protected mainRows: TreeItem[] = [];
   private allRows: TreeItem[] = [];
@@ -23,7 +25,7 @@ export default abstract class ResourcesItem extends TreeItem implements Disposab
   }
 
   dispose(): void {
-    this.allRows.forEach(row => {
+    this.allRows.forEach((row) => {
       if ('dispose' in row) {
         // @ts-ignore
         row.dispose();
@@ -104,7 +106,7 @@ export default abstract class ResourcesItem extends TreeItem implements Disposab
   }
 
   disposeRows(): void {
-    this.allRows.forEach(row => {
+    this.allRows.forEach((row) => {
       if ('dispose' in row) {
         // @ts-ignore
         row.dispose();

src/webviews/assets/components/CTAButton/index.tsx

@@ -4,7 +4,7 @@ import './index.scss';
 const CTAButton = ({
   text,
   href,
-  onClick
+  onClick,
 }: {
   text: string;
   href?: string;

src/webviews/assets/components/JobTests/index.tsx

@@ -14,7 +14,9 @@ const JobTests = ({ vscode }: { vscode: any }): JSX.Element => {
   const [tests, setTests] = useState<JobTest[]>([]);
   const [hasMore, setHasMore] = useState<boolean>(true);
   const [query, setQuery] = useState<string | null>(null);
-  const [sortBy, setSortBy] = useState<'status' | 'alphabetically' | 'duration'>('status');
+  const [sortBy, setSortBy] = useState<
+    'status' | 'alphabetically' | 'duration'
+  >('status');
 
   useEffect(() => {
     if (!jobDetails) {
@@ -25,7 +27,7 @@ const JobTests = ({ vscode }: { vscode: any }): JSX.Element => {
             case constants.TEST_DATA_WEBVIEW_EVENT:
               if (!initLoaded) {
                 setInitLoaded(true);
-                setInitHasTests(!!(data.data.tests.length));
+                setInitHasTests(!!data.data.tests.length);
               }
 
               setTests((existing) => existing.concat(data.data.tests));
@@ -55,15 +57,17 @@ const JobTests = ({ vscode }: { vscode: any }): JSX.Element => {
   }
 
   if (sortBy === 'status') {
-    filteredTests.sort((a, b) => a.result.localeCompare(b.result))
+    filteredTests.sort((a, b) => a.result.localeCompare(b.result));
   }
 
   if (sortBy === 'alphabetically') {
-    filteredTests.sort((a, b) => a.classname.localeCompare(b.classname))
+    filteredTests.sort((a, b) => a.classname.localeCompare(b.classname));
   }
 
   if (sortBy === 'duration') {
-    filteredTests.sort((a, b) => { return b.run_time - a.run_time })
+    filteredTests.sort((a, b) => {
+      return b.run_time - a.run_time;
+    });
   }
 
   if (!jobDetails) {
@@ -72,8 +76,27 @@ const JobTests = ({ vscode }: { vscode: any }): JSX.Element => {
 
   return (
     <>
-      <TestsHeader {...{ jobDetails, query, setQuery, hasTests: initHasTests, sortBy, setSortBy }} />
-      <TestResults {...{ vscode, query, setQuery, tests: filteredTests, hasMore, loaded: initLoaded, hasTests: initHasTests } }/>
+      <TestsHeader
+        {...{
+          jobDetails,
+          query,
+          setQuery,
+          hasTests: initHasTests,
+          sortBy,
+          setSortBy,
+        }}
+      />
+      <TestResults
+        {...{
+          vscode,
+          query,
+          setQuery,
+          tests: filteredTests,
+          hasMore,
+          loaded: initLoaded,
+          hasTests: initHasTests,
+        }}
+      />
     </>
   );
 };