56 lines
2.1 KiB
JavaScript
56 lines
2.1 KiB
JavaScript
import emptySvg from '@gitlab/svgs/dist/illustrations/security-dashboard-empty-state.svg';
|
|
import { GlEmptyState } from '@gitlab/ui';
|
|
import * as Sentry from '@sentry/browser';
|
|
import { __ } from '~/locale';
|
|
|
|
export const ERROR_FETCHING_DATA_HEADER = __('Could not get the data properly');
|
|
export const ERROR_FETCHING_DATA_DESCRIPTION = __(
|
|
'Please try and refresh the page. If the problem persists please contact support.',
|
|
);
|
|
|
|
/**
|
|
* This function takes a Component and extends it with data from the `parseData` function.
|
|
* The data will be made available through `props` and `proivde`.
|
|
* If the `parseData` throws, the `GlEmptyState` will be returned.
|
|
* @param {Component} Component a component to render
|
|
* @param {Object} options
|
|
* @param {Function} options.parseData a function to parse `data`
|
|
* @param {Object} options.data an object to pass to `parseData`
|
|
* @param {Boolean} options.shouldLog to tell whether to log any thrown error by `parseData` to Sentry
|
|
* @param {Object} options.props to override passed `props` data
|
|
* @param {Object} options.provide to override passed `provide` data
|
|
* @param {*} ...options the remaining options will be passed as properties to `createElement`
|
|
* @return {Component} a Vue component to render, either the GlEmptyState or the extended Component
|
|
*/
|
|
export default function ensureData(Component, options = {}) {
|
|
const { parseData, data, shouldLog = false, props, provide, ...rest } = options;
|
|
try {
|
|
const parsedData = parseData(data);
|
|
return {
|
|
provide: { ...parsedData, ...provide },
|
|
render(createElement) {
|
|
return createElement(Component, {
|
|
props: { ...parsedData, ...props },
|
|
...rest,
|
|
});
|
|
},
|
|
};
|
|
} catch (error) {
|
|
if (shouldLog) {
|
|
Sentry.captureException(error);
|
|
}
|
|
|
|
return {
|
|
functional: true,
|
|
render(createElement) {
|
|
return createElement(GlEmptyState, {
|
|
props: {
|
|
title: ERROR_FETCHING_DATA_HEADER,
|
|
description: ERROR_FETCHING_DATA_DESCRIPTION,
|
|
svgPath: `data:image/svg+xml;utf8,${encodeURIComponent(emptySvg)}`,
|
|
},
|
|
});
|
|
},
|
|
};
|
|
}
|
|
}
|