VS Code Settings and Snippets

json.json

// JSON Snippets
// e.g., for package.json
{
	"nodeGitBranchDep": {
		"prefix": "npmGit",
		"description": "Install a package from github branch",
		"body": [
			"\"$1\": \"git+ssh://[email protected]/datavisyn/$1#$2\"",
		],
	}
	// Place your snippets for json here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	// "Print to console": {
	// 	"prefix": "log",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
}

settings.json

// VS Code - User Settings
{
  // ****************************
  // 👇 changes done on purpose
  // misc
  "editor.formatOnSave": true,
  "workbench.sideBar.location": "right",
  "editor.linkedEditing": false, // would be could if it would work 🥲


  // whitespace
  "editor.renderWhitespace": "all",
  "diffEditor.ignoreTrimWhitespace": false,

  // minimap
  "editor.minimap.enabled": true,
  "editor.minimap.autohide": true,
  // dont display the color in the minimap (outdated)
  // "color-highlight.markRuler": false,

  // font
  "editor.fontFamily": "'Fira Code',  'Roboto Mono for Powerline', 'Source Code Pro for Powerline', Consolas, 'Courier New', monospace",
  // ss08 adds gaps to ===  and !==
  // see
  "editor.fontLigatures": "'calt', 'ss01', 'ss02', 'ss03', 'ss04', 'ss05', 'ss06', 'zero', 'onum', 'ss08'",
  //see https://github.com/tonsky/FiraCode?tab=readme-ov-file#whats-in-the-box


  // copy paste issue
  // see https://github.com/microsoft/vscode/issues/236625, https://github.com/microsoft/vscode/issues/236554, https://github.com/microsoft/vscode/issues/235959
  "typescript.updateImportsOnPaste.enabled": false,
  "javascript.updateImportsOnPaste.enabled": false,
  // "typescript.updateImportsOnFileMove.enabled": "never",

  
  // Cursor 
  "editor.cursorWidth": 3,
  "editor.cursorBlinking": "phase",
  "terminal.integrated.cursorBlinking": true,
  "editor.cursorSmoothCaretAnimation": "on",
  
  // Bracket Pair coloring 🥰
  "editor.guides.bracketPairs": true,
  
  
  "indentRainbow.indicatorStyle": "light",
  
  // Longer Typescript types on hover
  "typescript.experimental.expandableHover": true,
  
  // upgrade to gpt-4o-copilot
  "github.copilot.selectedCompletionModel": "gpt-4o-copilot",
  
  // **********************************
  // other settings 🤷
  
  "security.allowedUNCHosts": ["wsl.localhost", "speicherstadt"],
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  // "typescript.updateImportsOnFileMove.enabled": "always",
  "explorer.confirmDragAndDrop": false,
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "security.workspace.trust.enabled": false,
  "git.enableSmartCommit": true,
  "emmet.showAbbreviationSuggestions": false,
  "emmet.showExpandedAbbreviation": "never",
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "terminal.integrated.env.windows": {},
  
  "remote.autoForwardPortsSource": "hybrid",
  "playwright.reuseBrowser": true,
  "remote.SSH.remotePlatform": {
    "192.168.0.57": "linux",
    "Speicherstadt": "linux"
  },
  "[python]": {
    "diffEditor.ignoreTrimWhitespace": false
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "editor.largeFileOptimizations": true,
  "json.maxItemsComputed": 25600,
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "editor.accessibilitySupport": "off",
}

typescriptreact.json

// TSX Snippets
{
	"data profile": {
		"description": "From a data array, get unique values and their count per attribute",
		"prefix": [
			"profile",
		],
		"body": [
			"const profile = (",
			"    dataArray: Record<string, unknown>[],",
			"  ): {",
			"    uniqueData: Record<string, Set<unknown>>;",
			"    uniqueDataCount: Record<string, number>;",
			"  } => {",
			"    const uniqueData = dataArray.reduce<Record<string, Set<unknown>>>(",
			"      (acc, d) => {",
			"        Object.keys(d).forEach((key) => {",
			"          if (d[key] != null) {",
			"            const dKeyValue = Array.isArray(d[key]) ? d[key].join(',') : d[key];",
			"            acc[key] = acc[key] instanceof Set ? acc[key].add(dKeyValue) : new Set([dKeyValue]);",
			"          }",
			"        });",
			"        return acc;",
			"      },",
			"      {} as Record<string, Set<unknown>>,",
			"    );",
			"    const uniqueDataCount = Object.keys(uniqueData).reduce<Record<string, number>>((acc, key) => {",
			"      if (uniqueData[key] != null) {",
			"        acc[key] = uniqueData[key].size;",
			"      }",
			"      return acc;",
			"    }, {});",
			"    return { uniqueData, uniqueDataCount };",
			"  };",
			"",
			"  const dataProfile = profile(${1:dataArray});",
			"  console.log('dataProfile:', dataProfile);",
			"$0",
		]
	},
	// Place your snippets for typescriptreact here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	// "Print to console": {
	// 	"prefix": "log",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }
}