mediarepo/mediarepo-ui/src/app/components/shared/file/file-thumbnail/file-thumbnail.component.ts

import {AfterViewInit, Component, Input, OnChanges, SimpleChanges} from "@angular/core";
import {File} from "../../../../../api/models/File";
import {FileService} from "../../../../services/file/file.service";
import {FileHelper} from "../../../../services/file/file.helper";
import {SafeResourceUrl} from "@angular/platform-browser";

@Component({
    selector: "app-file-thumbnail",
    templateUrl: "./file-thumbnail.component.html",
    styleUrls: ["./file-thumbnail.component.scss"]
})
export class FileThumbnailComponent implements OnChanges, AfterViewInit {

    @Input() file!: File;

    public thumbUrl: SafeResourceUrl | undefined;

    private supportedThumbnailTypes = ["image", "video"];

    constructor(private fileService: FileService) {
    }

    public async ngAfterViewInit() {
        this.thumbUrl = this.fileService.buildThumbnailUrl(this.file, 250, 250);
    }

    public async ngOnChanges(changes: SimpleChanges) {
        if (changes["file"]) {
            this.thumbUrl = this.fileService.buildThumbnailUrl(this.file,
                250, 250
            );
        }
    }

    public getThumbnailSupported(): boolean {
        const mimeParts = FileHelper.parseMime(this.file.mimeType);

        return !!mimeParts && this.supportedThumbnailTypes.includes(
            mimeParts[0]);
    }

    public getFileType(): string {
        const mimeParts = FileHelper.parseMime(this.file.mimeType);
        return (mimeParts && mimeParts[0]) ?? "other";
    }
}