{"blocks":[{"type":"paragraph","data":{"text":"Server"}},{"type":"codeTool","data":{"codeData":{"value":"viewof server = render(({ useSetter }) => {\n  const { Input, Checkbox, Button,message } = Antd;\n  const [messageApi, contextHolder] = message.useMessage(); \n  const [server, setServer] = useState(\"http://localhost:8000\");\n\n  useSetter(server);\n  \n  \n  return (\n    <div style={{ maxWidth: \"100%\", margin: \"0 auto\"}}>\n      {contextHolder} \n      <div style={{ marginBottom: \"10px\" }}>\n        <Input\n          value={server}\n          onChange={(e) => setServer(e.target.value)}\n          placeholder=\"Enter project\"\n        />\n      </div>\n\n    </div>\n  );\n});\n","pinCode":false,"dname":"336760db-c37b-4128-b8ef-c949ef860163","codeMode":"jsx"}}},{"type":"paragraph","data":{"text":"Category"}},{"type":"codeTool","data":{"codeData":{"value":"viewof category = render(({ useSetter }) => {\n    const { Button } = Antd;\n    \n  \tconst onPull = async (item)=>{\n        const command = `match (n:${item}) return n limit 100`\n    \tquery(command)\n    }\n  \n    if(!schema.categories){\n    \treturn <div>No data</div>\n    }\n    return <ButtonList key='dc1e4f53-392f-49ce-a928-55e5f74a0cc3'\n     items={schema.categories}\n    onClick={onPull}  ></ButtonList>;\n})","pinCode":false,"dname":"85b51bc4-262f-42e2-bc06-669f99df26f1","codeMode":"jsx"}}},{"type":"paragraph","data":{"text":"Relationship"}},{"type":"codeTool","data":{"codeData":{"value":"viewof relationships = render(({ useSetter }) => {\n    const { Button } = Antd;\n    \n  \tconst onPull = async (item)=>{\n        const command = `match (n)-[r:${item}]-(m) return * limit 100`\n    \tquery(command)\n    }\n  \n    if(!schema.relationships){\n    \treturn <div>No data</div>\n    } \n    return <ButtonList key='dc1e4f53-392f-49ce-a928-55e5f74a0c43'\n     items={schema.relationships}\n    onClick={onPull}  ></ButtonList>;\n})","pinCode":false,"dname":"c63e0d27-788d-4fa2-a618-0de282ea4021","codeMode":"jsx"}}},{"type":"codeTool","data":{"codeData":{"value":"viewof cypher = render(({useSetter}) => { \n  const {Input,Button, Space, Select, Dropdown, Menu } = Antd\n  const { TextArea } = Input;\n  const {CaretDownOutlined} = AntdIcons\n  const [value, setValue] = useState(`match (n)-[r]-(m) return * limit 1000`);\n  const [cypherSnippets, setCypherSnippets] = useState(samples.samples);\n  const [loadingSnippets, setLoadingSnippets] = useState(true);\n  const [snippetError, setSnippetError] = useState(null);\n\n  const onExecute = async () => {\n      try{\n          query(value)\n      }catch(e){\n          console.error(\"query error\",e)\n      }\n  };\n\n  const onChange = (event) => {\n    setValue(event.target.value);\n  };\n\n    const handleCypherSnippetSelect = (snippet) => {\n         setValue(snippet.command)\n    };\n\n  const cypherSnippetMenu = (\n    <Menu>\n      {\n        cypherSnippets.map((snippet) => (\n          <Menu.Item key={snippet.name} onClick={() => handleCypherSnippetSelect(snippet)}>\n            {snippet.name}\n          </Menu.Item>\n        ))\n      }\n    </Menu>\n  );\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', width: '100%', gap: '10px' }}>\n      <div style={{ display: 'flex', gap: '4px' }}>\n        <TextArea \n          id=\"cypher-textarea\" \n          value={value} \n          onChange={onChange} \n          size=\"large\"\n          style={{ flex: 1 }}\n        />\n        <Dropdown \n          overlay={cypherSnippetMenu} \n          trigger={['click']}\n          placement=\"bottomLeft\"\n        >\n          <Button\n            icon={<CaretDownOutlined />}\n            style={{\n              height: 'auto',\n            }}\n          />\n        </Dropdown>\n      </div>\n      <Button onClick={onExecute}>Execute</Button>\n    </div>\n  );\n});","pinCode":false,"dname":"38b35656-bae9-4b0c-8d69-cb83a8b4bf13","codeMode":"jsx"}}},{"type":"codeTool","data":{"codeData":{"value":"ButtonList = component(({ items,onClick }) => {\n  const { Button,Space } = Antd;\n  return (<Space wrap>\n      {items.map((item, index) => (\n        <Button key={index} onClick={()=>onClick(item)}>\n          {item}\n        </Button>\n      ))}\n    </Space>\n  );\n});","pinCode":false,"dname":"c998112e-0025-4566-aaef-ba797506459c","codeMode":"jsx","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"addContextMenu()","pinCode":false,"dname":"6a83e2a1-3578-4ccc-8a47-b5dcbf8243f9","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"addContextMenu = () => {\n  gxr.addContextMenuItem({\n    name: \"Expand\",\n    text: \"Expand\",\n    icon: \"fa fa-arrows-alt\",\n    hide: () => false,\n    enable: () => true,\n    action: async (name, nodeId, edgeId, props) => {\n      let selectedNodes = gxr.nodes(\"[[selected]]\").array || [];\n      if (selectedNodes.length === 0) {\n        console.warn(\"No nodes selected for expansion.\");\n        return;\n      }\n      let nodesByCategory = selectedNodes.reduce((acc, node) => {\n        let category = node.category || \"Default\";\n        acc[category] = acc[category] || [];\n        acc[category].push(node.id);\n        return acc;\n      }, {});\n      let combinedNodes = [];\n      let combinedEdges = [];\n      for (let [category, nodeIds] of Object.entries(nodesByCategory)) {\n        const nodeIds = selectedNodes.map((node) => `'${node.id}'`).join(\",\");\n        const queryString = `\n        MATCH (n)-[r]-(m)\n        WHERE id(n) IN [${nodeIds}]\n        RETURN n, r, m\n        LIMIT 2000\n      `;\n        try {\n          let graph = await query(queryString);\n        } catch (error) {\n          console.error(`Error expanding category \"${category}\":`, error);\n        }\n      }\n    },\n  });\n}","pinCode":false,"dname":"4423feda-899d-4b5e-87c7-ad0239fb66ed","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"getSchema = async () => {\n  const api = server + \"/api/v1/puppygraph/schema\";\n  let data = await get(api);\n  return data;\n}","pinCode":false,"dname":"29280578-cf6f-4bd7-8816-73ad6828ab19","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"getSamples = async () => {\n  const api = server + \"/api/v1/puppygraph/samples\";\n  let data = await get(api, {});\n  return data;\n}","pinCode":true,"dname":"27452605-f6da-4bea-a315-8742ab37ba9f","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"post = (url, params) => {\n  return fetch(url, {\n    method: \"POST\",\n    headers: {\n      Accept: \"application/json\",\n      \"Content-Type\": \"application/json\",\n      \"ngrok-skip-browser-warning\": true,\n    },\n    body: JSON.stringify(params),\n  }).then((response) => response.json());\n}","pinCode":true,"dname":"b24a5ed0-ecbd-4839-9d82-ca3d4ebd0620","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"get = (url, params = {}) => {\n  // Convert params object to query string\n  const queryString = new URLSearchParams(params).toString();\n  const fullUrl = queryString ? `${url}?${queryString}` : url;\n  return fetch(fullUrl, {\n    method: \"GET\",\n    headers: { Accept: \"application/json\", \"Content-Type\": \"application/json\" },\n  })\n    .then((response) => {\n      if (!response.ok) {\n        throw new Error(`HTTP error! Status: ${response.status}`);\n      }\n      return response.json();\n    })\n    .catch((error) => {\n      console.error(\"Error during GET request:\", error);\n      throw error;\n    });\n}","pinCode":true,"dname":"69458170-fa2d-4284-84d1-a1bd08a3291f","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"query = async (command) => {\n  let graph = await post(server + \"/api/v1/puppygraph/execute\", {\n    command: command,\n  });\n  gxr.add(graph.nodes);\n  gxr.add(graph.edges);\n  gxr.nodes().forEach(node => {                    node.color.setStyle(_GXR.TypeColor.getColorByType(node.category));\n                    });\n  gxr.forceLayout();\n}","pinCode":true,"dname":"d51cd460-46ef-458f-94d0-fbc1738ec230","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"schema = getSchema()","pinCode":true,"dname":"8ddff7fa-0a7a-4fd3-9c13-3d481b0137fa","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"samples = getSamples()","pinCode":true,"dname":"e5919c98-5b43-4d33-ab89-4fbaa0d45a58","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"Cm = import('https://cdn.skypack.dev/react-codemirror2@8.0.0?min')","pinCode":true,"dname":"776533e9-1d73-4db3-9f3b-073be1749b47","codeMode":"javascript2","hide":true}}},{"type":"codeTool","data":{"codeData":{"value":"import {jsx, render, useState, component, useEffect, Fragment } from \"https://grove-help.graphxr.com/react/react\"","pinCode":false,"dname":"f93b5a5c-cd3b-45ba-a9e0-4e0f421b04a8","codeMode":"javascript2","hide":true}}}],"version":"2.19.1"}