galaxy-charts 0.0.21 → 0.0.23

package/src/components/SidePanel.vue

@@ -1,158 +0,0 @@
-<script setup lang="ts">
-import { computed, ref, defineProps, defineEmits } from "vue";
-import {
-    AdjustmentsHorizontalIcon,
-    ChevronDoubleRightIcon,
-    CloudArrowUpIcon,
-    Square3Stack3DIcon,
-} from "@heroicons/vue/24/outline";
-import { NButton, NIcon, NInput, NTabs, NTabPane } from "naive-ui";
-import { visualizationsCreate, visualizationsSave } from "@/api/visualizations";
-import { errorMessageAsString } from "@/utilities/simpleError";
-import InputForm from "@/components/InputForm.vue";
-import InputRepeats from "@/components/InputRepeats.vue";
-import AlertNotify from "@/components/AlertNotify.vue";
-import ApiStatus from "@/components/ApiStatus.vue";
-import type { InputElementType, InputValuesType, MessageType } from "@/types";
-
-const props = defineProps<{
-    datasetId: string;
-    description: string;
-    logoUrl: string;
-    html: string;
-    name: string;
-    settingInputs: InputElementType[];
-    settingValues: InputValuesType;
-    trackInputs: InputElementType[];
-    trackValues: InputValuesType[];
-    visualizationId: string | null | undefined;
-    visualizationTitle: string;
-}>();
-
-// Emit events with TypeScript
-const emit = defineEmits<{
-    (event: "update:tracks", newValues: InputValuesType[]): void;
-    (event: "update:settings", newValues: InputValuesType): void;
-    (event: "toggle"): void;
-}>();
-
-// Create local copies of props with reactivity
-const currentTitle = ref<string>(props.visualizationTitle);
-const currentVisualizationId = ref<string | null | undefined>(props.visualizationId);
-
-// Manage message and message type for notifications
-const message = ref<string>("");
-const messageType = ref<MessageType>("info");
-
-// Determine if tabs should be hidden based on input arrays
-const hideTabs = computed(() => props.settingInputs.length === 0 || props.trackInputs.length === 0);
-
-// Save or create the visualization
-async function onSave(): Promise<void> {
-    try {
-        if (currentVisualizationId.value) {
-            await visualizationsSave(currentVisualizationId.value, currentTitle.value, {
-                dataset_id: props.datasetId,
-                settings: props.settingValues,
-            });
-            message.value = "Successfully saved.";
-            messageType.value = "success";
-        } else {
-            currentVisualizationId.value = await visualizationsCreate(props.name, currentTitle.value, {
-                dataset_id: props.datasetId,
-                settings: props.settingValues,
-            });
-            message.value = "Successfully created.";
-            messageType.value = "success";
-        }
-    } catch (err) {
-        message.value = errorMessageAsString(err);
-        messageType.value = "error";
-    }
-}
-
-// Update settings handler
-function onUpdateSettings(newValues: InputValuesType): void {
-    emit("update:settings", newValues);
-}
-
-// Update tracks handler
-function onUpdateTracks(newValues: InputValuesType[]): void {
-    emit("update:tracks", newValues);
-}
-</script>
-
-<template>
-    <div class="overflow-auto select-none bg-white z-10">
-        <div class="flex p-2">
-            <div class="flex-1 font-thin text-lg p-1 p-2">
-                <span>Charts</span>
-                <ApiStatus />
-            </div>
-            <div>
-                <n-button strong secondary circle class="bg-sky-100 m-1" @click="onSave">
-                    <template #icon>
-                        <n-icon><CloudArrowUpIcon /></n-icon>
-                    </template>
-                </n-button>
-                <n-button strong secondary circle class="bg-sky-100 m-1" @click="emit('toggle')">
-                    <template #icon>
-                        <n-icon><ChevronDoubleRightIcon /></n-icon>
-                    </template>
-                </n-button>
-            </div>
-        </div>
-        <AlertNotify :message="message" :message-type="messageType" @timeout="message = ''" class="m-4" />
-        <div class="m-4 mt-0 p-2 bg-sky-50 text-sky-900 rounded">
-            <div class="md:flex">
-                <div class="flex justify-center center-items">
-                    <div class="m-2">
-                        <img v-if="props.logoUrl" :src="props.logoUrl" class="min-w-14 max-w-14 object-contain" />
-                        <svg
-                            v-else
-                            xmlns="http://www.w3.org/2000/svg"
-                            fill="none"
-                            viewBox="0 0 100 100"
-                            class="size-14">
-                            <circle cx="50" cy="50" r="45" stroke="#E30A17" stroke-width="5" />
-                            <path d="M 50,5 A 45,45 0 0,1 95,50 L 50,50 Z" fill="#E30A17" />
-                        </svg>
-                    </div>
-                </div>
-                <div class="overflow-hidden break-words p-1">
-                    <span class="font-bold">{{ html }}</span>
-                    <div class="text-xs" v-html="description" />
-                </div>
-            </div>
-        </div>
-        <div class="px-4 pb-2">
-            <div class="font-bold">Title</div>
-            <div class="text-xs py-1">Specify a visualization title.</div>
-            <n-input v-model:value="currentTitle" />
-        </div>
-        <n-tabs type="line" animated class="px-4" :tab-class="hideTabs ? '!hidden' : ''">
-            <n-tab-pane v-if="trackInputs.length > 0" name="tracks">
-                <template #tab>
-                    <n-icon><Square3Stack3DIcon /></n-icon>
-                    <span class="mx-1">Tracks</span>
-                </template>
-                <InputRepeats
-                    :dataset-id="datasetId"
-                    :inputs="trackInputs"
-                    :values-array="trackValues"
-                    @update:values-array="onUpdateTracks" />
-            </n-tab-pane>
-            <n-tab-pane v-if="settingInputs.length > 0" name="settings">
-                <template #tab>
-                    <n-icon><AdjustmentsHorizontalIcon /></n-icon>
-                    <span class="mx-1">Settings</span>
-                </template>
-                <InputForm
-                    :dataset-id="datasetId"
-                    :inputs="settingInputs"
-                    :values="settingValues"
-                    @update:values="onUpdateSettings" />
-            </n-tab-pane>
-        </n-tabs>
-    </div>
-</template>

