@dovetail-v2/refine 0.0.61-alpha.0 → 0.0.61

package/lib/src/providers/router-provider/index.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable react-hooks/rules-of-hooks */
+import { matchResourceFromRoute, ResourceContext, } from '@refinedev/core';
+import { parse, stringify } from 'qs';
+import React from 'react';
+import { useCallback, useContext } from 'react';
+import { useHistory, useLocation, Link, matchPath, useParams } from 'react-router-dom';
+export const stringifyConfig = {
+    addQueryPrefix: true,
+    skipNulls: true,
+    arrayFormat: 'indices',
+    encode: false,
+    encodeValuesOnly: true,
+};
+export const convertToNumberIfPossible = (value) => {
+    if (typeof value === 'undefined') {
+        return value;
+    }
+    const num = Number(value);
+    if (`${num}` === value) {
+        return num;
+    }
+    return value;
+};
+export const routerProvider = {
+    go: () => {
+        const { search: existingSearch, hash: existingHash } = useLocation();
+        const history = useHistory();
+        const fn = useCallback(({ to, type, query, hash, options: { keepQuery, keepHash } = {} }) => {
+            /** Construct query params */
+            const urlQuery = {
+                ...(keepQuery &&
+                    existingSearch &&
+                    parse(existingSearch, { ignoreQueryPrefix: true })),
+                ...query,
+            };
+            if (urlQuery.to) {
+                urlQuery.to = encodeURIComponent(`${urlQuery.to}`);
+            }
+            const hasUrlQuery = Object.keys(urlQuery).length > 0;
+            /** Get hash */
+            const urlHash = `#${(hash || (keepHash && existingHash) || '').replace(/^#/, '')}`;
+            const hasUrlHash = urlHash.length > 1;
+            const urlTo = to || '';
+            const fullPath = `${urlTo}${hasUrlQuery ? stringify(urlQuery, stringifyConfig) : ''}${hasUrlHash ? urlHash : ''}`;
+            if (type === 'path') {
+                return fullPath;
+            }
+            /** Navigate to the url */
+            return history[type || 'push'](fullPath);
+        }, [existingHash, existingSearch, history]);
+        return fn;
+    },
+    back: () => {
+        const history = useHistory();
+        const fn = useCallback(() => {
+            history.go(-1);
+        }, [history]);
+        return fn;
+    },
+    parse: () => {
+        let params = useParams();
+        const { pathname, search } = useLocation();
+        const { resources } = useContext(ResourceContext);
+        const { resource, action, matchedRoute } = React.useMemo(() => {
+            return matchResourceFromRoute(pathname, resources);
+        }, [resources, pathname]);
+        // params is empty when useParams is used in a component that is not a child of a Route
+        if (Object.entries(params).length === 0 && matchedRoute) {
+            params = matchPath(matchedRoute, pathname)?.params || {};
+        }
+        const fn = useCallback(() => {
+            const parsedSearch = parse(search, { ignoreQueryPrefix: true });
+            const combinedParams = {
+                ...params,
+                ...parsedSearch,
+            };
+            const response = {
+                ...(resource && { resource }),
+                ...(action && { action }),
+                ...(parsedSearch?.id && { id: decodeURIComponent(parsedSearch.id) }),
+                // ...(params?.action && { action: params.action }), // lets see if there is a need for this
+                pathname,
+                params: {
+                    ...combinedParams,
+                    current: convertToNumberIfPossible(combinedParams.current),
+                    pageSize: convertToNumberIfPossible(combinedParams.pageSize),
+                    to: combinedParams.to
+                        ? decodeURIComponent(combinedParams.to)
+                        : undefined,
+                },
+            };
+            return response;
+        }, [pathname, search, params, resource, action]);
+        return fn;
+    },
+    Link: React.forwardRef(function RefineLink(props, ref) {
+        return _jsx(Link, { ...props, ref: ref });
+    }),
+};

package/lib/src/types/index.js

@@ -0,0 +1 @@
+export * from './resource';

package/lib/src/types/resource.d.ts

