@mwater/visualization 5.4.4 → 5.5.0

package/lib/mwater_table_selection/MWaterAccountingSystemListComponent.d.ts

@@ -0,0 +1,20 @@
+import { Schema } from "@mwater/expressions";
+import React from "react";
+export interface MWaterAccountingSystemListComponentProps {
+    apiUrl: string;
+    schema: Schema;
+    client?: string;
+    /** User id (not currently used but good for consistency) */
+    user?: string;
+    /** Called with table selected, e.g. "custom.accounting:123.accounts" */
+    onChange: (tableId: string | null) => void;
+    /** Current list of extra table wildcards, e.g. ["accounting:123.*"] */
+    extraTables: string[];
+    /** Called to request loading tables for an accounting system, e.g. "accounting:123.*" */
+    onExtraTableAdd: (wildcardTableId: string) => void;
+    /** Called to request unloading tables for an accounting system */
+    onExtraTableRemove: (wildcardTableId: string) => void;
+    /** e.g. "en" */
+    locale?: string;
+}
+export declare function MWaterAccountingSystemListComponent(props: MWaterAccountingSystemListComponentProps): React.JSX.Element;

package/lib/mwater_table_selection/MWaterAccountingSystemListComponent.js

@@ -0,0 +1,157 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MWaterAccountingSystemListComponent = MWaterAccountingSystemListComponent;
+const lodash_1 = __importDefault(require("lodash"));
+const expressions_1 = require("@mwater/expressions");
+const react_1 = require("react");
+const react_2 = __importDefault(require("react"));
+const UIComponents_1 = require("../UIComponents");
+const bootstrap_1 = require("@mwater/react-library/lib/bootstrap");
+function MWaterAccountingSystemListComponent(props) {
+    const { apiUrl, schema, client, onChange, extraTables, onExtraTableAdd, onExtraTableRemove, locale } = props;
+    const [rawAccountingSystems, setRawAccountingSystems] = (0, react_1.useState)();
+    const [accountingTablesetDesign, setAccountingTablesetDesign] = (0, react_1.useState)();
+    const [search, setSearch] = (0, react_1.useState)("");
+    // Stores the fully qualified table ID that we want to select after its system is loaded
+    const [targetSelection, setTargetSelection] = (0, react_1.useState)();
+    // Fetch accounting systems (partitions) and the main accounting tableset design
+    (0, react_1.useEffect)(() => {
+        // Fetch rows from the 'custom.accounting.partitions' table
+        fetch(`${apiUrl}custom/accounting/partitions?client=${client || ""}`)
+            .then((response) => {
+            if (!response.ok) {
+                console.error(`Error fetching accounting system partitions: ${response.status} ${response.statusText}`);
+                return []; // Return empty array on error
+            }
+            return response.json();
+        })
+            .then((systems) => {
+            setRawAccountingSystems(systems);
+        })
+            .catch(error => {
+            console.error("Failed to load accounting systems:", error);
+            setRawAccountingSystems([]);
+        });
+        // Fetch the design of the 'custom.accounting' tableset
+        const filter = encodeURIComponent(JSON.stringify({ code: "accounting" }));
+        fetch(`${apiUrl}custom_tablesets?filter=${filter}&client=${client || ""}`)
+            .then((response) => {
+            if (!response.ok) {
+                console.error(`Error fetching accounting tableset design: ${response.status} ${response.statusText}`);
+                return null;
+            }
+            return response.json();
+        })
+            .then((tablesets) => {
+            if (tablesets && tablesets.length > 0 && tablesets[0].design) {
+                setAccountingTablesetDesign(tablesets[0].design);
+            }
+            else {
+                console.error("Accounting tableset design not found or invalid structure.");
+            }
+        })
+            .catch(error => {
+            console.error("Failed to load accounting tableset design:", error);
+        });
+    }, [apiUrl, client]);
+    const sortedAccountingSystems = (0, react_1.useMemo)(() => {
+        if (!rawAccountingSystems) {
+            return undefined;
+        }
+        return lodash_1.default.sortByAll(rawAccountingSystems, [
+            (sys) => {
+                const wildcard = `custom.accounting:${String(sys._partition)}.*`;
+                return !extraTables.includes(wildcard); // false (0) for included, true (1) for not
+            },
+            (sys) => sys.name
+        ]);
+    }, [rawAccountingSystems, extraTables]);
+    // Effect to handle selecting a table once its accounting system's tables are loaded into the schema
+    (0, react_1.useEffect)(() => {
+        if (targetSelection && schema.getTable(targetSelection)) {
+            onChange(targetSelection);
+            setTargetSelection(undefined); // Clear the target selection
+        }
+    }, [targetSelection, schema, onChange]);
+    const handleSelectTable = (partitionId, table) => {
+        const qualifiedTableId = `custom.accounting:${String(partitionId)}.${table.id}`;
+        const accountingSystemWildcard = `custom.accounting:${String(partitionId)}.*`;
+        if (!extraTables.includes(accountingSystemWildcard)) {
+            onExtraTableAdd(accountingSystemWildcard);
+        }
+        if (schema.getTable(qualifiedTableId)) {
+            onChange(qualifiedTableId);
+        }
+        else {
+            // If not yet in schema, ensure add request is made and set for future selection
+            if (!extraTables.includes(accountingSystemWildcard)) {
+                onExtraTableAdd(accountingSystemWildcard);
+            }
+            setTargetSelection(qualifiedTableId);
+        }
+    };
+    const handleRemoveAccountingSystem = (partitionId) => {
+        const accountingSystemWildcard = `custom.accounting:${String(partitionId)}.*`;
+        if (confirm(T `Remove this accounting system? Some widgets may not work correctly.`)) {
+            onExtraTableRemove(accountingSystemWildcard);
+        }
+    };
+    if (!sortedAccountingSystems || !accountingTablesetDesign) {
+        return (react_2.default.createElement("div", null,
+            react_2.default.createElement("i", { className: "fa fa-spin fa-spinner" }),
+            " ",
+            T `Loading accounting data...`));
+    }
+    const filteredSystems = sortedAccountingSystems.filter(system => {
+        if (search === "") {
+            return true;
+        }
+        const systemName = expressions_1.ExprUtils.localizeString(system.name, locale) || "";
+        if (systemName.toLowerCase().includes(search.toLowerCase())) {
+            return true;
+        }
+        return accountingTablesetDesign.tables.some(t => !t.deprecated && (expressions_1.ExprUtils.localizeString(t.name, locale) || "").toLowerCase().includes(search.toLowerCase()));
+    });
+    const renderSingleAccountingSystem = (system) => {
+        const systemName = expressions_1.ExprUtils.localizeString(system.name, locale) || T `Unnamed System (${system._partition})`;
+        const accountingSystemWildcard = `custom.accounting:${String(system._partition)}.*`;
+        const isIncluded = extraTables.includes(accountingSystemWildcard);
+        const tablesForThisSystem = accountingTablesetDesign.tables
+            .filter(t => !t.deprecated)
+            .filter(t => t.id != "partitions" && t.id != "roles")
+            .filter(t => {
+            if (search === "") {
+                return true;
+            }
+            if ((expressions_1.ExprUtils.localizeString(system.name, locale) || "").toLowerCase().includes(search.toLowerCase())) {
+                return true;
+            }
+            return (expressions_1.ExprUtils.localizeString(t.name, locale) || "").toLowerCase().includes(search.toLowerCase());
+        })
+            .map(t => ({
+            name: expressions_1.ExprUtils.localizeString(t.name, locale),
+            onClick: () => handleSelectTable(system._partition, t)
+        }));
+        if (search !== "" && !(expressions_1.ExprUtils.localizeString(system.name, locale) || "").toLowerCase().includes(search.toLowerCase()) && tablesForThisSystem.length === 0) {
+            return null;
+        }
+        return (react_2.default.createElement("div", { key: system._partition, className: "mt-3" },
+            react_2.default.createElement("div", { className: "d-flex justify-content-between align-items-center" },
+                react_2.default.createElement("h4", { className: "text-muted mb-1" }, systemName),
+                isIncluded && (react_2.default.createElement("button", { className: "btn btn-sm btn-link", type: "button", onClick: () => handleRemoveAccountingSystem(system._partition), title: T `Remove this accounting system` },
+                    react_2.default.createElement("i", { className: "fa fa-times" })))),
+            react_2.default.createElement(UIComponents_1.OptionListComponent, { items: tablesForThisSystem })));
+    };
+    return (react_2.default.createElement("div", null,
+        react_2.default.createElement(bootstrap_1.TextInput, { value: search, onChange: setSearch, placeholder: T `Search accounting systems or tables...` }),
+        targetSelection && !schema.getTable(targetSelection) && (react_2.default.createElement("div", { className: "alert alert-info my-2" },
+            react_2.default.createElement("i", { className: "fa fa-spinner fa-spin me-2" }),
+            T `Loading tables for selected accounting system...`)),
+        filteredSystems.length > 0
+            ? filteredSystems.map(system => renderSingleAccountingSystem(system))
+            : (sortedAccountingSystems.length > 0 && search !== "" && react_2.default.createElement("p", null, T `No accounting systems or tables match your search.`)),
+        sortedAccountingSystems.length === 0 && !targetSelection && react_2.default.createElement("p", null, T `No accounting systems found.`)));
+}

