Merge pull request #149 from HubSpot/v1.0.0

v1.0.0 Release

.eslintrc.js

@@ -14,7 +14,7 @@ module.exports = {
     'no-console': 'off',
     'no-return-await': 'error',
   },
-  ignorePatterns: ['/dist'],
+  ignorePatterns: ['/dist', '/node_modules', '/tmp'],
   overrides: [
     {
       files: ['**/__tests__/**/*.js', '**/__mocks__/**/*.js'],

.gitignore

@@ -114,5 +114,7 @@ dist
 # End of https://www.toptal.com/developers/gitignore/api/node
 
 .DS_store
-tmp
+
 hubspot.config.yml
+tmp
+.wdio-vscode-service

.prettierignore

@@ -2,4 +2,6 @@ snippets/auto_gen
 package-lock.json
 package.json
 .vscode
+.wdio-vscode-service
 dist
+tmp

.vscodeignore

@@ -8,3 +8,6 @@ generate.js
 LICENSE
 scripts/**
 node_modules/**
+.wdio-vscode-service
+test
+wdio.conf.ts

CHANGELOG.md

@@ -1,48 +1,67 @@
 # Change Log
+
 All notable changes to the HubSpot VS Code extension will be documented in this file.
 
+## [Unreleased]
+
+- Adds authorization flow for HubSpot accounts
+- Converts files to TypeScript
+- Bumps dependency version of `cli-lib` to 4.1.2
+
 ## [0.10.0]
+
 - Updated snippet definitions
 - Improved `dnd_area` snippets
 - Updated language definitions
 - Added a new "Beta" flag in settings
 - Added inline HubL error linting (available with "Beta" features enabled)
+
 ## [0.2.1]
+
 - Support for CSS and HTML files through the CSS + HUBL and HTML + HUBL languages
 - Fixed incorrectly configured snippets
 
 ## [0.2.0]
+
 - Generation script converted to node.js
 - Updated closing tag support
 
 ## [0.1.2]
+
 - Added support for custom modules field.json
 
 ## [0.1.3]
+
 - Adds support for local custom module development snippets
 
 ## [0.1.1]
+
 - Basic support for HubL tags which have a closing tag
 
 ## [0.1.0]
+
 - Updates to auto_gen HubL Snippets
 - Get this puppy to 1.0!
 
 ## [0.0.4]
+
 - Added HubL Color and Font Variable support
 - Added HubL Email Variable and Alias support
 - Added HubL Email Required Template Variables support
 
 ## [0.0.3]
+
 - Update READEME to reflect `|` filter prefix
 
 ## [0.0.2]
+
 - HubL tags now output with a line break for each paramter
 - Includes expression tests
 - Basic HubL doc and blog doc support
 - Support common HubL variables
 
 ## [0.0.1]
+
 - Initial release
 - Filters, functions and tags as snippets
 - Some lang config for easy HubL wrapping and auto complete

README.md

@@ -1,92 +1,58 @@
-# HubSpot Visual Studio Code Extension
-For :rocket: fast HubSpot CMS Hub development.
+<h1 align="center">
+  <br>
+    <img src="https://github.com/HubSpot/hubspot-cms-vscode/blob/master/images/hubspot-logo.png?raw=true" alt="HubSpot Logo" width="150">
+  <br>
+  HubSpot for Visual Studio Code
+  <br>
+  <br>
+</h1>
 
-This extension currently supports:
-- Syntax highlighting for the [HubL templating language](https://designers.hubspot.com/docs/hubl/intro-to-hubl)
-- Autocomplete for common HubL tags, filters, and functions
-- Bracket wrapping, indentation, and other helpful editor features
+For fast HubSpot CMS Hub development right inside your editor.
 
-If you're new to CMS Hub, check out how to [get started with local development.](https://designers.hubspot.com/docs/tools/local-development)
+The new HubSpot panel in the activity bar provides developers with quick views and commands to manage their connected accounts with HubSpot, extending some of the functionality of the HubSpot command line interface into the editor directly. Additionally, the extension performs features such as language support, syntax highlighting for the [HubL templating language](https://designers.hubspot.com/docs/hubl/intro-to-hubl), as well as autocomplete for common HubL tags, filters, and functions.
 
-## Getting Started
-This extension introduces new file languages: `HTML + HUBL` and `HTML + CSS`. In order to use these new features, you'll want to make sure you've told VSCode to use these languages. For one-off files, you can simply change the language in the lower right hand corner of your screen. However, we recommend adjusting your file associations under your User or Workspace preferences so HubL syntax highlighting will automatically be applied to all of your projects:
-- In VSCode, press `CMD` + `SHIFT` + `P` to open the command prompt
-- Search for and select the command `Preferences: Open Settings (UI)`
-- Choose either the "User" or "Workspace" tab
+<!-- TODO: Link 'HubSpot Developer Docs' text to CMS Dev Docs url when they are live -->
+To read more about this extension and its features, please see the documentation at the HubSpot Developer Docs. If you're new to CMS Hub, check out [how to get started with local development](https://designers.hubspot.com/docs/tools/local-development).
+
+## Settings
+
+We provide developers with the ability to opt in or out of particular functionality within the extension. You can find those settings by going to `Settings > Extensions > HubSpot`.
+
+### Language Modes
+
+This extension introduces new file languages: `HTML + HUBL` and `CSS + HUBL`. In order to use the full set of features from the extension, VS Code needs to be aware of these languages and how they are associated with various file types. For one-off files, you can simply change the Language Mode in the lower right hand status bar of the editor. However, we recommend adjusting your file associations under your User or Workspace preferences so HubL syntax highlighting will automatically be applied to all of your projects:
+
+- In VSCode, press `CMD + SHIFT + P` to open the command prompt
+- Search for and select the command `Preferences: Open User Settings`
+- Choose either the "User" or "Workspace" tab to apply these settings
 - In "Search settings" look up `files.associations`
 - Select "Add Item" and add these file associations: `*.html: html-hubl` and `*.css: css-hubl`
+- For more information about how VSCode settings work, [please read the official VS Code documentation](https://code.visualstudio.com/docs/getstarted/settings).
+
+### Enabling Emmet for HTML/HubL files
+
+To enable Emmet on your `html-hubl` files, you can map `html-hubl` to `html` in your settings under "Emmet: Include Languages"
+
+![VS Code Setting for Emmet](https://user-images.githubusercontent.com/9009552/114593899-9e320500-9c5a-11eb-98c6-9de022344ebc.png)
+
+### IntelliSense Suggestions
+
+If you are would like to get IntelliSense suggestions when in snippet placeholders, you will need to add the following to your user settings:
+
+`"editor.suggest.snippetsPreventQuickSuggestions": false`
+
+For parameter suggestions, the following should also be added:
+
+`"editor.parameterHints": true`
+
+## Telemetry
+
+HubSpot for VS Code collects user data in order to improve the extension’s experience. You can [review HubSpot’s privacy policy here](https://legal.hubspot.com/privacy-policy). Additionally, you may opt out of data collection by changing the setting for global telemetry in VS Code. To read more about VS Code and telemetry, including disabling telemetry reporting, [please read the official VS Code documentation](https://code.visualstudio.com/docs/getstarted/telemetry).
+
+## Pre-releases
+
+Often times, new versions of our extension will be available to you via a pre-release before official releases are made. You can opt into these pre-releases via the VS Code extension panel. These pre-releases may include beta features that we are currently in development on.
+
+## Contributing
 
-For more information about how VSCode settings work, [check out the docs](https://code.visualstudio.com/docs/getstarted/settings).
-
-## Features
-
-### Syntax Highlighting
-HubL syntax highlighting is supported for `.html` and `.css` files support HubL syntax highlighting.
-
-_Thanks to the [Better Jinja](https://github.com/samuelcolvin/jinjahtml-vscode) extension for inspiration._
-
-### Editor Features
-- Statement wrapping (Supports `{%%}`,`{##}`,`{{}}`)
-- Block comment toggling: Press `CMD` + `/` to create HubL comments
-- Block level indentation: Text inside of `{% block %}` will be indented automatically
-
-### HubL Snippets
-All HubL supported tags, filters, expression tests and functions have auto-complete snippets. A prefix is required to access some auto completions:
-
-- [Expression tests](https://developers.hubspot.com/docs/cms/hubl/operators-and-expression-tests#expression-tests) are accessed by typing the test name alone. Ex: `di` > Enter produces:
-```
-divisibleby
-```
-- [Filters](https://developers.hubspot.com/docs/cms/hubl/filters) are accessed with `|`. Ex: `|se` > Enter produces:
-```
-|selectattr("${attr}", ${exp_test})
-```
-- [Functions](https://developers.hubspot.com/docs/cms/hubl/functions) and [tags](https://developers.hubspot.com/docs/cms/hubl/tags) are accessed with `~`. Ex: `~hub` > Enter produces:
-```
-hubdb_table_rows(${table_id}, ${query})
-```
-- [HubL supported variables](https://developers.hubspot.com/docs/cms/hubl/variables) are accessed by typing the variable name alone. Ex: `content.ab` > Enter produces:
-```
-content.absolute_url
-```
-- [Module fields](https://developers.hubspot.com/docs/cms/building-blocks/module-theme-fields-overview) can be access by typing the field type (in JSON files only). Ex: `ri` > Enter produces:
-```
-{
-"name": "richtext_field",
-"label": "Rich text field",
-"required": false,
-"locked": false,
-"type": "richtext",
-"inline_help_text": "",
-"help_text": "",
-"default": null
-}
-```
-
-Other helpful snippets include:
-| Snippet Prefix | Description | Example |
-|-|-|-|
-| otrue | Generates overrideable=True for HubL tags | overrideable=True |
-| ofalse | Generates overrideable=False for HubL tags | overrideable=False |
-| for | Returns a basic if statement | {% for {item} in {dict} %} {{ item }} {% endfor %}" |
-| if | Returns a basic if statement | {% if {condition} %} do_something {% endif %} |
-| elif | Else if statement to be used within if statement | {% elif {condition} %} |
-| else | Else statement to be used within if statement | {% else %} |
-| hubldoc | Boilerplate html/HubL document |  |
-| hublblog | Boilerplate blog markup |  |
-
-
-
-### Beta features
-To enable beta features, naviate to `HubSpot > Beta` in your VS Code settings
-#### Current Beta features:
-- HubL inline error linting: Automatically checks your HTML + HubL and CSS + HubL files for HubL related errors
-### Common issues
-- If you are having trouble getting IntelliSense suggestions when in snippet placeholders you may need to add the following to your [User Settings](https://code.visualstudio.com/docs/getstarted/settings) `"editor.suggest.snippetsPreventQuickSuggestions": false`. If parameter suggestions are not showing up, set `"editor.parameterHints": true`.
-- To use Emmet within your `html-hubl` files, you can map `html-hub` to `html` in your settings under "Emmet: Include Languages":
-
-  ![image](https://user-images.githubusercontent.com/9009552/114593899-9e320500-9c5a-11eb-98c6-9de022344ebc.png)
-
-
- ### Contributing
- For more information about contributing, see the [contributing docs](./CONTRIBUTING.md).
+This extension is open source and we welcome contributions as well as issues for [feature requests](https://github.com/HubSpot/hubspot-cms-vscode/issues/new?assignees=&labels=enhancement&template=feature_request.md&title=) and [bug reports](https://github.com/HubSpot/hubspot-cms-vscode/issues/new?assignees=&labels=bug&template=bug_report.md&title=). For more information about contributing, see the [contributing docs](https://github.com/HubSpot/hubspot-cms-vscode/blob/master/CONTRIBUTING.md) to get started.