Category: Tips & Tricks

Angular component navigation doesn’t work anymore in Webstorm IDE

Please try invalidating caches (File | Invalidate caches, Invalidate and restart) – does the problem persist? Do you have @angular node_modules installed and included in project?

Also try reinstall npm packages:
npm install

Source: Angular component navigation doesn’t work anymore (webstorm) – IDEs Support (IntelliJ Platform) | JetBrains

TaskbarX | Center taskbar icons

Windows 10 Taskbar utility – Windows 11 alike style taskbar witch icons in center.

TaskbarX TaskbarX gives you control over the position of your taskbar icons. TaskbarX will give you an original Windows dock like feel. The icons will move to the center or user given position when an icon gets added or removed from the taskbar. You will be given the option to choose between a variety of different animations and change their speeds. The animations can be disabled if you don’t like animations and want them to move in an instant. The center position can also be changed to bring your icons more to the left or right based on the center position. Currently all taskbar settings are supported including the vertical taskbar. And Unlimited taskbars 🙂

Source: TaskbarX | Center taskbar icons

Angular 10+ Strict Mode

From Angular 10 (experimental) / 11 (default on create new app) you can get strict mode. In summary it reduces the bundle size (by 75%!) and increases the maintainability by disabling you to create objects of type ‘any’ (no untyped types)…

Angular 11+ CLI creates all new workspaces and projects with strict mode enabled.

Strict mode improves maintainability and helps you catch bugs ahead of time. Additionally, strict mode applications are easier to statically analyze and can help the ng update command refactor code more safely and precisely when you are updating to future versions of Angular.

Specifically, strict mode does the following:

More info:
https://angular.io/guide/strict-mode

Angular CLI Strict Mode. In Angular, we strongly believe in… | by Minko Gechev | Angular Blog

Typescript debug util – Output json structure to console as formatted and sorted properties

Made a Debug util TypeScript class for formatted output to browser console of json objects, also sorted on property keys alphabetically (usage: simplifies text compare between different json structures).

export class DebugUtils {
  ///Outputs object as formatted json string to console.
  public static ToConsoleJson(value: any, message = null) {
    if (message) {
      console.log(message);
    }
    console.debug(JSON.stringify(value, null, 2));
  }

  ///Outputs object as formatted json string to console sorted alphabetically by property keys.
  public static ToConsoleJsonSortedByKey(obj: any, message = null) {
    //sort object keys alphabetically
    var allKeys = [];
    JSON.stringify( obj, function( key, value ){ allKeys.push( key ); return value; } )
    allKeys.sort();
    const sortedJsonString = JSON.stringify( obj, allKeys, 2);
    if (message) {
      console.log(message);
    }
    console.debug(sortedJsonString);
  }
}

 

 

git – Having problems cloning a Azure DevOps repository in Visual Studio 2019 Community – Stack Overflow

Clearing the cached credentials from Credential Manager. And then try again.Go to Credential Manager–> Windows Credentials–> Generic Credentials–>Remove all Git related credentials.

Source: git – Having problems cloning a Azure DevOps repository in Visual Studio 2019 Community – Stack Overflow

c# – LINQ’s Distinct() on a particular property

EDIT: This is now part of MoreLINQ.
What you need is a “distinct-by” effectively. I don’t believe it’s part of LINQ as it stands, although it’s fairly easy to write:

public static class EnumerableExtensions
{
public static IEnumerable<TSource> DistinctBy<TSource, TKey>(this IEnumerable<TSource> source, Func<TSource, TKey> keySelector)
{
HashSet<TKey> seenKeys = new HashSet<TKey>();
foreach (TSource element in source)
{
if (seenKeys.Add(keySelector(element)))
{
yield return element;
}
}
}
}

Source: c# – LINQ’s Distinct() on a particular property – Stack Overflow

Angular state inspector – Chrome Extension

Helps you debug Angular component state. Supports Angular 1/2+/Ivy! Angular State Inspector for Angular Supports all versions of Angular: – AngularJs – Angular 2+ – Angular Ivy – Hybrid apps (AngularJs + Angular) Extends the Chrome Developer Tools for Angular web apps. Adds new panel “State” to Elements tab, that displays the state of selected element. Prints state of selected element in console by calling “$state” variable. Depending on angular version it can show: – Component state – Directives – Context, like ngForOf or ngIf values – Event listeners If they are applicable to the current element.

Angular State Inspector also allows you to modify the values in the “State” panel (double click on value)

Source: Angular state inspector – Chrome Web Store

GIT – How to prune local tracking branches that do not exist on remote anymore

One-liner, cross platform, doesn’t look like the cat slept on your keyboard:

npx git-removed-branches

(dry-run) or

npx git-removed-branches --prune

(removes for real).
You need to already have node.js installed.

Source: git – How to prune local tracking branches that do not exist on remote anymore – Stack Overflow

Add above as external command in Visual Studio 2022 “Tools” menu: