diff --git a/src/components/DownloadLabel.js b/src/components/DownloadLabel.js index de00a8be4ecae0aa260b689998b43d60d4c69181..53cc96f1344729e64428cb945f908ce144d8d787 100644 --- a/src/components/DownloadLabel.js +++ b/src/components/DownloadLabel.js @@ -2,6 +2,6 @@ import React from "react"; export default ({ baseURL, version, artifact, label }) => { return <a href={`${baseURL}/${version}/${artifact}`} download> - (im Format {label} herunterladen) + im Format {label} herunterladen </a> } diff --git a/src/components/VersionSelect.js b/src/components/VersionSelect.js index 00c0244e26f3eb251ffc7b27ac59a81a3a9a96f6..ea45a44a4e394bf48547546cc5c3ab5b85f9a82b 100644 --- a/src/components/VersionSelect.js +++ b/src/components/VersionSelect.js @@ -1,6 +1,7 @@ import React, {useEffect} from "react" import useAsync from '@hooks/useAsync' import getVersionList from "@lib/utils/getVersionList"; +import { useHistory } from '@docusaurus/router'; export default ({ version, setVersion, gitlabId, includePrerelease = false }) => { @@ -16,15 +17,22 @@ export default ({ version, setVersion, gitlabId, includePrerelease = false }) => lineHeight: "20px", } + const history = useHistory() + const params = new URLSearchParams() + useEffect(() => { execute() }, []) return <div> - Andere Version anzeigen: <select + API Version anzeigen: <select style={selectStyle} value={version} - onChange={e => setVersion(e.target.value)}> + onChange={e => { + setVersion(e.target.value) + params.append("version", e.target.value) + history.push({search: params.toString()}) + }}> {versions && versions.map ? versions.map((v, i) => ( <option value={v} key={i}> {v} diff --git a/src/views/ApiSpec.js b/src/views/ApiSpec.js index 86322f662636855dd43f1f2d14095916da35c1fe..91ff67eb7eee71defef3607c6845db13628c6f8a 100644 --- a/src/views/ApiSpec.js +++ b/src/views/ApiSpec.js @@ -1,6 +1,9 @@ import React, {useEffect, useState} from 'react' +import semver from "semver"; + import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment' import BrowserOnly from '@docusaurus/BrowserOnly' +import { useLocation } from '@docusaurus/router'; import useAsync from '@hooks/useAsync' import getLatestVersion from "@lib/utils/getLatestVersion"; @@ -10,7 +13,13 @@ import VersionSelect from "@components/VersionSelect"; const SCHEMA_BASE_URL = 'https://schema.fitko.de/fit-connect' export default function ApiSpec(props) { - const {artifact, path, version, gitlabProjectId, includePrerelease, includePrereleaseVersion} = props + const {artifact, path, gitlabProjectId, includePrerelease, includePrereleaseVersion} = props + let { version } = props + const search = useLocation().search; + const queryVersion = new URLSearchParams(search).get('version'); + if (queryVersion && semver.valid(queryVersion)) { + version = queryVersion; + } const [selectedVersion, setSelectedVersion] = useState('') const isInBrowser = ExecutionEnvironment.canUseDOM @@ -28,7 +37,7 @@ export default function ApiSpec(props) { useEffect(async () => { if (status === 'success') { - setSelectedVersion(latestVersion) + setSelectedVersion(version && version !== '*' ? version : latestVersion) } }, [status]) } @@ -40,8 +49,7 @@ export default function ApiSpec(props) { return ( <div> - <p>Die aktuell angezeigte Version der API ist {status === 'success' && - <code>{latestVersion}</code>} {status === 'success' && + <p> Diese API-Spezifikation {status === 'success' && <DownloadLabel baseURL={`${SCHEMA_BASE_URL}/${path}`} version={selectedVersion} artifact={artifact} label="OpenAPI"/>}. </p> <VersionSelect version={selectedVersion} setVersion={setSelectedVersion} gitlabId={gitlabProjectId} includePrerelease={includePrerelease} /><br/>