Custom snippets for VS Code

VS_Custom_Snippets.code-snippets

{
	"Is Code Needed": {
		"scope": "javascript,typescript,css",
		"prefix": "need",
		"body": [
			"/* ? See if this is needed actually */"
		],
		"description": "Adds a comment to remind checking if code is needed"
	},
	"Move To Brand": {
		"scope": "javascript,typescript,css",
		"prefix": "brand",
		"body": [
			"/* TODO: Move below code to Brand specific code */"
		],
		"description": "Adds a comment to remind moving of code to brand specific repo"
	},
	"Remove in future": {
		"scope": "javascript,typescript,css",
		"prefix": "remove",
		"body": [
			"/* ! Remove code below */"
		],
		"description": "Adds a comment to remind removing of unwanted/dirty code"
	},
	"Import React": {
		"scope": "javascript,typescript,typescriptreact",
		"prefix": "imprt",
		"body": [
			"import React from 'react'"
		],
		"description": "Imports react in file"
	},
	"Import React Prop Types": {
		"scope": "javascript,typescript,typescriptreact",
		"prefix": "improp",
		"body": [
			"import PropTypes from 'prop-types'"
		],
		"description": "Imports react prop-types in file"
	},
	"TODO JS Comment": {
		"scope": "javascript,typescript,typescriptreact",
		"prefix": "td",
		"body": [
			"// TODO: $0"
		],
		"description": "Adds a todo comment in JS, TS and React TS files"
	},
	"TODO CSS Comment": {
		"scope": "css,scss,less",
		"prefix": "tdc",
		"body": [
			"/* TODO: $0 */"
		],
		"description": "Adds a todo comment in CSS, SCSS and LESS files"
	},
	"JS Region": {
		"scope": "javascript,typescript,typescriptreact,jsx",
		"prefix": "jregion",
		"body": [
			"// #region Code Start $1",
			"",
			"$2",
			"",
			"// #endregion"
		],
		"description": "Creates a FOLDABLE REGION for code between region comments in JS, TS, JSX files"
	},
	"CSS Region": {
		"scope": "css,scss,less",
		"prefix": "cregion",
		"body": [
			"/* #region Styles Start $1 */",
			"",
			"$2",
			"",
			"/* #endregion */"
		],
		"description": "Creates a FOLDABLE REGION for code between region comments in CSS, SCSS and LESS files"
	},
	"Media Query": {
		"scope": "css,scss,less",
		"prefix": "mq",
		"body": [
			"@media (${1}-width: ${2}px) {",
			"  .myClass {",
			"    $3",
			"  }",
			"}"
		],
		"description": "Generic code for media query"
	},
	"Mobile Media Query": {
		"scope": "css,scss,less",
		"prefix": "mmq",
		"body": [
			"@media (max-width: 767px) {",
			"  .myClass {",
			"    $1",
			"  }",
			"}"
		],
		"description": "Media query for mobile devices"
	},
	"Tablet Media Query": {
		"scope": "css,scss,less",
		"prefix": "tmq",
		"body": [
			"@media (max-width: 1024px) {",
			"  .myClass {",
			"    $1",
			"  }",
			"}"
		],
		"description": "Media query for small laptop or tablet devices including mobiles as well"
	},
	"Tablet Only Media Query": {
		"scope": "css,scss,less",
		"prefix": "tomq",
		"body": [
			"@media (min-width: 768px) and (max-width: 1024px) {",
			"  .myClass {",
			"    $1",
			"  }",
			"}"
		],
		"description": "Media query for small laptop or tablet devices only"
	},
	"Desktop Media Query": {
		"scope": "css,scss,less",
		"prefix": "dmq",
		"body": [
			"@media (min-width: 1025px) {",
			"  .myClass {",
			"    $1",
			"  }",
			"}"
		],
		"description": "Media query for desktop/laptop"
	},
	"Absolute Center": {
		"scope": "css,scss,less",
		"prefix": "center",
		"body": [
			"position: absolute",
			"top: 0;",
			"bottom: 0;",
			"left: 0;",
			"right: 0;",
			"margin: auto;",
		],
		"description": "Center an item vertically and horizontally"
	},
	"console info": {
		"scope": "javascript,typescript,typescriptreact,jsx",
		"prefix": "cif",
		"body": "console.info('$1:', $1);",
		"description": "Prints console info"
	},
	"ajax": {
		"scope": "javascript,typescript,typescriptreact,jsx",
		"prefix": "ajax",
		"body": [
			"$.ajax({",
			"  type: apiMethods.GET,",
			"  url: 'url',",
			"  dataType: 'json',",
			"  data: {},",
			"  headers: { ...AUTH_HEADERS },",
			"  success: function (results) {},",
			"  error: function (_xhr, textStatus, errorThrown) {},",
			"  complete: function (_xhr, textStatus) {},",
			"});"
		],
		"description": "Adds a basic ajax script"
	},
	"i18 in hbs": {
		"scope": "html,handlebars",
		"prefix": "i18hbs",
		"body": "{{i18n key='$1'}}",
		"description": "Adds syntax for adding i18n values in hbs files"
	}
}