Merge pull request #303 from creative-commoners/pulls/master/github-link

ENH Link github icon to current repo
This commit is contained in:
Guy Sartorelli 2024-07-02 10:11:18 +12:00 committed by GitHub
commit a63aadc26e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 39 additions and 19 deletions

View File

@ -1,9 +1,10 @@
import React, { StatelessComponent, ReactElement } from 'react';
import React, { StatelessComponent, ReactElement, useContext } from 'react';
import SearchBox from './SearchBox';
import { Link, navigate } from 'gatsby';
import logo from '../images/silverstripe-cms-logo.svg';
import useDocContext from '../hooks/useDocContext';
import useHierarchy from '../hooks/useHierarchy';
import LayoutContext from '../contexts/LayoutContext';
interface HeaderProps {
handleSidebarToggle(e: EventTarget): void
@ -14,6 +15,7 @@ const Header: StatelessComponent<HeaderProps> = ({ handleSidebarToggle }): React
const home = getHomePage();
const currentNode = getCurrentNode() || home;
const context = useDocContext();
const { currentGitRemote } = useContext(LayoutContext);
const handleNavigate = (e: any): void => {
if (typeof window === 'undefined') {
@ -30,6 +32,8 @@ const Header: StatelessComponent<HeaderProps> = ({ handleSidebarToggle }): React
};
const title = context === 'user' ? 'CMS Help' : 'CMS Docs';
const gitHref = currentGitRemote && currentGitRemote.hasOwnProperty('href')
? currentGitRemote.href.replace(/\.git$/, '') : '';
return (
<header role="banner" className="header fixed-top">
@ -59,7 +63,7 @@ const Header: StatelessComponent<HeaderProps> = ({ handleSidebarToggle }): React
</select>
<i className="fas fa-chevron-down"></i>
</li>
<li className="d-none d-sm-inline list-inline-item"><a title="Go to the Github repository" href="https://github.com/silverstripe/silverstripe-framework"><i className="fab fa-github fa-fw" /></a></li>
{ gitHref && <li className="d-none d-sm-inline list-inline-item"><a title="Go to the Github repository" href={gitHref}><i className="fab fa-github fa-fw" /></a></li> }
</ul>
</div>
<button onClick={handleSidebarToggle} id="docs-sidebar-toggler" className="docs-sidebar-toggler docs-sidebar-visible mr-2 d-xl-none" type="button">

View File

@ -3,6 +3,7 @@ import Header from './Header';
import Sidebar from './Sidebar';
import useHierarchy from '../hooks/useHierarchy';
import Helmet from 'react-helmet';
import LayoutContext from '../contexts/LayoutContext';
interface LayoutProps {
children?: ReactNode
@ -13,6 +14,7 @@ interface LayoutProps {
const Layout: StatelessComponent<LayoutProps> = ({ children, pageContext: { slug } }) => {
const { setCurrentPath, getVersionPath, getCurrentVersion, getCurrentNode, getDefaultVersion, getVersionMessage } = useHierarchy();
const [isToggled, setSidebarOpen] = useState(false);
const [currentGitRemote, setCurrentGitRemote] = useState(null);
const handleNavigate = () => setSidebarOpen(false);
setCurrentPath(slug);
@ -32,8 +34,13 @@ const Layout: StatelessComponent<LayoutProps> = ({ children, pageContext: { slug
});
}
const value = {
currentGitRemote,
setCurrentGitRemote,
};
return (
<>
<LayoutContext.Provider value={value}>
<Helmet link={helmetLinks} />
<Header handleSidebarToggle={() => setSidebarOpen(!isToggled)} />
<div className={`docs-wrapper container ${isToggled ? 'sidebar-visible' : ''}`}>
@ -49,7 +56,7 @@ const Layout: StatelessComponent<LayoutProps> = ({ children, pageContext: { slug
</div>
</div>
</div>
</>
</LayoutContext.Provider>
);
};
export default Layout;

View File

@ -0,0 +1,5 @@
import React from 'react';
const LayoutContext = React.createContext(null);
export default LayoutContext;

View File

@ -1,7 +1,8 @@
import React, { StatelessComponent, ReactElement } from 'react';
import React, { StatelessComponent, ReactElement, useContext } from 'react';
import { graphql } from 'gatsby';
import DocsPage from '../components/DocsPage';
import { SingleFileQuery } from '../types';
import LayoutContext from '../contexts/LayoutContext';
const Template: StatelessComponent<SingleFileQuery> = (result): ReactElement => {
const currentNode = result.data.silverstripeDocument;
@ -9,6 +10,9 @@ const Template: StatelessComponent<SingleFileQuery> = (result): ReactElement =>
const { html } = currentNode.watchFile;
const { relativePath, gitRemote } = currentNode.parent.parent;
const { ref, href } = gitRemote;
const { setCurrentGitRemote } = useContext(LayoutContext);
setCurrentGitRemote(gitRemote);
return (
<DocsPage