package/src/main.js

@@ -1,27 +0,0 @@
-import { createApp, h } from "vue";
-import App from "./App.vue";
-
-const dataIncoming = {
-    visualization_config: {
-        dataset_url: null,
-        dataset_id: "12e4b4feedfe9f3f",
-        settings: {
-            setting_text: "My Test Setting",
-            setting_boolean: true,
-            setting_conditional: {
-                case_false: "something else",
-                test_condition: "false",
-            },
-        },
-    },
-};
-
-const xml = "galaxy-charts.xml";
-
-// Attach config to the data-incoming attribute
-const appElement = document.querySelector("#app");
-appElement.setAttribute("data-incoming", JSON.stringify(dataIncoming));
-
-createApp({
-    render: () => h(App, { credentials: process.env.credentials, xml: xml }),
-}).mount("#app");

package/src/store/columnsStore.ts

@@ -1,59 +0,0 @@
-import { ref } from "vue";
-import { datasetsGetColumns } from "@/api/datasets";
-
-const SPECIAL_KEYS = ["auto", undefined];
-
-// Define the structure for columns
-const columns = ref<Record<string, Record<string, any>>>({});
-
-interface Track {
-    [key: string]: string | undefined;
-}
-
-export function useColumnsStore() {
-    function getColumns(tracks: Track[], keys: string[]): string[] {
-        const columnsList: string[] = [];
-        for (const track of tracks) {
-            for (const key of keys) {
-                const column = track[key];
-                if (column && ![...columnsList, ...SPECIAL_KEYS].includes(column)) {
-                    columnsList.push(column);
-                }
-            }
-        }
-        return columnsList;
-    }
-
-    async function fetchColumns(datasetId: string, tracks: Track[], keys: string[]): Promise<Record<string, any>[]> {
-        columns.value[datasetId] = columns.value[datasetId] || {};
-        const columnsAvailable = Object.keys(columns.value[datasetId]);
-        const columnsList = getColumns(tracks, keys).filter((x) => !columnsAvailable.includes(x));
-
-        if (columnsList.length > 0) {
-            const columnsData = await datasetsGetColumns(datasetId, columnsList);
-            if (columnsData) {
-                for (const [index, column] of columnsList.entries()) {
-                    columns.value[datasetId][column] = columnsData[index];
-                }
-            }
-        }
-
-        const results: Record<string, any>[] = [];
-        tracks.forEach((track) => {
-            const trackEntry: Record<string, any> = {};
-            keys.forEach((key) => {
-                const column = track[key];
-                if (column && !SPECIAL_KEYS.includes(column)) {
-                    trackEntry[key] = columns.value[datasetId][column];
-                }
-            });
-            results.push(trackEntry);
-        });
-
-        return results;
-    }
-
-    return {
-        fetchColumns,
-    };
-}