@@ -12,9 +12,7 @@ export declare enum RESOURCE_GROUP {
     NETWORK = "NETWORK",
     CLUSTER = "CLUSTER",
     SERVICE = "SERVICE",
-    SERVICE_AND_NETWORK = "SERVICE_AND_NETWORK",
-    CONFIG = "CONFIG",
-    NODE_MANAGEMENT = "NODE_MANAGEMENT"
+    SERVICE_AND_NETWORK = "SERVICE_AND_NETWORK"
 }
 export declare enum FormType {
     PAGE = "PAGE",
@@ -55,8 +53,9 @@ export type ResourceConfig<Model extends ResourceModel = ResourceModel> = {
         transformInitValues?: (values: Unstructured) => Unstructured;
         transformApplyValues?: (values: Unstructured) => Unstructured;
         formTitle?: string | ((action: 'create' | 'edit') => string);
-        formDesc?: string;
+        formDesc?: string | ((action: 'create' | 'edit') => string);
         formatError?: (errorBody: any) => string;
         refineCoreProps?: UseFormProps['refineCoreProps'];
+        useFormProps?: UseFormProps;
     };
 };

package/lib/src/types/resource.js

@@ -0,0 +1,12 @@
+export var RESOURCE_GROUP;
+(function (RESOURCE_GROUP) {
+    RESOURCE_GROUP["WORKLOAD"] = "WORKLOAD";
+    RESOURCE_GROUP["STORAGE"] = "STORAGE";
+    RESOURCE_GROUP["NETWORK"] = "NETWORK";
+    RESOURCE_GROUP["CLUSTER"] = "CLUSTER";
+})(RESOURCE_GROUP || (RESOURCE_GROUP = {}));
+export var FormType;
+(function (FormType) {
+    FormType["PAGE"] = "PAGE";
+    FormType["MODAL"] = "MODAL";
+})(FormType || (FormType = {}));

package/lib/src/utils/addId.js

@@ -0,0 +1,8 @@
+export function addId(arr, idKey) {
+    return arr.map(e => {
+        return {
+            id: e[idKey],
+            ...e,
+        };
+    });
+}

package/lib/src/utils/download.js

@@ -0,0 +1,9 @@
+export function download(filename, content) {
+    const element = document.createElement('a');
+    element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(content));
+    element.setAttribute('download', filename);
+    element.style.display = 'none';
+    document.body.appendChild(element);
+    element.click();
+    document.body.removeChild(element);
+}

package/lib/src/utils/error.js

@@ -0,0 +1,53 @@
+export function isNetworkError(errors) {
+    if (errors?.some(error => error?.code || error?.reason)) {
+        return false;
+    }
+    else {
+        return true;
+    }
+}
+export function getSubmitError(errorResponse, text, i18n) {
+    return !errorResponse ? i18n.t('dovetail.network_error') : text;
+}
+export function getCommonErrors(responseBody, i18n) {
+    if (!(responseBody?.message ||
+        responseBody?.code ||
+        responseBody?.reason ||
+        responseBody?.details ||
+        responseBody?.graphQLErrors)) {
+        return [];
+    }
+    const causes = responseBody.details?.causes || responseBody.graphQLErrors || [];
+    if (causes.length) {
+        return causes.map(cause => {
+            let params = {};
+            let message = cause.message;
+            try {
+                const info = JSON.parse(cause.message);
+                params = info.params;
+                message = info.message;
+            }
+            catch {
+                return i18n.t([
+                    `error.${cause.reason}`,
+                    `error.${cause.code}`,
+                    `${message}${cause.field ? `(${cause.field})` : ''}`,
+                ], {
+                    ...params,
+                    fallbackLng: '',
+                });
+            }
+            return i18n.t([
+                `error.${cause.reason}`,
+                `error.${cause.code}`,
+                `${message}${cause.field ? `(${cause.field})` : ''}`,
+            ], {
+                ...params,
+                fallbackLng: '',
+            });
+        });
+    }
+    return [
+        i18n.t([`error.${responseBody.code}`, `error.${responseBody.reason}`, responseBody.message || ''], { fallbackLng: '' }),
+    ];
+}

