2023-08-24 00:27:57 +08:00
|
|
|
import { RightOutlined } from '@ant-design/icons';
|
2023-11-13 11:01:18 +08:00
|
|
|
import { Plugin } from '@nocobase/client';
|
2023-08-24 00:27:57 +08:00
|
|
|
import { Button, Tooltip } from 'antd';
|
|
|
|
import { createStyles } from 'antd-style';
|
2023-09-03 10:59:33 +08:00
|
|
|
import React, { lazy } from 'react';
|
2023-11-13 11:01:18 +08:00
|
|
|
import { NAMESPACE } from '../locale';
|
2023-08-24 00:27:57 +08:00
|
|
|
|
|
|
|
const DOCUMENTATION_PATH = '/api-documentation';
|
2023-09-03 10:59:33 +08:00
|
|
|
const Documentation = lazy(() => import('./Document'));
|
2023-08-24 00:27:57 +08:00
|
|
|
|
|
|
|
export const useStyles = createStyles(({ css, token }) => {
|
|
|
|
return css`
|
|
|
|
position: relative;
|
|
|
|
background: ${token.colorBgContainer};
|
|
|
|
padding: ${token.paddingMD}px;
|
|
|
|
.open-tab {
|
|
|
|
position: absolute;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
}
|
|
|
|
`;
|
|
|
|
});
|
|
|
|
|
|
|
|
const SCDocumentation = () => {
|
|
|
|
const { styles } = useStyles();
|
|
|
|
return (
|
|
|
|
<div className={styles}>
|
|
|
|
<div className="open-tab">
|
|
|
|
<Tooltip title="open in new tab">
|
|
|
|
<a href={DOCUMENTATION_PATH} target="_blank" rel="noreferrer">
|
|
|
|
<Button size="small" icon={<RightOutlined />} />
|
|
|
|
</a>
|
|
|
|
</Tooltip>
|
|
|
|
</div>
|
|
|
|
<Documentation />
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export class APIDocumentationPlugin extends Plugin {
|
|
|
|
async load() {
|
2023-11-13 11:01:18 +08:00
|
|
|
this.app.pluginSettingsManager.add(NAMESPACE, {
|
|
|
|
title: `{{t("API documentation", { ns: "${NAMESPACE}" })}}`,
|
|
|
|
icon: 'BookOutlined',
|
|
|
|
Component: SCDocumentation,
|
|
|
|
aclSnippet: 'pm.api-doc.documentation',
|
|
|
|
});
|
|
|
|
|
2023-08-24 00:27:57 +08:00
|
|
|
this.app.router.add('api-documentation', {
|
|
|
|
path: DOCUMENTATION_PATH,
|
|
|
|
Component: Documentation,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export default APIDocumentationPlugin;
|