package/src/store/configStore.ts

@@ -1,29 +0,0 @@
-import { ref, type Ref } from "vue";
-
-const root = ref("/");
-const credentials: Ref<RequestCredentials> = ref("include");
-
-export function useConfigStore() {
-    function getCredentials(): RequestCredentials {
-        return credentials.value;
-    }
-
-    function setCredentials(newCredentials: RequestCredentials) {
-        credentials.value = newCredentials;
-    }
-
-    function getRoot(): string {
-        return root.value;
-    }
-
-    function setRoot(newRoot: string) {
-        root.value = newRoot;
-    }
-
-    return {
-        getCredentials,
-        setCredentials,
-        getRoot,
-        setRoot,
-    };
-}

package/src/style.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

package/src/utilities/getFileName.test.js

@@ -1,8 +0,0 @@
-import { getFileName } from "./getFileName.ts";
-
-test("identify name without extension", () => {
-    expect(getFileName("name.extension")).toEqual("name");
-    expect(getFileName("/sub/path/name.extension")).toEqual("name");
-    expect(getFileName("http://name.extension")).toEqual("name");
-    expect(getFileName("http://sub/path/name.extension")).toEqual("name");
-});

package/src/utilities/getFileName.ts

@@ -1,4 +0,0 @@
-export function getFileName(path: string) {
-    const extension = path.replace(/^.*[\\\/]/, "");
-    return extension.substring(0, extension.lastIndexOf("."));
-}

package/src/utilities/parseColumns.ts

@@ -1,34 +0,0 @@
-interface Dataset {
-    metadata_column_types: Record<string, string>;
-}
-
-interface Column {
-    label: string;
-    value: string;
-}
-
-export function parseColumns(
-    dataset: Dataset,
-    isAuto: boolean,
-    isText: boolean,
-    isNumber: boolean
-): Array<Column> {
-    const columns: Array<Column> = [];
-
-    if (isAuto) {
-        columns.push({ label: "Column: Default", value: "auto" });
-    }
-
-    const meta = dataset.metadata_column_types;
-    for (const key in meta) {
-        if (
-            (isNumber && ["int", "float"].includes(meta[key])) ||
-            (isText && meta[key] === "str") ||
-            (!isNumber && !isText)
-        ) {
-            columns.push({ label: "Column: " + (parseInt(key) + 1), value: key });
-        }
-    }
-
-    return columns;
-}

package/src/utilities/parseDefaults.test.js

@@ -1,13 +0,0 @@
-import { parseDefaults } from "./parseDefaults.ts";
-
-test("parse defaults", () => {
-    expect(
-        parseDefaults([
-            { name: "a", value: "b" },
-            { name: "c", value: "d" },
-            { name: "e", value: undefined },
-            { name: "f" },
-            { value: "g" },
-        ]),
-    ).toEqual({ a: "b", c: "d", e: null, f: null });
-});

package/src/utilities/parseDefaults.ts

