{"id":16853518,"url":"https://github.com/sim51/stefi-graph","last_synced_at":"2025-07-25T06:07:52.457Z","repository":{"id":142401824,"uuid":"63730072","full_name":"sim51/stefi-graph","owner":"sim51","description":null,"archived":false,"fork":false,"pushed_at":"2017-03-20T15:11:55.000Z","size":1495,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-18T10:25:42.081Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sim51.png","metadata":{"files":{"readme":"README.adoc","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-07-19T21:45:16.000Z","updated_at":"2017-01-23T17:43:53.000Z","dependencies_parsed_at":null,"dependency_job_id":"b9ba00c6-3fb2-46a3-9678-f903ff668fa5","html_url":"https://github.com/sim51/stefi-graph","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/sim51/stefi-graph","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sim51%2Fstefi-graph","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sim51%2Fstefi-graph/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sim51%2Fstefi-graph/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sim51%2Fstefi-graph/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sim51","download_url":"https://codeload.github.com/sim51/stefi-graph/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sim51%2Fstefi-graph/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266963325,"owners_count":24013029,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-25T02:00:09.625Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-13T13:51:59.687Z","updated_at":"2025-07-25T06:07:52.434Z","avatar_url":"https://github.com/sim51.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"= Stefi Graph\n\nSearch, Transform, Explore, Fetch and Interact your graph database\n\n== TODO\n\n* Adding row result ...\n* parameter query (don't forget widget on this !)\n* refacto on neo4j service\n* refacto on edit object\n* refacto on action : make unitaries action\n* adding label/type autocompletion on cypher\n* settings : modify schema\n\n== React reminder\n\n=== Property VS state\n\nA react component can change its state, but not its properties.\n\n * *properties* : for a top to bottom communication\n * *state* : for an internal state of the component\n\n=== Component Skeleton\n\n[code,javascript]\n----\nimport React, {Component, PropTypes} from \"react\";\n\n/**\n * Skeleton component\n */\nclass Skeleton extends Component {\n\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n    // Initialization\n    // -----------------------\n    //    * Constructor that initialize the state with props\n    //    * ComponentWillMount\n    //    * Render\n    //    * ComponentDidMount\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\n    /**\n     * Component constructor.\n     * It's where we set the component state with properties to initialize the state.\n     *\n     * @param props Properties passed to the component\n     */\n    constructor(props) {\n        super(props);\n        this.state = {\n            count = props.count,\n            name = props.name\n        };\n    }\n\n    /**\n     * This method is called before the render method is executed.\n     * It is important to note that setting the state in this phase will not trigger a re-rendering.\n     */\n    componentWillMount() {\n\n    }\n\n    /**\n     * This method returns the needed component markup.\n     */\n    render() {\n\n        return (\n            \u003cdiv\u003e\n                \u003cHeader /\u003e\n                \u003cView /\u003e\n                \u003cFooter /\u003e\n            \u003c/div\u003e\n        )\n    }\n\n    /**\n     * As soon as the render method has been executed this method is called.\n     * So here the DOM can be accessed and you can do some DOM manipulations or data fetching operations.\n     * Any DOM interactions should always happen in this phase not inside the render method.\n     */\n    componentDidMount() {\n\n    }\n\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n    // State change lifecycle\n    // -----------------------\n    //    * Updating state\n    //    * ShouldComponentUpdate\n    //    * ComponentWillUpdate\n    //    * Render\n    //    * ComponentDidUpdate\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n    /**\n     * When state change, this method is called before the render method to define if a re-rendering is needed.\n     *\n     * @return Boolean\n     */\n    shouldComponentUpdate(nextProps, nextState) {\n        return true;\n    }\n\n    /**\n     * This method is called as soon as the the shouldComponentUpdate returned true.\n     * Any state changes via this.setState are not allowed as this method should be strictly used to prepare for an upcoming update not trigger an update itself.\n     */\n    componentWillUpdate(nextProps, nextState) {\n\n    }\n\n    /**\n     * This method is called after the render method. Similar to the componentDidMount.\n     * It can be used to perform DOM operations after the data has been updated.\n     *\n     * @param prevProps\n     * @param prevState\n     */\n    componentDidUpdate(prevProps, prevState) {\n\n    }\n\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n    // Properties change lifecycle\n    // ----------------------------\n    //    * Updating Props\n    //    * ComponentWillReceiveProps\n    //    * ShouldComponentUpdate\n    //    * ComponentWillUpdate\n    //    * Render\n    //    * ComponentDidUpdate\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n    /**\n     * This method is called when the props have changed and when this is not an initial rendering.\n     * It allow you  to update the state depending on the existing and upcoming props, without triggering another rendering.\n     * @param nextProps\n     */\n    componentWillReceiveProps(nextProps) {\n        this.setState({\n            // set something\n        });\n    }\n\n\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n    // Unmouting\n    // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n    /**\n     * This method is called before the component is removed from the DOM.\n     * It can be used when  you need to perform clean up operations (ex: removing any timers defined in componentDidMount).\n     */\n    componentWillUnmount() {\n    }\n\n    /**\n     * This method is called when component is removed.\n     */\n    componentDidMount() {\n    }\n}\n\n// Declare all properties with validation\n// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\nSkeleton.propTypes = {\n    count: React.PropTypes.number.isRequired,\n    name: React.PropTypes.string.isRequired\n};\n\n// Declare default properties\nCounter.defaultProps = {\n    count: 0,\n    name : \"Skeleton\"\n};\n\n\nexport default App\n----\n\n=== Property validator\n\nThis the list of validator available for properties :\n\n[code, javascript]\n----\noptionalArray: React.PropTypes.array,\noptionalBool: React.PropTypes.bool,\noptionalFunc: React.PropTypes.func,\noptionalNumber: React.PropTypes.number,\noptionalObject: React.PropTypes.object,\noptionalString: React.PropTypes.string,\n\n// Anything that can be rendered: numbers, strings, elements or an array\n// (or fragment) containing these types.\noptionalNode: React.PropTypes.node,\n\n// A React element.\noptionalElement: React.PropTypes.element,\n\n// You can also declare that a prop is an instance of a class. This uses\n// JS's instanceof operator.\noptionalMessage: React.PropTypes.instanceOf(Message),\n\n// You can ensure that your prop is limited to specific values by treating\n// it as an enum.\noptionalEnum: React.PropTypes.oneOf(['News', 'Photos']),\n\n// An object that could be one of many types\noptionalUnion: React.PropTypes.oneOfType([\n  React.PropTypes.string,\n  React.PropTypes.number,\n  React.PropTypes.instanceOf(Message)\n]),\n\n// An array of a certain type\noptionalArrayOf: React.PropTypes.arrayOf(React.PropTypes.number),\n\n// An object with property values of a certain type\noptionalObjectOf: React.PropTypes.objectOf(React.PropTypes.number),\n\n// An object taking on a particular shape\noptionalObjectWithShape: React.PropTypes.shape({\n  color: React.PropTypes.string,\n  fontSize: React.PropTypes.number\n}),\n\n// You can chain any of the above with `isRequired` to make sure a warning\n// is shown if the prop isn't provided.\nrequiredFunc: React.PropTypes.func.isRequired,\n\n// A value of any data type\nrequiredAny: React.PropTypes.any.isRequired,\n----\n\n=== Some links\n\n* *React lifecycle :* https://busypeoples.github.io/post/react-component-lifecycle/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsim51%2Fstefi-graph","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsim51%2Fstefi-graph","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsim51%2Fstefi-graph/lists"}