@perses-dev/prometheus-plugin 0.50.3 → 0.51.0-beta.2

package/dist/plugins/PrometheusDatasourceEditor.js

@@ -1,572 +0,0 @@
-// Copyright 2023 The Perses Authors
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { OptionsEditorRadios } from '@perses-dev/plugin-system';
-import { Grid, IconButton, MenuItem, TextField, Typography } from '@mui/material';
-import React, { Fragment, useState } from 'react';
-import { produce } from 'immer';
-import { Controller } from 'react-hook-form';
-import MinusIcon from 'mdi-material-ui/Minus';
-import PlusIcon from 'mdi-material-ui/Plus';
-import { DEFAULT_SCRAPE_INTERVAL } from './types';
-export function PrometheusDatasourceEditor(props) {
-    var _value_proxy, _value_proxy1, _value_proxy2;
-    const { value, onChange, isReadonly } = props;
-    const strDirect = 'Direct access';
-    const strProxy = 'Proxy';
-    // utilitary function used for headers when renaming a property
-    // -> TODO it would be cleaner to manipulate headers as an intermediary list instead, to avoid doing this.
-    const buildNewHeaders = (oldHeaders, oldName, newName)=>{
-        if (oldHeaders === undefined) return oldHeaders;
-        const keys = Object.keys(oldHeaders);
-        const newHeaders = keys.reduce((acc, val)=>{
-            if (val === oldName) {
-                acc[newName] = oldHeaders[oldName] || '';
-            } else {
-                acc[val] = oldHeaders[val] || '';
-            }
-            return acc;
-        }, {});
-        return {
-            ...newHeaders
-        };
-    };
-    const tabs = [
-        {
-            label: strDirect,
-            content: /*#__PURE__*/ _jsx(Controller, {
-                name: "URL",
-                render: ({ field, fieldState })=>{
-                    var _fieldState_error;
-                    return /*#__PURE__*/ _jsx(TextField, {
-                        ...field,
-                        fullWidth: true,
-                        label: "URL",
-                        value: value.directUrl || '',
-                        error: !!fieldState.error,
-                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                        InputProps: {
-                            readOnly: isReadonly
-                        },
-                        InputLabelProps: {
-                            shrink: isReadonly ? true : undefined
-                        },
-                        onChange: (e)=>{
-                            field.onChange(e);
-                            onChange(produce(value, (draft)=>{
-                                draft.directUrl = e.target.value;
-                            }));
-                        }
-                    });
-                }
-            })
-        },
-        {
-            label: strProxy,
-            content: /*#__PURE__*/ _jsxs(_Fragment, {
-                children: [
-                    /*#__PURE__*/ _jsx(Controller, {
-                        name: "URL",
-                        render: ({ field, fieldState })=>{
-                            var _value_proxy, _fieldState_error;
-                            return /*#__PURE__*/ _jsx(TextField, {
-                                ...field,
-                                fullWidth: true,
-                                label: "URL",
-                                value: ((_value_proxy = value.proxy) === null || _value_proxy === void 0 ? void 0 : _value_proxy.spec.url) || '',
-                                error: !!fieldState.error,
-                                helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                InputProps: {
-                                    readOnly: isReadonly
-                                },
-                                InputLabelProps: {
-                                    shrink: isReadonly ? true : undefined
-                                },
-                                onChange: (e)=>{
-                                    field.onChange(e);
-                                    onChange(produce(value, (draft)=>{
-                                        if (draft.proxy !== undefined) {
-                                            draft.proxy.spec.url = e.target.value;
-                                        }
-                                    }));
-                                },
-                                sx: {
-                                    mb: 2
-                                }
-                            });
-                        }
-                    }),
-                    /*#__PURE__*/ _jsx(Typography, {
-                        variant: "h4",
-                        mb: 2,
-                        children: "Allowed endpoints"
-                    }),
-                    /*#__PURE__*/ _jsxs(Grid, {
-                        container: true,
-                        spacing: 2,
-                        mb: 2,
-                        children: [
-                            ((_value_proxy = value.proxy) === null || _value_proxy === void 0 ? void 0 : _value_proxy.spec.allowedEndpoints) && ((_value_proxy1 = value.proxy) === null || _value_proxy1 === void 0 ? void 0 : _value_proxy1.spec.allowedEndpoints.length) !== 0 ? value.proxy.spec.allowedEndpoints.map(({ endpointPattern, method }, i)=>{
-                                return /*#__PURE__*/ _jsxs(Fragment, {
-                                    children: [
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 8,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Endpoint pattern ${i}`,
-                                                render: ({ field, fieldState })=>{
-                                                    var _fieldState_error;
-                                                    return /*#__PURE__*/ _jsx(TextField, {
-                                                        ...field,
-                                                        fullWidth: true,
-                                                        label: "Endpoint pattern",
-                                                        value: endpointPattern,
-                                                        error: !!fieldState.error,
-                                                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                                        InputProps: {
-                                                            readOnly: isReadonly
-                                                        },
-                                                        InputLabelProps: {
-                                                            shrink: isReadonly ? true : undefined
-                                                        },
-                                                        onChange: (e)=>{
-                                                            field.onChange(e);
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    var _draft_proxy_spec_allowedEndpoints;
-                                                                    draft.proxy.spec.allowedEndpoints = (_draft_proxy_spec_allowedEndpoints = draft.proxy.spec.allowedEndpoints) === null || _draft_proxy_spec_allowedEndpoints === void 0 ? void 0 : _draft_proxy_spec_allowedEndpoints.map((item, itemIndex)=>{
-                                                                        if (i === itemIndex) {
-                                                                            return {
-                                                                                endpointPattern: e.target.value,
-                                                                                method: item.method
-                                                                            };
-                                                                        } else {
-                                                                            return item;
-                                                                        }
-                                                                    });
-                                                                }
-                                                            }));
-                                                        }
-                                                    });
-                                                }
-                                            })
-                                        }),
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 3,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Method ${i}`,
-                                                render: ({ field, fieldState })=>{
-                                                    var _fieldState_error;
-                                                    return /*#__PURE__*/ _jsxs(TextField, {
-                                                        ...field,
-                                                        select: true,
-                                                        fullWidth: true,
-                                                        label: "Method",
-                                                        value: method,
-                                                        error: !!fieldState.error,
-                                                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                                        InputProps: {
-                                                            readOnly: isReadonly
-                                                        },
-                                                        InputLabelProps: {
-                                                            shrink: isReadonly ? true : undefined
-                                                        },
-                                                        onChange: (e)=>{
-                                                            field.onChange(e);
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    var _draft_proxy_spec_allowedEndpoints;
-                                                                    draft.proxy.spec.allowedEndpoints = (_draft_proxy_spec_allowedEndpoints = draft.proxy.spec.allowedEndpoints) === null || _draft_proxy_spec_allowedEndpoints === void 0 ? void 0 : _draft_proxy_spec_allowedEndpoints.map((item, itemIndex)=>{
-                                                                        if (i === itemIndex) {
-                                                                            return {
-                                                                                endpointPattern: item.endpointPattern,
-                                                                                method: e.target.value
-                                                                            };
-                                                                        } else {
-                                                                            return item;
-                                                                        }
-                                                                    });
-                                                                }
-                                                            }));
-                                                        },
-                                                        children: [
-                                                            /*#__PURE__*/ _jsx(MenuItem, {
-                                                                value: "GET",
-                                                                children: "GET"
-                                                            }),
-                                                            /*#__PURE__*/ _jsx(MenuItem, {
-                                                                value: "POST",
-                                                                children: "POST"
-                                                            }),
-                                                            /*#__PURE__*/ _jsx(MenuItem, {
-                                                                value: "PUT",
-                                                                children: "PUT"
-                                                            }),
-                                                            /*#__PURE__*/ _jsx(MenuItem, {
-                                                                value: "PATCH",
-                                                                children: "PATCH"
-                                                            }),
-                                                            /*#__PURE__*/ _jsx(MenuItem, {
-                                                                value: "DELETE",
-                                                                children: "DELETE"
-                                                            })
-                                                        ]
-                                                    });
-                                                }
-                                            })
-                                        }),
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 1,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Remove Endpoint ${i}`,
-                                                render: ({ field })=>/*#__PURE__*/ _jsx(IconButton, {
-                                                        ...field,
-                                                        disabled: isReadonly,
-                                                        // Remove the given allowed endpoint from the list
-                                                        onClick: (e)=>{
-                                                            field.onChange(e);
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    var _draft_proxy_spec_allowedEndpoints;
-                                                                    draft.proxy.spec.allowedEndpoints = [
-                                                                        ...((_draft_proxy_spec_allowedEndpoints = draft.proxy.spec.allowedEndpoints) === null || _draft_proxy_spec_allowedEndpoints === void 0 ? void 0 : _draft_proxy_spec_allowedEndpoints.filter((item, itemIndex)=>{
-                                                                            return itemIndex !== i;
-                                                                        })) || []
-                                                                    ];
-                                                                }
-                                                            }));
-                                                        },
-                                                        children: /*#__PURE__*/ _jsx(MinusIcon, {})
-                                                    })
-                                            })
-                                        })
-                                    ]
-                                }, i);
-                            }) : /*#__PURE__*/ _jsx(Grid, {
-                                item: true,
-                                xs: 4,
-                                children: /*#__PURE__*/ _jsx(Typography, {
-                                    sx: {
-                                        fontStyle: 'italic'
-                                    },
-                                    children: "None"
-                                })
-                            }),
-                            /*#__PURE__*/ _jsx(Grid, {
-                                item: true,
-                                xs: 12,
-                                sx: {
-                                    paddingTop: '0px !important',
-                                    paddingLeft: '5px !important'
-                                },
-                                children: /*#__PURE__*/ _jsx(IconButton, {
-                                    disabled: isReadonly,
-                                    // Add a new (empty) allowed endpoint to the list
-                                    onClick: ()=>onChange(produce(value, (draft)=>{
-                                            if (draft.proxy !== undefined) {
-                                                var _draft_proxy_spec_allowedEndpoints;
-                                                draft.proxy.spec.allowedEndpoints = [
-                                                    ...(_draft_proxy_spec_allowedEndpoints = draft.proxy.spec.allowedEndpoints) !== null && _draft_proxy_spec_allowedEndpoints !== void 0 ? _draft_proxy_spec_allowedEndpoints : [],
-                                                    {
-                                                        endpointPattern: '',
-                                                        method: ''
-                                                    }
-                                                ];
-                                            }
-                                        })),
-                                    children: /*#__PURE__*/ _jsx(PlusIcon, {})
-                                })
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ _jsx(Typography, {
-                        variant: "h4",
-                        mb: 2,
-                        children: "Request Headers"
-                    }),
-                    /*#__PURE__*/ _jsxs(Grid, {
-                        container: true,
-                        spacing: 2,
-                        mb: 2,
-                        children: [
-                            ((_value_proxy2 = value.proxy) === null || _value_proxy2 === void 0 ? void 0 : _value_proxy2.spec.headers) && Object.keys(value.proxy.spec.headers).map((headerName, i)=>{
-                                return /*#__PURE__*/ _jsxs(Fragment, {
-                                    children: [
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 4,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Header name ${i}`,
-                                                render: ({ field, fieldState })=>{
-                                                    var _fieldState_error;
-                                                    return /*#__PURE__*/ _jsx(TextField, {
-                                                        ...field,
-                                                        fullWidth: true,
-                                                        label: "Header name",
-                                                        value: headerName,
-                                                        error: !!fieldState.error,
-                                                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                                        InputProps: {
-                                                            readOnly: isReadonly
-                                                        },
-                                                        InputLabelProps: {
-                                                            shrink: isReadonly ? true : undefined
-                                                        },
-                                                        onChange: (e)=>{
-                                                            field.onChange(e);
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    draft.proxy.spec.headers = buildNewHeaders(draft.proxy.spec.headers, headerName, e.target.value);
-                                                                }
-                                                            }));
-                                                        }
-                                                    });
-                                                }
-                                            })
-                                        }),
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 7,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Header value ${i}`,
-                                                render: ({ field, fieldState })=>{
-                                                    var _value_proxy_spec_headers, _value_proxy, _fieldState_error;
-                                                    return /*#__PURE__*/ _jsx(TextField, {
-                                                        ...field,
-                                                        fullWidth: true,
-                                                        label: "Header value",
-                                                        value: (_value_proxy = value.proxy) === null || _value_proxy === void 0 ? void 0 : (_value_proxy_spec_headers = _value_proxy.spec.headers) === null || _value_proxy_spec_headers === void 0 ? void 0 : _value_proxy_spec_headers[headerName],
-                                                        error: !!fieldState.error,
-                                                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                                        InputProps: {
-                                                            readOnly: isReadonly
-                                                        },
-                                                        InputLabelProps: {
-                                                            shrink: isReadonly ? true : undefined
-                                                        },
-                                                        onChange: (e)=>{
-                                                            field.onChange(e);
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    draft.proxy.spec.headers = {
-                                                                        ...draft.proxy.spec.headers,
-                                                                        [headerName]: e.target.value
-                                                                    };
-                                                                }
-                                                            }));
-                                                        }
-                                                    });
-                                                }
-                                            })
-                                        }),
-                                        /*#__PURE__*/ _jsx(Grid, {
-                                            item: true,
-                                            xs: 1,
-                                            children: /*#__PURE__*/ _jsx(Controller, {
-                                                name: `Remove Header ${i}`,
-                                                render: ({ field })=>/*#__PURE__*/ _jsx(IconButton, {
-                                                        ...field,
-                                                        disabled: isReadonly,
-                                                        // Remove the given header from the list
-                                                        onClick: (e)=>{
-                                                            var _value_proxy;
-                                                            field.onChange(e);
-                                                            const newHeaders = {
-                                                                ...(_value_proxy = value.proxy) === null || _value_proxy === void 0 ? void 0 : _value_proxy.spec.headers
-                                                            };
-                                                            delete newHeaders[headerName];
-                                                            onChange(produce(value, (draft)=>{
-                                                                if (draft.proxy !== undefined) {
-                                                                    draft.proxy.spec.headers = newHeaders;
-                                                                }
-                                                            }));
-                                                        },
-                                                        children: /*#__PURE__*/ _jsx(MinusIcon, {})
-                                                    })
-                                            })
-                                        })
-                                    ]
-                                }, i);
-                            }),
-                            /*#__PURE__*/ _jsx(Grid, {
-                                item: true,
-                                xs: 12,
-                                sx: {
-                                    paddingTop: '0px !important',
-                                    paddingLeft: '5px !important'
-                                },
-                                children: /*#__PURE__*/ _jsx(IconButton, {
-                                    disabled: isReadonly,
-                                    // Add a new (empty) header to the list
-                                    onClick: ()=>onChange(produce(value, (draft)=>{
-                                            if (draft.proxy !== undefined) {
-                                                draft.proxy.spec.headers = {
-                                                    ...draft.proxy.spec.headers,
-                                                    '': ''
-                                                };
-                                            }
-                                        })),
-                                    children: /*#__PURE__*/ _jsx(PlusIcon, {})
-                                })
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ _jsx(Controller, {
-                        name: "Secret",
-                        render: ({ field, fieldState })=>{
-                            var _value_proxy, _fieldState_error;
-                            return /*#__PURE__*/ _jsx(TextField, {
-                                ...field,
-                                fullWidth: true,
-                                label: "Secret",
-                                value: ((_value_proxy = value.proxy) === null || _value_proxy === void 0 ? void 0 : _value_proxy.spec.secret) || '',
-                                error: !!fieldState.error,
-                                helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                InputProps: {
-                                    readOnly: isReadonly
-                                },
-                                InputLabelProps: {
-                                    shrink: isReadonly ? true : undefined
-                                },
-                                onChange: (e)=>{
-                                    field.onChange(e);
-                                    onChange(produce(value, (draft)=>{
-                                        if (draft.proxy !== undefined) {
-                                            draft.proxy.spec.secret = e.target.value;
-                                        }
-                                    }));
-                                }
-                            });
-                        }
-                    })
-                ]
-            })
-        }
-    ];
-    // Use of findIndex instead of providing hardcoded values to avoid desynchronisatio or
-    // bug in case the tabs get eventually swapped in the future.
-    const directModeId = tabs.findIndex((tab)=>tab.label === strDirect);
-    const proxyModeId = tabs.findIndex((tab)=>tab.label === strProxy);
-    // In "update datasource" case, set defaultTab to the mode that this datasource is currently relying on.
-    // Otherwise (create datasource), set defaultTab to Direct access.
-    const defaultTab = value.proxy ? proxyModeId : directModeId;
-    const initialSpecDirect = {
-        directUrl: ''
-    };
-    const initialSpecProxy = {
-        proxy: {
-            kind: 'HTTPProxy',
-            spec: {
-                allowedEndpoints: [
-                    // list of standard endpoints suggested by default
-                    {
-                        endpointPattern: '/api/v1/labels',
-                        method: 'POST'
-                    },
-                    {
-                        endpointPattern: '/api/v1/series',
-                        method: 'POST'
-                    },
-                    {
-                        endpointPattern: '/api/v1/metadata',
-                        method: 'GET'
-                    },
-                    {
-                        endpointPattern: '/api/v1/query',
-                        method: 'POST'
-                    },
-                    {
-                        endpointPattern: '/api/v1/query_range',
-                        method: 'POST'
-                    },
-                    {
-                        endpointPattern: '/api/v1/label/([a-zA-Z0-9_-]+)/values',
-                        method: 'GET'
-                    },
-                    {
-                        endpointPattern: '/api/v1/parse_query',
-                        method: 'POST'
-                    }
-                ],
-                url: ''
-            }
-        }
-    };
-    // For better user experience, save previous states in mind for both mode.
-    // This avoids losing everything when the user changes their mind back.
-    const [previousSpecDirect, setPreviousSpecDirect] = useState(initialSpecDirect);
-    const [previousSpecProxy, setPreviousSpecProxy] = useState(initialSpecProxy);
-    // When changing mode, remove previous mode's config + append default values for the new mode.
-    const handleModeChange = (v)=>{
-        var _tabs_v, _tabs_v1;
-        if (((_tabs_v = tabs[v]) === null || _tabs_v === void 0 ? void 0 : _tabs_v.label) === strDirect) {
-            setPreviousSpecProxy(value);
-            // Copy all settings (for example, scrapeInterval), except 'proxy'
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            const { proxy, ...newValue } = value;
-            onChange({
-                ...newValue,
-                directUrl: previousSpecDirect.directUrl
-            });
-        } else if (((_tabs_v1 = tabs[v]) === null || _tabs_v1 === void 0 ? void 0 : _tabs_v1.label) === strProxy) {
-            setPreviousSpecDirect(value);
-            // Copy all settings (for example, scrapeInterval), except 'directUrl'
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            const { directUrl, ...newValue } = value;
-            onChange({
-                ...newValue,
-                proxy: previousSpecProxy.proxy
-            });
-        }
-    };
-    return /*#__PURE__*/ _jsxs(_Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Typography, {
-                variant: "h4",
-                mb: 2,
-                children: "General Settings"
-            }),
-            /*#__PURE__*/ _jsx(TextField, {
-                fullWidth: true,
-                label: "Scrape Interval",
-                value: value.scrapeInterval || '',
-                placeholder: `Default: ${DEFAULT_SCRAPE_INTERVAL}`,
-                InputProps: {
-                    readOnly: isReadonly
-                },
-                InputLabelProps: {
-                    shrink: isReadonly ? true : undefined
-                },
-                onChange: (e)=>onChange({
-                        ...value,
-                        scrapeInterval: e.target.value
-                    })
-            }),
-            /*#__PURE__*/ _jsx(Typography, {
-                variant: "h4",
-                mt: 2,
-                children: "HTTP Settings"
-            }),
-            /*#__PURE__*/ _jsx(OptionsEditorRadios, {
-                isReadonly: isReadonly,
-                tabs: tabs,
-                defaultTab: defaultTab,
-                onModeChange: handleModeChange
-            })
-        ]
-    });
-}
-
-//# sourceMappingURL=PrometheusDatasourceEditor.js.map