mirror of
https://github.com/apache/superset.git
synced 2026-04-19 08:04:53 +00:00
docs(new docs site): removes old sphinx doc site with gatsby (#10784)
* Remove old apache sphinx doc site with refreshed gatsby * remove rando * add licenses * excluing .mdx files from license checks * fixes * Clean up sphinx references * Addressed comments * colors and tweaks * more fixes * add dummy docs/requirements.txt to satisfy stupid fossa * cp .prettierrc * more licenses * minor touchups * reqs * removing old videos * add github buttons * prettier * tweaks * Eugenia/Fix some of the images and modified some of database pages * add subheadernav * add side headers nav and more responsive design for docs * update resources page and other styling updates * linting * tweaks * removing windows and align:center * update resources * remove links and and card hearder * lots of styling tweaks * Tweaks and minor improvements * lint * fix CI * trigger pre-comimt * rererefix CI Co-authored-by: Maxime Beauchemin <maximebeauchemin@gmail.com> Co-authored-by: Eugenia Moreno <eugenia@Eugenias-MBP.fios-router.home> Co-authored-by: Evan Rusackas <evan@preset.io>
This commit is contained in:
Phillip Kelley-Dotson
committed by
GitHub
GitHub
parent
7cd96edcdf
commit
85a916036c
158
docs/src/components/footer.tsx
Normal file
158
docs/src/components/footer.tsx
Normal file
@@ -0,0 +1,158 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { Layout } from 'antd';
|
||||
import { css } from '@emotion/core';
|
||||
import { GithubOutlined, SlackSquareOutlined } from '@ant-design/icons';
|
||||
|
||||
const { Footer } = Layout;
|
||||
|
||||
const footerStyle = css`
|
||||
background-color: #323232;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
.apacheLinks {
|
||||
a {
|
||||
color: white;
|
||||
margin: 5px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const copyrightStyle = css`
|
||||
font-size: 11px;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
`;
|
||||
const apacheLinksStyle = css`
|
||||
text-align: center;
|
||||
`;
|
||||
const iconContainerStyle = css`
|
||||
padding: 30px;
|
||||
background-color: #323232;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.icons {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
svg {
|
||||
margin-top: 15px;
|
||||
color: #ccc;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin: 0 15px;
|
||||
}
|
||||
.svg {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: -15px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const LayoutFooter = () => (
|
||||
<>
|
||||
<Footer css={footerStyle}>
|
||||
<div css={apacheLinksStyle} className="apacheLinks">
|
||||
<a
|
||||
href="https://www.apache.org/security/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Security |
|
||||
</a>
|
||||
<a
|
||||
href="https://www.apache.org/foundation/sponsorship.html"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Donate |
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://www.apache.org/foundation/thanks.html"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Thanks
|
||||
</a>
|
||||
</div>
|
||||
<div css={iconContainerStyle}>
|
||||
<div className="icons">
|
||||
<a
|
||||
href="https://apache-superset.slack.com/join/shared_invite/zt-g8lpruog-HeqpgYrwdfrD5OYhlU7hPQ#/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<SlackSquareOutlined className="icon" />
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/apache/incubator-superset"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<GithubOutlined className="icon" />
|
||||
</a>
|
||||
<a
|
||||
href="https://stackoverflow.com/questions/tagged/apache-superset+superset"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<img
|
||||
alt="StackOverflow"
|
||||
src="/images/so-icon.svg"
|
||||
className="icon svg"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div css={copyrightStyle}>
|
||||
© Copyright
|
||||
{' '}
|
||||
{new Date().getFullYear()}
|
||||
,
|
||||
<a href="http://www.apache.org/" target="_blank" rel="noreferrer">
|
||||
The Apache Software Fountation
|
||||
</a>
|
||||
, Licensed under the Apache
|
||||
<a
|
||||
href="https://www.apache.org/licenses/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
License.
|
||||
</a>
|
||||
{' '}
|
||||
<br />
|
||||
<div>
|
||||
Disclaimer: Apache Superset is an effort undergoing incubation at The
|
||||
Apache Software Foundation (ASF), sponsored by the Apache Incubator.
|
||||
Incubation is required of all newly accepted projects until a further
|
||||
review indicates that the infrastructure, communications, and decision
|
||||
making process have stabilized in a manner consistent with other
|
||||
successful ASF projects. While incubation status is not necessarily a
|
||||
reflection of the completeness or stability of the code, it does
|
||||
indicate that the project has yet to be fully endorsed by the ASF.
|
||||
</div>
|
||||
</div>
|
||||
</Footer>
|
||||
</>
|
||||
);
|
||||
|
||||
export default LayoutFooter;
|
||||
111
docs/src/components/image.tsx
Normal file
111
docs/src/components/image.tsx
Normal file
@@ -0,0 +1,111 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { useStaticQuery, graphql } from 'gatsby';
|
||||
import Img from 'gatsby-image';
|
||||
|
||||
interface Props {
|
||||
imageName?: string;
|
||||
type?: string;
|
||||
width?: string;
|
||||
height?: string;
|
||||
otherProps?: any;
|
||||
}
|
||||
|
||||
const Image = ({
|
||||
imageName, type, width, height, ...otherProps
|
||||
}: Props) => {
|
||||
const data = useStaticQuery(graphql`
|
||||
query {
|
||||
logoSm: file(relativePath: { eq: "src/images/s.png" }) {
|
||||
childImageSharp {
|
||||
fixed(height: 30) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
logoLg: file(relativePath: { eq: "src/images/s.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 150) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
incubatorSm: file(relativePath: { eq: "src/images/incubator.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 300) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
stackoverflow: file(
|
||||
relativePath: { eq: "src/images/stack_overflow.png" }
|
||||
) {
|
||||
childImageSharp {
|
||||
fixed(width: 60) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
docker: file(relativePath: { eq: "src/images/docker.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 100) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
preset: file(relativePath: { eq: "src/images/preset.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 100) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
getAllImages: allImageSharp {
|
||||
edges {
|
||||
node {
|
||||
fixed(height: 70) {
|
||||
...GatsbyImageSharpFixed
|
||||
originalName
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`);
|
||||
|
||||
const filter = data.getAllImages.edges.filter(
|
||||
(n) => n.node.fixed.originalName === imageName,
|
||||
);
|
||||
const imgStyle = width && height ? { width, height } : {};
|
||||
|
||||
return type === 'db' ? (
|
||||
<Img fixed={filter[0]?.node?.fixed} style={imgStyle} imgStyle={imgStyle} />
|
||||
) : (
|
||||
<Img fixed={data[imageName]?.childImageSharp?.fixed} {...otherProps} />
|
||||
);
|
||||
};
|
||||
|
||||
export default Image;
|
||||
123
docs/src/components/layout.scss
Normal file
123
docs/src/components/layout.scss
Normal file
@@ -0,0 +1,123 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
$brandColor: #20A7C9;
|
||||
$bigPad: 60px;
|
||||
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
body {
|
||||
background-color: transparent !important;
|
||||
margin: 0;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.ant-layout {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.contentPage {
|
||||
padding-bottom: $bigPad;
|
||||
section {
|
||||
width: 100%;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: $bigPad 0 0 0;
|
||||
font-size: 17px;
|
||||
&:first-of-type{
|
||||
padding: 40px;
|
||||
background-image: linear-gradient(120deg, lighten($brandColor, 45), lighten($brandColor, 15));
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
h1 {
|
||||
font-size: 48px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
}
|
||||
.title{
|
||||
margin-top: $bigPad;
|
||||
}
|
||||
|
||||
.ant-card-body{
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
.ant-card-grid-hoverable {
|
||||
cursor: pointer;
|
||||
}
|
||||
h4 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: #1985a0;
|
||||
}
|
||||
th, td {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
||||
background-color: $brandColor;
|
||||
}
|
||||
|
||||
.ant-menu-item-selected a {
|
||||
color: white;
|
||||
}
|
||||
.ant-menu-submenu-selected {
|
||||
color: $brandColor;
|
||||
}
|
||||
|
||||
.ant-menu-horizontal {
|
||||
& > .ant-menu-item:hover, & > .ant-menu-item-active {
|
||||
color: $brandColor !important;
|
||||
border-bottom: 2px solid $brandColor;
|
||||
}
|
||||
& >.ant-menu-item-selected {
|
||||
color: $brandColor;
|
||||
border-bottom: 2px solid $brandColor;
|
||||
a {
|
||||
color: $brandColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
tr:nth-child(even) {background-color: #f2f2f2;}
|
||||
|
||||
.centered {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button {
|
||||
background: $brandColor;
|
||||
}
|
||||
235
docs/src/components/layout.tsx
Normal file
235
docs/src/components/layout.tsx
Normal file
@@ -0,0 +1,235 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React, { useState } from 'react';
|
||||
import { Link } from 'gatsby';
|
||||
import {
|
||||
Layout, Menu, Button, Drawer,
|
||||
} from 'antd';
|
||||
import { css } from '@emotion/core';
|
||||
import { MenuOutlined } from '@ant-design/icons';
|
||||
|
||||
import logoSvg from '../images/superset-logo-horiz.svg';
|
||||
import Footer from './footer';
|
||||
import SEO from './seo';
|
||||
import AppMenu from './menu';
|
||||
|
||||
import { getCurrentPath } from '../utils';
|
||||
import 'antd/dist/antd.css';
|
||||
import './layout.scss';
|
||||
|
||||
const { Header, Sider } = Layout;
|
||||
|
||||
const leftPaneWidth = 350;
|
||||
const breakpoints = [576, 768, 992, 1200];
|
||||
|
||||
const mq = breakpoints.map((bp) => `@media (max-width: ${bp}px)`);
|
||||
|
||||
const layoutStyles = css`
|
||||
font-family: Inter;
|
||||
.ant-layout {
|
||||
background-color: white !important;
|
||||
}
|
||||
Button {
|
||||
background: #20a7c9;
|
||||
border-color: #20a7c9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
`;
|
||||
|
||||
const headerStyle = css`
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.12);
|
||||
z-index: 1;
|
||||
.ant-menu {
|
||||
background: transparent;
|
||||
}
|
||||
.ant-menu-horizontal {
|
||||
border-bottom: none;
|
||||
}
|
||||
`;
|
||||
|
||||
const getStartedButtonStyle = css`
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 16px;
|
||||
`;
|
||||
|
||||
const centerLayoutStyle = css`
|
||||
padding: 25px;
|
||||
min-height: 60vw;
|
||||
overflow: auto;
|
||||
padding-right: 250px;
|
||||
.menu {
|
||||
display: none;
|
||||
${[mq[2]]} {
|
||||
display: block;
|
||||
}
|
||||
padding: 25px;
|
||||
}
|
||||
`;
|
||||
|
||||
const sidebarStyle = css`
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
border-right: 1px solid #bfbfbf;
|
||||
`;
|
||||
|
||||
const contentStyle = css`
|
||||
margin-top: 3px;
|
||||
background-color: white;
|
||||
h2 {
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
h3 {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
img {
|
||||
max-width: 800px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
blockquote {
|
||||
color: rgb(132, 146, 166);
|
||||
padding: 10px 30px;
|
||||
margin: 30px 0px;
|
||||
border-radius: 3px;
|
||||
border-left: 4px solid rgb(56, 211, 236);
|
||||
background: rgb(239, 242, 247);
|
||||
}
|
||||
pre {
|
||||
border: solid #00000033 1px;
|
||||
padding: 5px;
|
||||
background-color: #82ef8217;
|
||||
border-radius: 3px;
|
||||
max-width: 1000px;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
}
|
||||
ul {
|
||||
font-size: 16px;
|
||||
}
|
||||
`;
|
||||
|
||||
const contentLayoutDocsStyle = css`
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
left: ${leftPaneWidth}px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
overflow: visible;
|
||||
${[mq[2]]} {
|
||||
top: 64px;
|
||||
left: 0;
|
||||
}
|
||||
aside {
|
||||
${[mq[2]]} {
|
||||
display: none;
|
||||
}
|
||||
overflow: auto;
|
||||
}
|
||||
`;
|
||||
|
||||
const logoStyle = css`
|
||||
float: left;
|
||||
margin-left: -50px;
|
||||
margin-top: 5px;
|
||||
heigh: 30px;
|
||||
`;
|
||||
interface Props {
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
const AppLayout = ({ children }: Props) => {
|
||||
const [showDrawer, setDrawer] = useState(false);
|
||||
const isOnDocsPage = getCurrentPath().indexOf('docs') > -1;
|
||||
return (
|
||||
<Layout css={layoutStyles}>
|
||||
<SEO title="Welcome" />
|
||||
<Header css={headerStyle}>
|
||||
<Link to="/">
|
||||
<img height="50" css={logoStyle} src={logoSvg} alt="logo" />
|
||||
</Link>
|
||||
<Menu mode="horizontal" selectedKeys={getCurrentPath()}>
|
||||
<Menu.Item key="docsintro">
|
||||
<Link to="/docs/intro">Documentation</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item key="community">
|
||||
<Link to="/community">Community</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item key="resources">
|
||||
<Link to="/resources"> Resources</Link>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
<div css={getStartedButtonStyle}>
|
||||
<Link to="/docs/intro">
|
||||
<Button type="primary" size="medium">
|
||||
Get Started
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</Header>
|
||||
{isOnDocsPage ? (
|
||||
<>
|
||||
<Drawer
|
||||
placement="left"
|
||||
closable={false}
|
||||
onClose={() => setDrawer(false)}
|
||||
visible={showDrawer}
|
||||
getContainer={false}
|
||||
style={{ position: 'absolute' }}
|
||||
>
|
||||
<AppMenu />
|
||||
</Drawer>
|
||||
<Layout css={contentLayoutDocsStyle}>
|
||||
{isOnDocsPage && (
|
||||
<Sider width={leftPaneWidth} css={sidebarStyle}>
|
||||
<AppMenu />
|
||||
</Sider>
|
||||
)}
|
||||
<Layout css={contentStyle}>
|
||||
<div css={centerLayoutStyle}>
|
||||
<MenuOutlined
|
||||
onClick={() => setDrawer(true)}
|
||||
className="menu"
|
||||
/>
|
||||
{children}
|
||||
</div>
|
||||
<Footer />
|
||||
</Layout>
|
||||
</Layout>
|
||||
</>
|
||||
) : (
|
||||
<Layout>
|
||||
{children}
|
||||
<Footer />
|
||||
</Layout>
|
||||
)}
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
export default AppLayout;
|
||||
57
docs/src/components/menu.tsx
Normal file
57
docs/src/components/menu.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { useMenus, Link } from 'docz';
|
||||
import { Menu } from 'antd';
|
||||
import { getActiveMenuItem } from '../utils';
|
||||
|
||||
const { SubMenu } = Menu;
|
||||
|
||||
export default () => {
|
||||
const menus = useMenus();
|
||||
const { openKey, selectedKey } = getActiveMenuItem(menus);
|
||||
return (
|
||||
<Menu
|
||||
mode="inline"
|
||||
defaultOpenKeys={[openKey]}
|
||||
defaultSelectedKeys={[selectedKey]}
|
||||
>
|
||||
{menus.map((menuItem) => {
|
||||
if (menuItem.menu?.length > 0) {
|
||||
return (
|
||||
<SubMenu key={menuItem.id} title={menuItem.name}>
|
||||
{menuItem.menu
|
||||
.sort((a, b) => a.index - b.index)
|
||||
.map((submenuItem) => (
|
||||
<Menu.Item key={submenuItem.id}>
|
||||
<Link to={submenuItem.route}>{submenuItem.name}</Link>
|
||||
</Menu.Item>
|
||||
))}
|
||||
</SubMenu>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Menu.Item key={menuItem.id}>
|
||||
<Link to={menuItem.route}>{menuItem.name}</Link>
|
||||
</Menu.Item>
|
||||
);
|
||||
})}
|
||||
</Menu>
|
||||
);
|
||||
};
|
||||
42
docs/src/components/next.tsx
Normal file
42
docs/src/components/next.tsx
Normal file
@@ -0,0 +1,42 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { useMenus } from 'docz';
|
||||
import { getPreviousAndNextUrls } from '../utils';
|
||||
|
||||
const nextButtons = () => {
|
||||
const menus = useMenus();
|
||||
const [prevUrl, nextUrl] = getPreviousAndNextUrls(menus);
|
||||
return (
|
||||
<>
|
||||
{prevUrl && (
|
||||
<a href={prevUrl} className="ant-btn">
|
||||
Prev
|
||||
</a>
|
||||
)}
|
||||
{nextUrl && (
|
||||
<a href={nextUrl} className="ant-btn">
|
||||
Next
|
||||
</a>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default nextButtons;
|
||||
47
docs/src/components/select.tsx
Normal file
47
docs/src/components/select.tsx
Normal file
@@ -0,0 +1,47 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { Select } from 'antd';
|
||||
import querystring from 'querystring';
|
||||
|
||||
const { Option } = Select;
|
||||
|
||||
const versions = ['1', '2'];
|
||||
|
||||
export default function VersionSelect() {
|
||||
const { version } = querystring.parse(window.location.search.substr(1));
|
||||
const handleChange = (e) => {
|
||||
// @ts-ignore
|
||||
window.location = `/docs/intro?version=${e}`;
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
version:
|
||||
<Select
|
||||
defaultValue={version || 1}
|
||||
style={{ width: 120 }}
|
||||
onChange={handleChange}
|
||||
>
|
||||
{versions.map((e) => (
|
||||
<Option value={e}>{e}</Option>
|
||||
))}
|
||||
</Select>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
104
docs/src/components/seo.js
Normal file
104
docs/src/components/seo.js
Normal file
@@ -0,0 +1,104 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Helmet } from 'react-helmet';
|
||||
import { useStaticQuery, graphql } from 'gatsby';
|
||||
import favicon from '../images/favicon.png';
|
||||
|
||||
function SEO({
|
||||
description, lang, meta, title,
|
||||
}) {
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
description
|
||||
author
|
||||
}
|
||||
}
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
const metaDescription = description || site.siteMetadata.description;
|
||||
|
||||
return (
|
||||
<Helmet
|
||||
htmlAttributes={{
|
||||
lang,
|
||||
}}
|
||||
title={title}
|
||||
titleTemplate={`%s | ${site.siteMetadata.title}`}
|
||||
meta={[
|
||||
{
|
||||
name: 'description',
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: 'og:title',
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
property: 'og:description',
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: 'og:type',
|
||||
content: 'website',
|
||||
},
|
||||
{
|
||||
name: 'twitter:card',
|
||||
content: 'summary',
|
||||
},
|
||||
{
|
||||
name: 'twitter:creator',
|
||||
content: site.siteMetadata.author,
|
||||
},
|
||||
{
|
||||
name: 'twitter:title',
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
name: 'twitter:description',
|
||||
content: metaDescription,
|
||||
},
|
||||
].concat(meta)}
|
||||
>
|
||||
<link rel="icon" href={favicon} />
|
||||
</Helmet>
|
||||
);
|
||||
}
|
||||
|
||||
SEO.defaultProps = {
|
||||
lang: 'en',
|
||||
meta: [],
|
||||
description: '',
|
||||
};
|
||||
|
||||
SEO.propTypes = {
|
||||
description: PropTypes.string,
|
||||
lang: PropTypes.string,
|
||||
meta: PropTypes.arrayOf(PropTypes.object),
|
||||
title: PropTypes.string.isRequired,
|
||||
};
|
||||
|
||||
export default SEO;
|
||||
35
docs/src/components/sidenav.tsx
Normal file
35
docs/src/components/sidenav.tsx
Normal file
@@ -0,0 +1,35 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { Anchor } from 'antd';
|
||||
import { useMenus } from 'docz';
|
||||
import { getActiveMenuItem } from '../utils';
|
||||
|
||||
const { Link } = Anchor;
|
||||
|
||||
const HeaderNav = () => {
|
||||
const menus = useMenus();
|
||||
const { headings } = getActiveMenuItem(menus);
|
||||
const headsList = headings.map((e) => (
|
||||
<Link href={`#${e.slug}`} title={e.value} />
|
||||
));
|
||||
return <Anchor>{headsList}</Anchor>;
|
||||
};
|
||||
|
||||
export default HeaderNav;
|
||||
Reference in New Issue
Block a user