@@ -1,17 +0,0 @@
-import type { InputElementType, InputValuesType } from "@/types";
-
-export function parseDefaults(inputs?: Array<InputElementType>): InputValuesType {
-    const dv: InputValuesType = {};
-
-    if (inputs) {
-        inputs.forEach((input) => {
-            if (input.name) {
-                dv[input.name] = input.value ?? null;
-            } else {
-                console.debug("Warning: Detected input element with no name.");
-            }
-        });
-    }
-
-    return dv;
-}

package/src/utilities/parseIncoming.ts

@@ -1,32 +0,0 @@
-import type { PluginType, PluginConfigType } from "@/types";
-
-interface ParsedIncoming {
-    root: string;
-    visualizationConfig: PluginConfigType;
-    visualizationId?: string;
-    visualizationPlugin?: PluginType;
-    visualizationTitle: string;
-}
-
-export function parseIncoming(): ParsedIncoming {
-    // Access attached data
-    const element = document.getElementById("app");
-    const incoming = JSON.parse(element?.getAttribute("data-incoming") || "{}") || {};
-
-    // Parse incoming data
-    const root = incoming.root || "/";
-    const visualizationId = incoming.visualization_id || null;
-    const visualizationPlugin = incoming.visualization_plugin;
-    const visualizationTitle = incoming.visualization_title || "Unnamed Visualization";
-
-    // Parse chart dict
-    let visualizationConfig = incoming.visualization_config;
-    if (incoming.visualization_config?.chart_dict) {
-        const chartDict = incoming.visualization_config.chart_dict;
-        visualizationConfig.groups = chartDict.groups;
-        visualizationConfig.settings = chartDict.settings;
-        delete visualizationConfig["chart_dict"];
-    }
-
-    return { root, visualizationConfig, visualizationId, visualizationPlugin, visualizationTitle };
-}

package/src/utilities/parsePlugin.ts

@@ -1,95 +0,0 @@
-import { rethrowSimple } from "@/utilities/simpleError";
-import { parseXML } from "@/utilities/parseXML";
-import type { InputAtomicType, InputElementType, InputValuesType, PluginConfigType, PluginType } from "@/types";
-
-interface ParsedPlugin {
-    plugin: PluginType;
-    settings: InputValuesType;
-    specs: Record<string, string> | undefined;
-    tracks: Array<InputValuesType>;
-}
-
-// Parse plugin either from incoming object or XML
-export async function parsePlugin(
-    xml: string,
-    plugin?: PluginType,
-    config: PluginConfigType = {}
-): Promise<ParsedPlugin> {
-    // Build plugin from XML if not provided through attached DOM data
-    if (!plugin) {
-        try {
-            plugin = await parseXML(xml);
-        } catch (err) {
-            console.error("Visualization requires configuration from XML or attached `visualization_plugin` details.");
-            rethrowSimple(err);
-        }
-    }
-
-    // Filter, format, and add defaults to incoming settings and track values
-    const settings = parseValues(plugin.settings, config.settings);
-    const specs = plugin.specs;
-    const tracks = parseTracks(plugin.tracks, config.tracks);
-
-    return { plugin, settings, specs, tracks };
-}
-
-// Format value according to input type
-function formatValue(input: InputElementType, inputValue: InputAtomicType): InputAtomicType {
-    let value = inputValue ?? input.value;
-    if (input.type === "float") {
-        value = Number(value);
-    }
-    return value;
-}
-
-// Format conditional values based on test cases
-function formatConditional(input: InputElementType, values: InputValuesType = {}): InputValuesType {
-    const result = values;
-    const testName = input.test_param?.name;
-
-    if (!testName) {
-        console.error(`Test parameter has no name: ${input.name}.`);
-    } else {
-        const testValue = result[testName] ?? input.test_param?.value;
-        for (const inputCase of input.cases || []) {
-            if (inputCase.value === testValue) {
-                result[testName] = testValue;
-                if (inputCase.inputs?.length) {
-                    for (const conditionalInput of inputCase.inputs) {
-                        result[conditionalInput.name] = formatValue(conditionalInput, result[conditionalInput.name]);
-                    }
-                }
-            }
-        }
-    }
-    return result;
-}
-
-// Parse values with conditional handling
-function parseValues(inputs?: Array<InputElementType>, values?: InputValuesType): InputValuesType {
-    const result = values || {};
-
-    inputs?.forEach((input) => {
-        if (input.type === "conditional") {
-            result[input.name] = formatConditional(input, result[input.name]);
-        } else {
-            result[input.name] = formatValue(input, result[input.name]);
-        }
-    });
-
-    return result;
-}
-
-// Parse tracks with nested values
-function parseTracks(inputs?: Array<InputElementType>, tracks?: Array<InputValuesType>): Array<InputValuesType> {
-    const values = tracks || [];
-    if (inputs) {
-        if (values.length === 0) {
-            values.push({});
-        }
-        values.forEach((track, trackIndex) => {
-            values[trackIndex] = parseValues(inputs, track);
-        });
-    }
-    return values;
-}

