export function buildPreviewRef()

in app/src/preview/utils/previewLinkUtils.ts [17:77]


export function buildPreviewRef(params: TBuildPreviewLinkParams): TPreviewRef {
    const { context, inputData, theme, isSkin, componentId, docs } = params;
    const unableToSerialize: string[] = [];
    const unableToPassProps: string[] = [];
    const initialValue = {
        id: '',
        context,
        matrix: {},
    };

    const previewProps = Object.keys(inputData).reduce<TComponentPreview<any>>((acc, name) => {
        const { value, exampleId } = inputData[name];
        if (exampleId !== undefined) {
            const exObject = Object.values(docs.getPropExamplesMap(name)).find(({ id }) => exampleId === id);
            if (exObject) {
                if (!exObject?.isDefault) {
                    Object.assign(acc.matrix, {
                        [name]: {
                            examples: [exObject.name],
                        },
                    });
                }
            } else {
                if (name !== 'onValueChange') {
                    unableToPassProps.push(`${name} (exampleId="${exampleId}")`);
                }
            }
        } else if (value !== undefined) {
            if (['string', 'boolean', 'number'].indexOf(typeof value) !== -1) {
                Object.assign(acc.matrix, {
                    [name]: {
                        values: [value],
                    },
                });
            } else {
                unableToSerialize.push(name);
            }
        }
        return acc;
    }, initialValue);

    const baseLink = `/preview?theme=${theme}&isSkin=${isSkin}&componentId=${componentId}`;
    const link = `${baseLink}&previewId=${encodeInlinePreviewPropsForUrl(previewProps)}`;
    let error;
    if (unableToSerialize.length) {
        error = `Next props cannot be serialized for URL and will be excluded. You might want to include them as examples instead: ${unableToSerialize.join(', ')}`;
    }
    if (unableToPassProps.length) {
        error = `Next props cannot be serialized for URL and will be excluded, because their examples cannot be resolved: ${unableToPassProps.join(', ')}`;
    }

    const predefinedPreviewRefs = docs.docPreview?.listOfPreviews.map((pp) => {
        return {
            link: `${baseLink}&previewId=${encodeURIComponent(pp.id)}`,
            id: pp.id,
            groupId: pp.groupId,
        };
    }) || [];

    return { link, error, predefinedPreviewRefs };
}