package/lib/src/utils/form.js

@@ -0,0 +1,9 @@
+import { BASE_INIT_VALUE } from 'src/constants/k8s';
+export function getInitialValues(config) {
+    return config.initValue || {
+        apiVersion: config.apiVersion,
+        kind: config.kind,
+        ...BASE_INIT_VALUE,
+        spec: {},
+    };
+}

package/lib/src/utils/k8s.js

@@ -0,0 +1,6 @@
+export function getApiVersion(resourceBasePath) {
+    return resourceBasePath.replace(/^(\/api\/)|(\/apis\/)/, '');
+}
+export function pruneBeforeEdit(v) {
+    delete v.id;
+}

package/lib/src/utils/labels.js

@@ -0,0 +1,15 @@
+export function toLabelStrings(labels = {}) {
+    return Object.keys(labels).map(key => `${key}/${labels[key]}`);
+}
+export function toLabelsArray(labels = {}) {
+    return Object.keys(labels).map(key => ({
+        key,
+        value: labels[key],
+    }));
+}
+export function toLabelsRecord(labels) {
+    return labels.reduce((prev, cur) => {
+        prev[cur.key] = cur.value;
+        return prev;
+    }, {});
+}

package/lib/src/utils/match-selector.js

@@ -0,0 +1,12 @@
+export function matchSelector(pod, selector) {
+    let match = true;
+    // TODO: support complete selector match strategy
+    // https://github.com/rancher/dashboard/blob/master/shell/utils/selector.js#L166
+    for (const key in selector.matchLabels) {
+        if (!pod.metadata?.labels?.[key] ||
+            pod.metadata.labels?.[key] !== selector.matchLabels[key]) {
+            match = false;
+        }
+    }
+    return match;
+}

package/lib/src/utils/openapi.js

@@ -0,0 +1,33 @@
+import { getApiVersion } from 'src/utils/k8s';
+import { resolveRef } from 'src/utils/schema';
+class K8sOpenAPI {
+    resourceBasePath;
+    response = null;
+    apiVersion;
+    constructor(resourceBasePath) {
+        this.resourceBasePath = resourceBasePath;
+        this.apiVersion = getApiVersion(resourceBasePath);
+    }
+    async fetch() {
+        const response = await fetch(`/api/sks/api/v1/clusters/sks-mgmt/proxy/openapi/v3${this.resourceBasePath}`);
+        return response.json();
+    }
+    async findSchema(kind) {
+        const result = this.response || (await this.fetch());
+        const schema = Object.values(result.components.schemas).find(schema => schema['x-kubernetes-group-version-kind']?.some(({ kind: schemaKind, version: schemaVersion, group: schemaGroup }) => kind === schemaKind &&
+            this.apiVersion === `${schemaGroup ? schemaGroup + '/' : ''}${schemaVersion}`));
+        if (schema) {
+            resolveRef(schema, result.components.schemas, {
+                prune: {
+                    description: true,
+                    optional: false,
+                    fields: [],
+                    metadata: true,
+                    xProperty: true,
+                },
+            });
+        }
+        return schema;
+    }
+}
+export default K8sOpenAPI;

package/lib/src/utils/schema.js