package/lib/mwater_table_selection/MWaterAssetSystemsListComponent.d.ts

@@ -0,0 +1,17 @@
+import { Schema } from "@mwater/expressions";
+import React from "react";
+/** Searchable list of asset system tables */
+export declare const MWaterAssetSystemsListComponent: (props: {
+    apiUrl: string;
+    schema: Schema;
+    client?: string;
+    /** User id */
+    user?: string;
+    /** Called with table selected */
+    onChange: (tableId: string | null) => void;
+    extraTables: string[];
+    onExtraTableAdd: (tableId: string) => void;
+    onExtraTableRemove: (tableId: string) => void;
+    /** e.g. "en" */
+    locale?: string;
+}) => React.JSX.Element;

package/lib/mwater_table_selection/MWaterAssetSystemsListComponent.js

@@ -0,0 +1,79 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MWaterAssetSystemsListComponent = void 0;
+const lodash_1 = __importDefault(require("lodash"));
+const expressions_1 = require("@mwater/expressions");
+const react_1 = require("react");
+const react_2 = __importDefault(require("react"));
+const UIComponents_1 = require("../UIComponents");
+const bootstrap_1 = require("@mwater/react-library/lib/bootstrap");
+/** Searchable list of asset system tables */
+const MWaterAssetSystemsListComponent = (props) => {
+    const [systems, setSystems] = (0, react_1.useState)();
+    const [search, setSearch] = (0, react_1.useState)("");
+    const [extraTableNeeded, setExtraTableNeeded] = (0, react_1.useState)();
+    // Get list of all systems
+    (0, react_1.useEffect)(() => {
+        fetch(`${props.apiUrl}asset_systems?client=${props.client || ""}`)
+            .then((response) => response.json())
+            .then((body) => {
+            // Put included ones first
+            setSystems(lodash_1.default.sortByAll(body, [
+                (m) => (props.extraTables.some(t => t == `assets:${m.sid}`)) ? 0 : 1,
+                (m) => expressions_1.ExprUtils.localizeString(m.design.name, props.locale)
+            ]));
+        });
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (extraTableNeeded && props.schema.getTable(extraTableNeeded)) {
+            props.onChange(extraTableNeeded);
+        }
+    });
+    const selectTable = (system) => {
+        const qualifiedTableId = `assets:${system.sid}`;
+        // If already included, select it
+        if (props.schema.getTable(qualifiedTableId)) {
+            props.onChange(qualifiedTableId);
+            return;
+        }
+        // Request extra tables as wildcard
+        setExtraTableNeeded(qualifiedTableId);
+        props.onExtraTableAdd(qualifiedTableId);
+    };
+    const handleRemove = (system) => {
+        // Remove from extra tables
+        const match = props.extraTables.find((t) => t == `assets:${system.sid}`);
+        if (match) {
+            if (confirm(T `Remove this table? Some widgets may not work correctly.`)) {
+                props.onChange(null);
+                props.onExtraTableRemove(match);
+            }
+        }
+    };
+    if (!systems || extraTableNeeded) {
+        return (react_2.default.createElement("div", null,
+            react_2.default.createElement("i", { className: "fa fa-spin fa-spinner" }),
+            " ",
+            T `Loading...`));
+    }
+    const renderAssetSystems = () => {
+        const items = systems
+            .map((m) => {
+            const alreadyIncluded = props.extraTables.some((t) => t == `assets:${m.sid}`);
+            return {
+                name: expressions_1.ExprUtils.localizeString(m.design.name, props.locale) || "",
+                onClick: () => selectTable(m),
+                onRemove: alreadyIncluded ? handleRemove.bind(null, m) : undefined
+            };
+        })
+            .filter((item) => !search || !item.name.toLowerCase().includes(search.toLowerCase()));
+        return react_2.default.createElement(UIComponents_1.OptionListComponent, { items: items });
+    };
+    return (react_2.default.createElement("div", null,
+        react_2.default.createElement(bootstrap_1.TextInput, { value: search, onChange: setSearch, placeholder: T `Search...` }),
+        renderAssetSystems()));
+};
+exports.MWaterAssetSystemsListComponent = MWaterAssetSystemsListComponent;

