Generate docs URLs based on server version

src/browser/components/ManualLink.jsx

@@ -0,0 +1,43 @@
+/*
+ * Copyright (c) 2002-2019 "Neo4j,"
+ * Neo4j Sweden AB [http://neo4j.com]
+ *
+ * This file is part of Neo4j.
+ *
+ * Neo4j is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React from 'react'
+import { connect } from 'react-redux'
+
+import { getVersion } from 'shared/modules/dbMeta/dbMetaDuck'
+import { formatDocVersion } from 'browser/modules/Sidebar/Documents'
+
+export function ManualLink({ chapter, page, children, neo4jVersion }) {
+  const cleanPage = page.replace(/^\//, '')
+  const version = formatDocVersion(neo4jVersion)
+  const url = `https://neo4j.com/docs/${chapter}/${version}/${cleanPage}`
+
+  return (
+    <a href={url} target="_blank">
+      {children}
+    </a>
+  )
+}
+
+const mapStateToProps = state => ({
+  neo4jVersion: getVersion(state)
+})
+
+export default connect(mapStateToProps, null)(ManualLink)

src/browser/components/ManualLink.test.js

@@ -0,0 +1,52 @@
+/*
+ * Copyright (c) 2002-2019 "Neo4j,"
+ * Neo4j Sweden AB [http://neo4j.com]
+ *
+ * This file is part of Neo4j.
+ *
+ * Neo4j is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React from 'react'
+import { render } from '@testing-library/react'
+
+import { ManualLink } from './ManualLink'
+
+const tests = [
+  [
+    { neo4jVersion: null, chapter: 'graph-algorithms', page: '/' },
+    'https://neo4j.com/docs/graph-algorithms/current/'
+  ],
+  [
+    {
+      neo4jVersion: '3.5.12',
+      chapter: 'cypher-manual',
+      page: '/schema/constraints/'
+    },
+    'https://neo4j.com/docs/cypher-manual/3.5/schema/constraints/'
+  ],
+  [
+    { neo4jVersion: '4.0.0-beta03mr03', chapter: 'driver-manual', page: '' },
+    'https://neo4j.com/docs/driver-manual/4.0-preview/'
+  ]
+]
+
+test.each(tests)('Render correct url for props %o', (props, expected) => {
+  const { getByText } = render(
+    <ManualLink {...props}>link to manual</ManualLink>
+  )
+
+  const url = getByText('link to manual').getAttribute('href')
+  expect(url).toEqual(expected)
+})

src/browser/documentation/dynamic/cypher.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'Cypher'
 const subtitle = 'A graph query language'
 const category = 'browserUiCommands'
@@ -39,12 +40,9 @@ const description = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/cypher/"
-          >
+          <ManualLink chapter="developer-manual" page="/cypher/">
             Cypher introduction
-          </a>
+          </ManualLink>
         </p>
       </div>
       <div className="link">
@@ -62,7 +60,6 @@ const description = (
           <a help-topic="with">:help WITH</a>
           <a help-topic="load-csv">:help LOAD CSV</a>
           <a help-topic="unwind">:help UNWIND</a>
-          <a help-topic="start">:help START</a>
           <a help-topic="create-index-on">:help CREATE INDEX ON</a>
           <a help-topic="starts-with">:help STARTS WITH</a>
           <a help-topic="ends-with">:help ENDS WITH</a>
@@ -91,4 +88,11 @@ RETURN <expressions>`}
   </>
 )
 
-export default { title, subtitle, category, content: null, description, filter }
+export default {
+  title,
+  subtitle,
+  category,
+  content: null,
+  description,
+  filter
+}

src/browser/documentation/guides/concepts.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
 
@@ -188,12 +189,9 @@ const slides = [
           <a play-topic="cypher">Cypher</a> - query language
         </li>
         <li>
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/"
-          >
+          <ManualLink chapter="developer-manual" page="/">
             Neo4j Developer Manual
-          </a>
+          </ManualLink>
         </li>
       </ul>
     </div>

src/browser/documentation/guides/cypher.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
 
@@ -274,17 +275,14 @@ RETURN DISTINCT surfer`}
           </a>
         </li>
         <li>
-          <a target="_blank" href="https://neo4j.com/docs/cypher-refcard/3.2/">
+          <ManualLink chapter="cypher-refcard" page="/">
             Cypher Refcard
-          </a>
+          </ManualLink>
         </li>
         <li>
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/cypher/"
-          >
+          <ManualLink manual="developer-manual" page="/cypher/">
             The Cypher chapter
-          </a>{' '}
+          </ManualLink>{' '}
           of the Neo4j Developer Manual
         </li>
       </ul>

src/browser/documentation/guides/learn.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
 
@@ -189,12 +190,9 @@ const slides = [
           <a play-topic="cypher">Cypher</a> - query language
         </li>
         <li>
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/"
-          >
+          <ManualLink chapter="developer-manual" page="/">
             Neo4j Developer Manual
-          </a>
+          </ManualLink>
         </li>
       </ul>
     </div>

src/browser/documentation/guides/movie-graph.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
 
@@ -829,12 +830,9 @@ RETURN tom, m, coActors, m2, cruise`}
           </a>
         </li>
         <li>
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/"
-          >
+          <ManualLink chapter="developer-manual" page="/">
             Neo4j Developer Manual
-          </a>
+          </ManualLink>
         </li>
       </ul>
     </div>

src/browser/documentation/guides/northwind-graph.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
 
@@ -348,12 +349,9 @@ RETURN DISTINCT cust.contactName as CustomerName, SUM(o.quantity) AS TotalProduc
           </a>
         </li>
         <li>
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/"
-          >
+          <ManualLink chapter="developer-manual" page="/">
             Neo4j Developer Manual
-          </a>
+          </ManualLink>
         </li>
       </ul>
     </div>

src/browser/documentation/help/contains.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'CONTAINS'
 const subtitle = 'Matching within in a string'
 const category = 'cypherPredicates'
@@ -32,12 +33,12 @@ const content = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/cypher/clauses/where/#query-where-string"
+          <ManualLink
+            chapter="developer-manual"
+            page="/cypher/clauses/where/#query-where-string"
           >
             WHERE
-          </a>{' '}
+          </ManualLink>{' '}
           manual page
         </p>
       </div>

src/browser/documentation/help/create-index-on.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'CREATE INDEX ON'
 const subtitle = 'Index labeled nodes by property'
 const category = 'schemaClauses'
@@ -32,12 +33,10 @@ const content = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/preview/cypher/schema/index/"
-          >
-            <code>schema indexes</code> manual page
-          </a>
+          <ManualLink chapter="developer-manual" page="/cypher/schema/index/">
+            schema indexes
+          </ManualLink>{' '}
+          manual page
         </p>
       </div>
       <div className="link">

src/browser/documentation/help/create.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'CREATE'
 const subtitle = 'Insert graph data'
 const category = 'cypherHelp'
@@ -39,12 +40,9 @@ const content = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <a
-            target="_blank"
-            href="https://neo4j.com/docs/developer-manual/3.2/cypher/clauses/create/"
-          >
+          <ManualLink chapter="developer-manual" page="/cypher/clauses/create/">
             CREATE
-          </a>{' '}
+          </ManualLink>{' '}
           manual page
         </p>
       </div>

src/browser/documentation/help/delete.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'DELETE'
 const subtitle = 'Delete nodes and relationships'
 const category = 'cypherHelp'
@@ -34,15 +35,10 @@ const content = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <code>
-            <a
-              target="_blank"
-              href="https://neo4j.com/docs/developer-manual/3.2/cypher/clauses/delete/"
-            >
-              DELETE
-            </a>{' '}
-            manual page
-          </code>
+          <ManualLink chapter="developer-manual" page="/cypher/clauses/delete/">
+            DELETE
+          </ManualLink>{' '}
+          manual page
         </p>
       </div>
       <div className="link">

src/browser/documentation/help/detach-delete.jsx

@@ -19,6 +19,7 @@
  */
 
 import React from 'react'
+import ManualLink from 'browser-components/ManualLink'
 const title = 'DETACH DELETE'
 const subtitle = 'Delete all nodes and relationships'
 const category = 'cypherHelp'
@@ -32,15 +33,10 @@ const content = (
       <div className="link">
         <p className="title">Reference</p>
         <p className="content">
-          <code>
-            <a
-              target="_blank"
-              href="https://neo4j.com/docs/developer-manual/3.2/cypher/clauses/delete/"
-            >
-              DELETE
-            </a>{' '}
-            manual page
-          </code>
+          <ManualLink chapter="developer-manual" page="/cypher/clauses/delete/">
+            DELETE
+          </ManualLink>{' '}
+          manual page
         </p>
       </div>
       <div className="link">