@@ -0,0 +1,117 @@
+import { pick } from 'lodash';
+export function generateValueFromSchema(schema, options) {
+    const { generateValue } = options;
+    if (!schema) {
+        return {};
+    }
+    switch (true) {
+        case schema.type === 'string' && 'enum' in schema && Boolean(schema.enum?.length):
+            return generateValue?.(schema) || schema.enum?.[0];
+        case schema.type === 'string':
+            return generateValue?.(schema) || '';
+        case schema.type === 'boolean':
+            return generateValue?.(schema) || false;
+        case schema.type === 'array':
+            if (!schema.minItems ||
+                !schema.items ||
+                typeof schema.items === 'boolean' ||
+                Array.isArray(schema.items)) {
+                return generateValue?.(schema) || [];
+            }
+            return new Array(schema.minItems).fill(generateValueFromSchema(schema.items, options));
+        case schema.type === 'number':
+        case schema.type === 'integer':
+            return generateValue?.(schema) || 0;
+        case schema.type === 'object': {
+            const obj = {};
+            for (const key in schema.properties) {
+                obj[key] = generateValueFromSchema(schema.properties[key], options);
+            }
+            return obj;
+        }
+        case Array.isArray(schema.type) && 'anyOf' in schema && Boolean(schema.anyOf?.length):
+        case Array.isArray(schema.type) &&
+            'oneOf' in schema &&
+            Boolean(schema.oneOf?.length):
+            {
+                const subSchema = (schema.anyOf || schema.oneOf)?.[0];
+                return generateValueFromSchema(subSchema, options);
+            }
+        case 'allOf' in schema && Boolean(schema.allOf?.length):
+            return generateValueFromSchema(schema.allOf?.[0], options);
+        default:
+            return undefined;
+    }
+}
+export function generateSchemaTypeValue(schema) {
+    return generateValueFromSchema(schema, {
+        generateValue(schema) {
+            if (schema.type === 'array' && schema.items) {
+                return generateSchemaTypeValue(schema.items);
+            }
+            else {
+                return schema.type;
+            }
+        },
+    });
+}
+export function resolveRef(schema, schemas, options) {
+    const { prune } = options;
+    if (schema.$ref) {
+        const refKey = schema.$ref.replace('#/components/schemas/', '');
+        Object.assign(schema, schemas[refKey]);
+        if (prune.metadata &&
+            [
+                'io.k8s.apimachinery.pkg.apis.meta.v1.ListMeta',
+                'io.k8s.apimachinery.pkg.apis.meta.v1.ObjectMeta',
+            ].some(k => refKey.includes(k)) &&
+            schema.properties) {
+            schema.properties = pick(schema.properties, [
+                'name',
+                'namespace',
+                'annotations',
+                'labels',
+            ]);
+        }
+        delete schema.$ref;
+    }
+    for (const schemaKey in schema) {
+        if (prune.xProperty &&
+            schemaKey.startsWith('x-') &&
+            schemaKey !== 'x-kubernetes-group-version-kind') {
+            delete schema[schemaKey];
+        }
+    }
+    switch (true) {
+        case schema.type === 'array':
+            if (Array.isArray(schema.items)) {
+                schema.items.forEach(item => resolveRef(item, schemas, options));
+            }
+            else if (typeof schema.items === 'object') {
+                resolveRef(schema.items, schemas, options);
+            }
+            break;
+        case schema.type === 'object':
+            for (const key in schema.properties) {
+                const subSchema = schema.properties[key];
+                if (prune.optional && !schema.required?.includes(key)) {
+                    delete schema.properties[key];
+                }
+                if (prune.fields.includes(key)) {
+                    delete schema.properties[key];
+                }
+                resolveRef(subSchema, schemas, options);
+            }
+            if (schema.additionalProperties) {
+                resolveRef(schema.additionalProperties, schemas, options);
+            }
+            break;
+        case !!(schema.allOf && schema.allOf[0]):
+            resolveRef(schema.allOf?.[0], schemas, options);
+        default:
+    }
+    if (prune.description) {
+        delete schema.description;
+    }
+    return schema;
+}

package/lib/src/utils/selector.js

@@ -0,0 +1,12 @@
+export function matchSelector(pod, selector) {
+    let match = true;
+    // TODO: support complete selector match strategy
+    // https://github.com/rancher/dashboard/blob/master/shell/utils/selector.js#L166
+    for (const key in selector.matchLabels) {
+        if (!pod.metadata?.labels?.[key] ||
+            pod.metadata.labels?.[key] !== selector.matchLabels[key]) {
+            match = false;
+        }
+    }
+    return match;
+}

package/lib/src/utils/string.js

@@ -0,0 +1,6 @@
+export function shortenedImage(image) {
+    return (image || '')
+        .replace(/^(index\.)?docker.io\/(library\/)?/, '')
+        .replace(/:latest$/, '')
+        .replace(/^(.*@sha256:)([0-9a-f]{8})[0-9a-f]+$/i, '$1$2…');
+}