package/src/utilities/parseXML.ts

@@ -1,156 +0,0 @@
-import axios from "axios";
-import { getFileName } from "@/utilities/getFileName";
-import type { PluginType } from "@/types";
-const parser = new DOMParser();
-
-interface MacroEntries {
-    [key: string]: Element[];
-}
-
-// Parses the base XML with macros and expands nodes
-async function parseMacros(xmlBaseString: string, xmlPath: string = ""): Promise<Document> {
-    const xmlDoc = parser.parseFromString(xmlBaseString, "text/xml");
-
-    // Parse macros from base XML
-    const macroFiles: string[] = [];
-    const macrosNodes = xmlDoc.documentElement.getElementsByTagName("macros");
-    if (macrosNodes.length > 0) {
-        for (const macroNode of Array.from(macrosNodes)) {
-            for (const element of Array.from(macroNode.children)) {
-                macroFiles.push(element.textContent?.trim() || "");
-            }
-        }
-    }
-    console.debug(`Detected ${macroFiles.length} macro file(s) in xml.`);
-
-    // Load and collect macro entries
-    const xmlEntries: MacroEntries = {};
-    for (const macroFile of macroFiles) {
-        const { data } = await axios.get(`${xmlPath}${macroFile}`);
-        const xmlMacro = parser.parseFromString(data, "text/xml");
-        const xmlNode = xmlMacro.documentElement.getElementsByTagName("xml");
-        if (xmlNode.length > 0) {
-            for (const xmlEntry of Array.from(xmlNode)) {
-                const xmlName = xmlEntry.getAttribute("name");
-                if (xmlName) {
-                    for (const entry of Array.from(xmlEntry.children)) {
-                        xmlEntries[xmlName] = xmlEntries[xmlName] || [];
-                        xmlEntries[xmlName].push(entry);
-                    }
-                }
-            }
-        }
-    }
-    console.debug(`Successfully collected macro files.`);
-
-    // Parse macros from base XML
-    const expandNodes = xmlDoc.documentElement.getElementsByTagName("expand");
-    if (expandNodes.length > 0) {
-        for (const expandNode of Array.from(expandNodes)) {
-            const expandName = expandNode.getAttribute("macro");
-            if (expandName && expandName in xmlEntries) {
-                const entries = xmlEntries[expandName];
-                for (const entry of entries) {
-                    expandNode.parentNode?.appendChild(entry.cloneNode(true));
-                }
-                expandNode.parentNode?.removeChild(expandNode);
-            } else {
-                console.error(`Failed to detect '${expandName}' macros source.`);
-            }
-        }
-    }
-
-    // Returns full XML document with populated macros
-    return xmlDoc;
-}
-
-// Parse XML file and collect attributes
-export async function parseXML(xmlFileName: string): Promise<PluginType> {
-    const xmlBase = await axios.get(xmlFileName);
-    const xmlDoc = await parseMacros(xmlBase.data);
-
-    // Parse name and logo
-    const result: PluginType = { name: getFileName(xmlFileName) };
-    result.html = xmlDoc.documentElement.getAttribute("name");
-    result.logo = xmlDoc.documentElement.getAttribute("logo");
-
-    // Parse description
-    const descriptionNode = xmlDoc.documentElement.getElementsByTagName("description");
-    if (descriptionNode.length === 1) {
-        result.description = descriptionNode[0].textContent?.trim() || null;
-    }
-
-    // Parse specifications
-    const specsNode = xmlDoc.documentElement.getElementsByTagName("specs");
-    if (specsNode.length === 1) {
-        result.specs = new DictParser(specsNode[0]);
-    }
-
-    // Parse inputs from groups and settings sections
-    ["settings", "tracks"].forEach((key) => {
-        const xmlNode = xmlDoc.documentElement.getElementsByTagName(key);
-        if (xmlNode.length === 1) {
-            (result as any)[key] = new ListParser(xmlNode[0]);
-        }
-    });
-
-    return result;
-}
-
-/**
- * Converts an XML structure into an array
- */
-class ListParser extends Array {
-    constructor(elements: Element) {
-        super();
-        for (const element of Array.from(elements.children)) {
-            if (element.children.length > 0) {
-                if (element.tagName === element.children[0].tagName) {
-                    this.push(new ListParser(element));
-                } else {
-                    this.push(new DictParser(element));
-                }
-            } else if (element.textContent && element.textContent.trim()) {
-                this.push(element.textContent.trim());
-            }
-        }
-    }
-}
-
-/**
- * Converts an XML structure into a dictionary
- */
-class DictParser {
-    [key: string]: any;
-
-    constructor(parentElement: Element) {
-        if (parentElement.attributes.length > 0) {
-            for (const attr of Array.from(parentElement.attributes)) {
-                this[attr.name] = attr.value;
-            }
-        }
-        for (const element of Array.from(parentElement.children)) {
-            if (element.children.length > 0) {
-                let asJson;
-                if (element.tagName === element.children[0].tagName) {
-                    asJson = new ListParser(element);
-                } else {
-                    const aDict = new DictParser(element);
-                    for (const attr of Array.from(element.attributes)) {
-                        aDict[attr.name] = attr.value;
-                    }
-                    asJson = aDict;
-                }
-                this[element.tagName] = asJson;
-            } else if (element.attributes.length > 0) {
-                const attrObj: { [key: string]: string } = {};
-                for (const attr of Array.from(element.attributes)) {
-                    attrObj[attr.name] = attr.value;
-                }
-                this[element.tagName] = attrObj;
-            } else {
-                this[element.tagName] = element.textContent?.trim() || null;
-            }
-        }
-    }
-}