package/lib/mwater_table_selection/MWaterCompleteTableSelectComponent.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+import { Schema } from "@mwater/expressions";
+interface MWaterCompleteTableSelectComponentProps {
+    /** Url to hit api */
+    apiUrl: string;
+    /** Optional client */
+    client?: string;
+    schema: Schema;
+    /** User id */
+    user?: string;
+    table?: string;
+    /** Called with table selected */
+    onChange: any;
+    extraTables: any;
+    onExtraTablesChange: any;
+}
+export default class MWaterCompleteTableSelectComponent extends React.Component<MWaterCompleteTableSelectComponentProps, {
+    showLegacyAssets: boolean;
+}> {
+    constructor(props: MWaterCompleteTableSelectComponentProps);
+    handleExtraTableAdd: (tableId: any) => any;
+    handleExtraTableRemove: (tableId: any) => any;
+    renderSites(): React.JSX.Element;
+    renderForms(): React.JSX.Element;
+    renderIndicators(): React.JSX.Element;
+    renderIssues(): React.JSX.Element;
+    renderSweetSense(): React.JSX.Element;
+    renderTablesets(): React.JSX.Element;
+    renderMetrics(): React.JSX.Element;
+    renderAccountingSystems(): React.JSX.Element;
+    renderAssets(): React.JSX.Element;
+    renderLegacyAssets(): React.JSX.Element;
+    renderOther(): React.JSX.Element;
+    getSweetSenseTables(): import("@mwater/expressions").Table[];
+    render(): React.JSX.Element;
+}
+export {};