package/lib/src/utils/time.js

@@ -0,0 +1,46 @@
+export function getSecondsDiff(startDate, endDate) {
+    return Math.round(Math.abs(Date.parse(endDate) - Date.parse(startDate)) / 1000);
+}
+export function elapsedTime(seconds, i18nMap) {
+    const { min, sec, hr, day } = i18nMap;
+    if (!seconds) {
+        return {};
+    }
+    if (seconds < 120) {
+        return {
+            diff: 1,
+            label: `${seconds} ${sec}`,
+        };
+    }
+    const minutes = Math.floor(seconds / 60);
+    if (minutes < 10) {
+        return {
+            diff: 1,
+            label: `${minutes} ${min} ${seconds - minutes * 60} ${sec}`,
+        };
+    }
+    const hours = Math.floor(seconds / 3600);
+    if (hours < 3) {
+        return {
+            diff: 60,
+            label: `${minutes} ${min}`,
+        };
+    }
+    const days = Math.floor(seconds / (3600 * 24));
+    if (days > 1) {
+        return {
+            diff: 60,
+            label: `${days} ${day} ${hours - days * 24} ${hr}`,
+        };
+    }
+    if (hours > 7) {
+        return {
+            diff: 60,
+            label: `${hours} ${hr}`,
+        };
+    }
+    return {
+        diff: 60,
+        label: `${hours} ${hr} ${minutes - hours * 60} ${min}`,
+    };
+}

package/lib/src/utils/unit.js

@@ -0,0 +1,69 @@
+const UNITS = ['', 'K', 'M', 'G', 'T', 'P'];
+const FRACTIONAL = ['', 'm', 'u', 'n', 'p', 'f']; // milli micro nano pico femto
+export function formatSi(inValue, options) {
+    const { increment = 1000, suffix = null, firstSuffix = null, startingExponent = 0, minExponent = 0, maxPrecision = 2, atLeastOne = true, } = options || {};
+    let val = inValue;
+    let exp = startingExponent;
+    while ((val >= increment && exp + 1 < UNITS.length) || exp < minExponent) {
+        val = val / increment;
+        exp++;
+    }
+    let out = 0;
+    if (val < 10 && maxPrecision >= 2) {
+        out = Math.round(val * 100) / 100;
+    }
+    else if (val < 100 && maxPrecision >= 1) {
+        out = Math.round(val * 10) / 10;
+    }
+    else {
+        out = Math.round(val);
+    }
+    if (atLeastOne && out === 0) {
+        out = 1;
+    }
+    let outStr = String(out);
+    if (exp === 0 && firstSuffix !== null) {
+        outStr += `${firstSuffix}`;
+    }
+    else {
+        outStr += `${UNITS[exp]}${suffix}` || '';
+    }
+    return outStr;
+}
+export function parseSi(inValue, increment = null, allowFractional = true) {
+    if (!inValue || typeof inValue !== 'string' || !inValue.length) {
+        return NaN;
+    }
+    inValue = inValue.replace(/,/g, '');
+    // eslint-disable-next-line prefer-const
+    let [, valStr, unit, incStr] = inValue.match(/^([0-9.-]+)\s*([^0-9.-]?)([^0-9.-]?)/) || [];
+    const val = parseFloat(valStr);
+    if (!unit) {
+        return val;
+    }
+    // micro "mu" symbol -> u
+    if (unit.charCodeAt(0) === 181) {
+        unit = 'u';
+    }
+    const divide = FRACTIONAL.includes(unit);
+    const multiply = UNITS.includes(unit.toUpperCase());
+    if (increment === null) {
+        // Automatically handle 1 KB = 1000B, 1 KiB = 1024B if no increment set
+        if ((multiply || divide) && incStr === 'i') {
+            increment = 1024;
+        }
+        else {
+            increment = 1000;
+        }
+    }
+    if (divide && allowFractional) {
+        const exp = FRACTIONAL.indexOf(unit);
+        return val / Math.pow(increment, exp);
+    }
+    if (multiply) {
+        const exp = UNITS.indexOf(unit.toUpperCase());
+        return val * Math.pow(increment, exp);
+    }
+    // Unrecognized unit character
+    return val;
+}