package/src/utilities/simpleError.ts

@@ -1,21 +0,0 @@
-export function errorMessageAsString(e: any, defaultMessage = "Request failed.") {
-    // Note that despite the name, this can actually currently return an object,
-    // depending on what data.err_msg is (e.g. an object)
-    let message = defaultMessage;
-    if (e && e.response && e.response.data && e.response.data.err_msg) {
-        message = e.response.data.err_msg;
-    } else if (e && e.data && e.data.err_msg) {
-        message = e.data.err_msg;
-    } else if (e && e.response) {
-        message = `${e.response.statusText} (${e.response.status})`;
-    } else if (e instanceof Error) {
-        message = e.message;
-    } else if (typeof e == "string") {
-        message = e;
-    }
-    return message;
-}
-
-export function rethrowSimple(e: any): never {
-    throw Error(errorMessageAsString(e));
-}

package/src/utilities/toBoolean.test.js

@@ -1,12 +0,0 @@
-import { toBoolean } from "./toBoolean.ts";
-
-test("to boolean conversion", () => {
-    expect(toBoolean(true)).toBeTruthy();
-    expect(toBoolean("true")).toBeTruthy();
-    expect(toBoolean("TrUe")).toBeTruthy();
-    expect(toBoolean(false)).toBeFalsy();
-    expect(toBoolean("rue")).toBeFalsy();
-    expect(toBoolean(1)).toBeFalsy();
-    expect(toBoolean(null)).toBeFalsy();
-    expect(toBoolean(undefined)).toBeFalsy();
-});