package/lib/mwater_table_selection/MWaterCompleteTableSelectComponent.js

@@ -0,0 +1,275 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_1 = __importDefault(require("lodash"));
+const react_1 = __importDefault(require("react"));
+const TabbedComponent_1 = __importDefault(require("@mwater/react-library/lib/TabbedComponent"));
+const uiComponents = __importStar(require("../UIComponents"));
+const expressions_1 = require("@mwater/expressions");
+const MWaterCustomTablesetListComponent_1 = require("./MWaterCustomTablesetListComponent");
+const MWaterMetricsTableListComponent_1 = require("./MWaterMetricsTableListComponent");
+const MWaterAssetSystemsListComponent_1 = require("./MWaterAssetSystemsListComponent");
+const FormsListComponent_1 = require("./FormsListComponent");
+const IndicatorsListComponent_1 = require("./IndicatorsListComponent");
+const IssuesListComponent_1 = require("./IssuesListComponent");
+const MWaterAccountingSystemListComponent_1 = require("./MWaterAccountingSystemListComponent");
+const sitesOrder = {
+    "entities.water_point": 1,
+    "entities.sanitation_facility": 2,
+    "entities.household": 3,
+    "entities.community": 4,
+    "entities.school": 5,
+    "entities.health_facility": 6,
+    "entities.place_of_worship": 7,
+    "entities.water_system": 8,
+    "entities.water_system_component": 9,
+    "entities.wastewater_treatment_system": 10,
+    "entities.waste_disposal_site": 11
+};
+/** Entity types that are assets */
+const assetEntities = [
+    "entities.water_asset"
+];
+// Allows selection of a table. Is the complete list mode of tables
+class MWaterCompleteTableSelectComponent extends react_1.default.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            showLegacyAssets: false
+        };
+    }
+    handleExtraTableAdd = (tableId) => {
+        return this.props.onExtraTablesChange(lodash_1.default.union(this.props.extraTables, [tableId]));
+    };
+    handleExtraTableRemove = (tableId) => {
+        // Set to null if current table
+        if (this.props.table === tableId) {
+            this.props.onChange(null);
+        }
+        return this.props.onExtraTablesChange(lodash_1.default.without(this.props.extraTables, tableId));
+    };
+    renderSites() {
+        let table;
+        let types = [];
+        for (table of this.props.schema.getTables()) {
+            if (table.deprecated) {
+                continue;
+            }
+            if (!table.id.match(/^entities\./)) {
+                continue;
+            }
+            // Skip assets
+            if (assetEntities.includes(table.id)) {
+                continue;
+            }
+            types.push(table.id);
+        }
+        // Sort by order if present
+        types = lodash_1.default.sortBy(types, (type) => sitesOrder[type] || 999);
+        return react_1.default.createElement(uiComponents.OptionListComponent, { items: lodash_1.default.compact(lodash_1.default.map(types, (tableId) => {
+                table = this.props.schema.getTable(tableId);
+                return {
+                    name: expressions_1.ExprUtils.localizeString(table.name, T.locale),
+                    desc: expressions_1.ExprUtils.localizeString(table.desc, T.locale),
+                    onClick: this.props.onChange.bind(null, table.id)
+                };
+            })) });
+    }
+    renderForms() {
+        return react_1.default.createElement(FormsListComponent_1.FormsListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove });
+    }
+    renderIndicators() {
+        return react_1.default.createElement(IndicatorsListComponent_1.IndicatorsListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove });
+    }
+    renderIssues() {
+        return react_1.default.createElement(IssuesListComponent_1.IssuesListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove });
+    }
+    renderSweetSense() {
+        let sweetSenseTables = this.getSweetSenseTables();
+        sweetSenseTables = lodash_1.default.sortBy(sweetSenseTables, (table) => table.name.en);
+        return react_1.default.createElement(uiComponents.OptionListComponent, { items: lodash_1.default.map(sweetSenseTables, (table) => {
+                return {
+                    name: expressions_1.ExprUtils.localizeString(table.name, T.locale),
+                    desc: expressions_1.ExprUtils.localizeString(table.desc, T.locale),
+                    onClick: this.props.onChange.bind(null, table.id)
+                };
+            }) });
+    }
+    renderTablesets() {
+        return react_1.default.createElement(MWaterCustomTablesetListComponent_1.MWaterCustomTablesetListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove, locale: T.locale });
+    }
+    renderMetrics() {
+        return react_1.default.createElement(MWaterMetricsTableListComponent_1.MWaterMetricsTableListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove, locale: T.locale });
+    }
+    renderAccountingSystems() {
+        return react_1.default.createElement(MWaterAccountingSystemListComponent_1.MWaterAccountingSystemListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove, locale: T.locale });
+    }
+    renderAssets() {
+        const items = [];
+        for (const tableId of assetEntities) {
+            const table = this.props.schema.getTable(tableId);
+            if (!table) {
+                continue;
+            }
+            items.push({
+                name: expressions_1.ExprUtils.localizeString(table.name, T.locale),
+                desc: expressions_1.ExprUtils.localizeString(table.desc, T.locale),
+                onClick: this.props.onChange.bind(null, table.id),
+                onRemove: this.handleExtraTableRemove.bind(null, table.id)
+            });
+        }
+        return react_1.default.createElement("div", null,
+            react_1.default.createElement(uiComponents.OptionListComponent, { items: items }),
+            react_1.default.createElement("div", { className: "text-center mt-2 mb-2" },
+                react_1.default.createElement("button", { className: "btn btn-link", onClick: () => this.setState({ showLegacyAssets: !this.state.showLegacyAssets }) },
+                    this.state.showLegacyAssets ? T `Hide` : T `Show`,
+                    " ",
+                    T `Legacy Assets`)),
+            this.state.showLegacyAssets && this.renderLegacyAssets());
+    }
+    renderLegacyAssets() {
+        return react_1.default.createElement(MWaterAssetSystemsListComponent_1.MWaterAssetSystemsListComponent, { schema: this.props.schema, client: this.props.client, apiUrl: this.props.apiUrl, user: this.props.user, onChange: this.props.onChange, extraTables: this.props.extraTables, onExtraTableAdd: this.handleExtraTableAdd, onExtraTableRemove: this.handleExtraTableRemove, locale: T.locale });
+    }
+    renderOther() {
+        let otherTables = lodash_1.default.filter(this.props.schema.getTables(), (table) => {
+            // Remove deprecated
+            if (table.deprecated) {
+                return false;
+            }
+            // Remove sites
+            if (table.id.match(/^entities\./)) {
+                return false;
+            }
+            // sweetsense tables
+            if (table.id.match(/^sweetsense/)) {
+                return false;
+            }
+            // Remove responses
+            if (table.id.match(/^responses:/)) {
+                return false;
+            }
+            // Remove indicators
+            if (table.id.match(/^indicator_values:/)) {
+                return false;
+            }
+            // Remove issues
+            if (table.id.match(/^(issues|issue_events):/)) {
+                return false;
+            }
+            // Remove custom tablesets
+            if (table.id.match(/^custom\./)) {
+                return false;
+            }
+            // Remove metrics
+            if (table.id.match(/^metrics:/)) {
+                return false;
+            }
+            // Remove assets
+            if (table.id.match(/^assets:/)) {
+                return false;
+            }
+            return true;
+        });
+        otherTables = lodash_1.default.sortBy(otherTables, (table) => table.name.en);
+        return react_1.default.createElement(uiComponents.OptionListComponent, { items: lodash_1.default.map(otherTables, (table) => {
+                return {
+                    name: expressions_1.ExprUtils.localizeString(table.name, T.locale),
+                    desc: expressions_1.ExprUtils.localizeString(table.desc, T.locale),
+                    onClick: this.props.onChange.bind(null, table.id)
+                };
+            }) });
+    }
+    getSweetSenseTables() {
+        return lodash_1.default.filter(this.props.schema.getTables(), (table) => {
+            if (table.deprecated) {
+                return false;
+            }
+            if (table.id.match(/^sweetsense/)) {
+                return true;
+            }
+            return false;
+        });
+    }
+    render() {
+        const sweetSenseTables = this.getSweetSenseTables();
+        const tabs = [
+            { id: "sites", label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-map-marker" }),
+                    " ",
+                    T `Sites`), elem: this.renderSites() },
+            { id: "forms", label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-th-list" }),
+                    " ",
+                    T `Surveys`), elem: this.renderForms() },
+            {
+                id: "indicators",
+                label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-check-circle" }),
+                    " ",
+                    T `Indicators`),
+                elem: this.renderIndicators()
+            },
+            {
+                id: "issues",
+                label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-exclamation-circle" }),
+                    " ",
+                    T `Issues`),
+                elem: this.renderIssues()
+            },
+            { id: "tablesets", label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-table" }),
+                    " ",
+                    T `Tables`), elem: this.renderTablesets() },
+            { id: "metrics", label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-line-chart" }),
+                    " ",
+                    T `Metrics`), elem: this.renderMetrics() },
+            {
+                id: "accounting",
+                label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fa fa-calculator" }),
+                    " ",
+                    T `Accounting`),
+                elem: this.renderAccountingSystems()
+            },
+            { id: "assets", label: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("i", { className: "fas fa-map-pin" }),
+                    " ",
+                    T `Assets`), elem: this.renderAssets() }
+        ];
+        if (sweetSenseTables.length > 0) {
+            tabs.push({ id: "sensors", label: T `Sensors`, elem: this.renderSweetSense() });
+        }
+        tabs.push({ id: "other", label: T `Advanced`, elem: this.renderOther() });
+        return (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "text-muted" }, T `Select data from sites, surveys or an advanced category below. Indicators can be found within their associated site types.`),
+            react_1.default.createElement(TabbedComponent_1.default, { tabs: tabs, initialTabId: "sites" })));
+    }
+}
+exports.default = MWaterCompleteTableSelectComponent;

package/lib/mwater_table_selection/MWaterCustomTablesetListComponent.d.ts

@@ -0,0 +1,17 @@
+import { Schema } from "@mwater/expressions";
+import React from "react";
+/** Searchable list of custom tables */
+export declare const MWaterCustomTablesetListComponent: (props: {
+    apiUrl: string;
+    schema: Schema;
+    client?: string;
+    /** User id */
+    user?: string;
+    /** Called with table selected */
+    onChange: (tableId: string | null) => void;
+    extraTables: string[];
+    onExtraTableAdd: (tableId: string) => void;
+    onExtraTableRemove: (tableId: string) => void;
+    /** e.g. "en" */
+    locale?: string;
+}) => React.JSX.Element;