use-neo4j

Version:
<div style="text-align:center"> <h1>React Hooks For Neo4j</h1>
96 lines (95 loc) • 5.27 kB
JavaScript
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (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;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.LoginDesktop = void 0;
var react_1 = __importStar(require("react"));
var form_items_1 = require("./form-items");
exports.LoginDesktop = function (_a) {
    var classNames = _a.classNames, showActive = _a.showActive, hide = _a.hide, onSubmit = _a.onSubmit;
    var _b = react_1.useState(true), loading = _b[0], setLoading = _b[1];
    var _c = react_1.useState([]), projects = _c[0], setProjects = _c[1];
    var _d = react_1.useState(), error = _d[0], setError = _d[1];
    var _e = react_1.useState({}), project = _e[0], setProject = _e[1];
    var _f = react_1.useState(), graph = _f[0], setGraph = _f[1];
    react_1.useEffect(function () {
        // @ts-ignore
        if (!window.neo4jDesktopApi) {
            setLoading(false);
            return;
        }
        // @ts-ignore
        window.neo4jDesktopApi.getContext()
            .then(function (context) {
            var projects = context.projects.map(function (_a) {
                var id = _a.id, name = _a.name, graphs = _a.graphs;
                return ({
                    id: id,
                    name: name,
                    graphs: graphs
                });
            });
            setProjects(projects);
            setProject(projects[0]);
            setGraph(projects[0].graphs[0]);
            setLoading(false);
        });
    }, []);
    var handleProjectChange = function (selected) {
        setProject(selected.value);
        setGraph(selected.value.graphs[0]);
    };
    var handleGraphChange = function (selected) {
        setGraph(selected.value);
    };
    var handleSubmit = function () {
        if (!graph)
            return;
        var _a = graph.connection.configuration.protocols.bolt, url = _a.url, host = _a.host, port = _a.port, username = _a.username, password = _a.password;
        var scheme = 'neo4j';
        if (url.includes('://')) {
            scheme = url.split('://')[0];
        }
        onSubmit({ scheme: scheme, host: host, port: port, username: username, password: password });
    };
    var connectToActiveGraph = function () {
        var graphs = projects.reduce(function (state, project) { return state.concat(project.graphs); }, []);
        var active = graphs.find(function (graph) { return graph.status === 'ACTIVE'; });
        if (!active)
            setError(new Error('There is no active graph.  Click the `Start` button on a Database in Neoj Desktop and try again.'));
        var _a = active.connection.configuration.protocols.bolt, host = _a.host, port = _a.port, username = _a.username, password = _a.password;
        var scheme = 'neo4j';
        onSubmit({ scheme: scheme, host: host, port: port, username: username, password: password });
    };
    if (loading) {
        return react_1.default.createElement("div", null);
    }
    // @ts-ignore
    var graphs = (project === null || project === void 0 ? void 0 : project.graphs) && react_1.default.createElement(form_items_1.FormSelect, { classNames: classNames, id: "graph", label: "Graph", options: project === null || project === void 0 ? void 0 : project.graphs.map(function (value) { return ({ key: value.id, text: value.name, value: value }); }), value: graph, setter: handleGraphChange });
    return (react_1.default.createElement("div", null,
        error && (react_1.default.createElement("div", { className: classNames.formError }, error.message)),
        react_1.default.createElement(form_items_1.FormSelect, { classNames: classNames, id: "project", label: "Project", options: projects.map(function (value) { return ({ key: value.id, text: value.name, value: value }); }), value: project, setter: handleProjectChange }),
        graphs,
        react_1.default.createElement("div", { className: classNames.formButtons },
            project && graph && react_1.default.createElement(form_items_1.FormButton, { text: "Connect", className: classNames.formButtonPrimary, onClick: handleSubmit }),
            showActive && react_1.default.createElement(form_items_1.FormButton, { text: "Active Graph", className: classNames.formButtonSecondary, onClick: connectToActiveGraph })),
        react_1.default.createElement("div", { className: classNames.loginOtherDatabase },
            react_1.default.createElement("a", { onClick: function () { return hide(); } }, "Or connect to another graph"))));
};