package/lib/src/utils/yaml.js

@@ -0,0 +1,44 @@
+import yaml from 'js-yaml';
+import { isObject } from 'lodash-es';
+import { generateSchemaTypeValue } from './schema';
+export function generateYamlBySchema(defaultValue, schema) {
+    const typeObject = generateSchemaTypeValue(schema);
+    function makeAnnotations(obj, key) {
+        const result = {};
+        if (isObject(obj[key])) {
+            result[`#${key}`] = {};
+            Object.keys(obj[key]).forEach(prop => {
+                result[`#${key}`] = {
+                    ...result[`#${key}`],
+                    ...makeAnnotations(obj[key], prop),
+                };
+            });
+        }
+        else {
+            result[`#${key}`] = obj[key];
+        }
+        return result;
+    }
+    function merge(obj1, obj2, merged = {}) {
+        for (const key in obj1) {
+            merged[key] = obj1[key];
+        }
+        for (const key in obj2) {
+            if (key in obj1) {
+                if (isObject(obj2[key]) && isObject(obj1[key])) {
+                    merged[key] = merge(obj1[key], obj2[key]);
+                }
+            }
+            else {
+                merged = {
+                    ...merged,
+                    ...makeAnnotations(obj2, key),
+                };
+            }
+        }
+        return merged;
+    }
+    const merged = merge(defaultValue, typeObject);
+    const content = yaml.dump(merged);
+    return content.replace(/(')(#.+?)(')/g, '$2').replace(/( +)(#)/g, '$2$1');
+}

package/lib/vite.config.js

@@ -0,0 +1,60 @@
+import path from 'path';
+import linaria from '@linaria/vite';
+import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
+import commonjs from 'vite-plugin-commonjs';
+// import { getProxyConfig } from './tools/proxy-k8s';
+export default defineConfig({
+    plugins: [commonjs(), react(), linaria()],
+    server: {
+        host: '0.0.0.0',
+        proxy: {
+            // '/proxy-k8s': getProxyConfig(),
+            '/api': {
+                target: process.env.API_HOST || 'http://192.168.28.26',
+                ws: true,
+                headers: {
+                    'x-skip-auth-verify': 'true',
+                },
+            },
+        },
+    },
+    optimizeDeps: {
+        exclude: ['monaco-yaml/yaml.worker.js']
+    },
+    build: {
+        minify: false,
+        lib: {
+            entry: path.resolve(__dirname, 'src/index.ts'),
+            name: 'dovetail',
+        },
+        rollupOptions: {
+            external: [
+                '@cloudtower/eagle',
+                '@cloudtower/icons-react',
+                '@refinedev/core',
+                '@refinedev/inferencer',
+                'antd',
+                'i18next',
+                'ky',
+                'lodash-es',
+                'mitt',
+                'qs',
+                'react',
+                'react-dom',
+                'react-router-dom',
+                'sunflower-antd',
+                'monaco-editor',
+                'monaco-yaml',
+                'js-yaml',
+                'k8s-api-provider',
+            ],
+        },
+    },
+    resolve: {
+        preserveSymlinks: true,
+        alias: {
+            src: path.resolve(__dirname, 'src'),
+        },
+    },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dovetail-v2/refine",
-  "version": "0.0.61-alpha.0",
+  "version": "0.0.61",
   "type": "module",
   "files": [
     "dist",

package/lib/src/components/ModalContextProvider/index.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-interface ModalInfo {
-    resource: string;
-    id?: string;
-}
-type ModalContextValue = ModalInfo & {
-    open: (info: ModalInfo) => void;
-    close: () => void;
-};
-export declare const ModalContext: React.Context<ModalContextValue>;
-declare function ModalContextProvider(props: React.PropsWithChildren<Record<string, unknown>>): JSX.Element;
-export default ModalContextProvider;