Make work with multiple apis (or a table in no apis)

This commit is contained in:
2023-04-04 15:48:59 -05:00
parent 74529b44ca
commit 5d34f60a46
2 changed files with 108 additions and 45 deletions

View File

@ -54,10 +54,12 @@ function TableDeveloperView({table}: Props): JSX.Element
const tableName = table.name;
const [asyncLoadInited, setAsyncLoadInited] = useState(false);
const [noApis, setNoApis] = useState(null as boolean);
const [tableMetaData, setTableMetaData] = useState(null);
const [metaData, setMetaData] = useState(null as QInstance);
const [supportedApis, setSupportedApis] = useState([] as any)
const [supportedVersions, setSupportedVersions] = useState([] as string[]);
const [currentVersion, setCurrentVersion] = useState(null as string);
const [selectedApi, setSelectedApi] = useState(null as any);
const [selectedVersion, setSelectedVersion] = useState(null as string);
const {setPageHeader} = useContext(QContext);
@ -74,17 +76,6 @@ function TableDeveloperView({table}: Props): JSX.Element
(async () =>
{
const versionsResponse = await fetch("/api/versions.json");
const versionsJson = await versionsResponse.json();
console.log(versionsJson);
setSupportedVersions(versionsJson.supportedVersions);
if (versionsJson.currentVersion)
{
setCurrentVersion(versionsJson.currentVersion);
setSelectedVersion(versionsJson.currentVersion);
}
/////////////////////////////////////////////////////////////////////
// load the full table meta-data (the one we took in is a partial) //
/////////////////////////////////////////////////////////////////////
@ -99,7 +90,30 @@ function TableDeveloperView({table}: Props): JSX.Element
setPageHeader(tableMetaData.label + " Developer Mode");
// forceUpdate();
const apisResponse = await fetch("/apis.json?tableName=" + tableName);
const apisJson = await apisResponse.json();
console.log(apisJson);
if(!apisJson["apis"] || apisJson["apis"].length == 0)
{
setNoApis(true);
return;
}
setSupportedApis(apisJson["apis"]);
const selectedApi = apisJson["apis"][0];
setSelectedApi(selectedApi);
const versionsResponse = await fetch(selectedApi["path"] + "versions.json");
const versionsJson = await versionsResponse.json();
console.log(versionsJson);
setSupportedVersions(versionsJson.supportedVersions);
if (versionsJson.currentVersion)
{
setSelectedVersion(versionsJson.currentVersion);
}
})();
}
@ -108,6 +122,33 @@ function TableDeveloperView({table}: Props): JSX.Element
e.detail.request.headers.append("Authorization", "Bearer " + accessToken);
};
const selectApi = async (event: SelectChangeEvent) =>
{
setSelectedApi(null);
setSelectedVersion(null);
const name = event.target.value;
for(let i = 0; i < supportedApis.length; i++)
{
if(name == supportedApis[i].name)
{
const selectedApi = supportedApis[i];
setSelectedApi(selectedApi);
const versionsResponse = await fetch(selectedApi["path"] + "versions.json");
const versionsJson = await versionsResponse.json();
console.log(versionsJson);
setSupportedVersions(versionsJson.supportedVersions);
if (versionsJson.currentVersion)
{
setSelectedVersion(versionsJson.currentVersion);
}
break;
}
}
};
const selectVersion = (event: SelectChangeEvent) =>
{
setSelectedVersion(event.target.value);
@ -120,10 +161,27 @@ function TableDeveloperView({table}: Props): JSX.Element
<Grid item xs={12}>
<Box mb={3}>
{
accessToken && metaData && selectedVersion &&
<Card sx={{pb: 1}}>
<Box display="flex" alignItems="center">
<Typography variant="h6" p={2} pl={3} pb={1}>API Docs & Playground</Typography>
{
supportedApis?.length > 0 &&
<Box display="inline-block" pl={2}>
<Typography fontSize="0.875rem" display="inline-block" pr={0.5} position="relative" top="2px">API:</Typography>
<Select
native
value={selectedApi?.name}
onChange={selectApi}
size="small"
inputProps={{id: "select-native"}}>
{supportedApis.map((api: any) => (<option key={api.name} value={api.name}>{api.label}</option>))}
</Select>
</Box>
}
{
supportedVersions?.length > 0 &&
<Box display="inline-block" pl={2}>
<Typography fontSize="0.875rem" display="inline-block" pr={0.5} position="relative" top="2px">Version:</Typography>
<Select
@ -131,16 +189,19 @@ function TableDeveloperView({table}: Props): JSX.Element
value={selectedVersion}
onChange={selectVersion}
size="small"
inputProps={{
id: "select-native",
}}
>
inputProps={{id: "select-native",}}>
{supportedVersions.map((v) => (<option key={v} value={v}>{v}</option>))}
</Select>
</Box>
}
</Box>
{noApis == true && <Box p={3}>This table is not available in any APIs.</Box>}
{
accessToken && metaData && selectedApi && selectedVersion &&
<RapiDocReact
spec-url={`/api/${selectedVersion}/${tableName}/openapi.json`}
spec-url={`${selectedApi?.path}${selectedVersion}/${tableName}/openapi.json`}
regular-font="Roboto,Helvetica,Arial,sans-serif"
mono-font="Monaco, Menlo, Consolas, source-code-pro, monospace"
primary-color={metaData.branding.accentColor || "blue"}
@ -155,6 +216,7 @@ function TableDeveloperView({table}: Props): JSX.Element
css-file={"/api/rapi-doc.css"}
css-classes={"qqq-rapi-doc"}
></RapiDocReact>
}
</Card>
}
</Box>

View File

@ -52,5 +52,6 @@ module.exports = function (app)
app.use("/processes", getRequestHandler());
app.use("/reports", getRequestHandler());
app.use("/images", getRequestHandler());
app.use("/api", getRequestHandler());
app.use("/api*", getRequestHandler());
app.use("/*api", getRequestHandler());
};