Add a button to reset the profile image(fixes 4551)

[ScottHuangNYU]

[paulbert]

The suggestion here will get you halfway: https://github.com/harryy2510/ngx-img/issues/14

You will also need to set mode = 'crop'

[paulbert]

@ScottHuangNYU By mode = 'crop' I mean the example I linked to would change to:

<ngx-img #imageuploader (onSelect)="onSelect($event)" (onReset)="reset()" [config]="config"></ngx-img>

@ViewChild('imageuploader') public imageUploader: NgxImgComponent;

public ngAfterViewInit(): void {
    this.imageUploader.hasPreview = true;
    this.imageUploader.imgSrc = this.initialImageUrl;
    this.imageUploader.mode = 'crop';
}

[paulbert]

Putting this one "On Hold". When the cropper initializes it automatically cuts the image down by 80%, so every time the member edits their profile their image will change unless they manually extend the crop to select the full image.

From what I can tell, the ngx-img library does not include the option to change that, but cropper which is used by ngx-img does. Might make an issue to change that.

[Mutugiii]

Resolved in #7378