@c8y/ngx-components/fesm2022/c8y-ngx-components-widgets-definitions-image.mjs

Angular modules for Cumulocity IoT applications

import { DashboardDetailService } from '@c8y/ngx-components/context-dashboard';
import { gettext, hookWidget } from '@c8y/ngx-components';
import { defaultWidgetIds } from '@c8y/ngx-components/widgets/definitions';
import { ImageWidgetService } from '@c8y/ngx-components/widgets/implementations/image';
import { inject, Injector } from '@angular/core';
import { InventoryService, QueriesUtil } from '@c8y/client';

const imageWidgetDefinition = {
    id: defaultWidgetIds.IMAGE,
    label: gettext('Image'),
    description: gettext(`Display a single image selected from the user's file system.`),
    loadComponent: () => import('@c8y/ngx-components/widgets/implementations/image').then(m => m.ImageWidgetViewComponent),
    loadConfigComponent: () => import('@c8y/ngx-components/widgets/implementations/image').then(m => m.ImageWidgetConfigComponent),
    previewImage: 'c8y-style-assets/image-widget.png',
    data: {
        schema: () => import('c8y-schema-loader?interfaceName=ImageWidgetConfig!@c8y/ngx-components/widgets/implementations/image'),
        export: exportImageWidgetConfig,
        import: importImageWidgetConfig,
        settings: {
            noNewWidgets: false,
            widgetDefaults: {
                _width: 8,
                _height: 4
            },
            ng1: {
                options: {
                    noDeviceTarget: true,
                    groupsSelectable: false
                }
            }
        }
    }
};
const imageWidgetProviders = [hookWidget(imageWidgetDefinition)];
async function exportImageWidgetConfig(config) {
    const injector = inject(Injector);
    const imageWidgetService = injector.get(ImageWidgetService);
    const imageDetails = await imageWidgetService.getImageDetails(config.imageBinaryId);
    return {
        ...config,
        imageDetails: {
            base64: imageDetails.base64,
            c8y_SHA256: imageDetails.c8y_SHA256,
            file: {
                name: imageDetails.file.name,
                type: imageDetails.file.type
            }
        }
    };
}
async function importImageWidgetConfig(config) {
    const injector = inject(Injector);
    const inventoryService = injector.get(InventoryService);
    const dashboardDetailsService = injector.get(DashboardDetailService);
    const dashboardData = dashboardDetailsService.details;
    const baseQuery = {
        __filter: { c8y_SHA256: { __eq: config.imageDetails.c8y_SHA256 } }
    };
    const queriesUtil = new QueriesUtil();
    const query = queriesUtil.buildQuery(baseQuery);
    // check if image already exists in inventory
    const fileBySha = (await inventoryService.list({ query, pageSize: 1 })).data?.[0];
    if (fileBySha) {
        return {
            imageBinaryId: fileBySha.id,
            styling: config.styling
        };
    }
    // create image file from base64
    const url = config.imageDetails.base64;
    const fileName = config.imageDetails.file.name;
    const type = config.imageDetails.file.type;
    const file = await fetch(url)
        .then(res => res.blob())
        .then(blob => {
        return new File([blob], fileName, { type });
    });
    const imageWidgetService = injector.get(ImageWidgetService);
    const imageBinaryId = await imageWidgetService.uploadFile(file, {
        dashboardMoId: dashboardData.mo.id,
        isDeviceTypeDashboard: !!dashboardData.mo.c8y_Dashboard.deviceType &&
            !!dashboardData.mo.c8y_Dashboard.deviceTypeValue
    });
    return {
        imageBinaryId,
        styling: config.styling
    };
}

/**
 * Generated bundle index. Do not edit.
 */

export { imageWidgetDefinition, imageWidgetProviders };
//# sourceMappingURL=c8y-ngx-components-widgets-definitions-image.mjs.map