docs: move gendocs tool to dagger/dagger

Signed-off-by: Andrea Luzzardi <aluzzardi@gmail.com>

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Logos.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import logo from '../assets/dagger-logo.jpg'
+
+export default function Logo(props) {
+    return <img src={logo} alt="Logo" />
+}

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Sidebar/ExternalLink/index.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { FiExternalLink } from 'react-icons/fi';
+
+export default function ExternalLink({ link, label }) {
+  return (
+    <a href={link} rel="noopener noreferrer">
+      {label}
+      <FiExternalLink
+        style={{ width: '16px', height: '16px', marginLeft: '10px' }}
+      />
+    </a>
+  );
+}
+
+ExternalLink.propTypes = {
+  link: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired,
+};

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Sidebar/InternalLink/index.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {Link} from 'gatsby';
+
+export default function InternalLink({ link, label }) {
+
+  return (
+    <Link to={link} activeClassName="active-link">
+      {label}
+    </Link>
+  );
+}
+
+InternalLink.propTypes = {
+  link: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired,
+};

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Sidebar/Select/index.js

@@ -0,0 +1,28 @@
+import React, { useEffect, useState } from "react";
+import { Select as SelectStyled } from '../styles';
+
+const Select = () => {
+    const isBrowser = typeof window !== "undefined"
+    const [tagsList, setTagsList] = useState([])
+    const currentLocation = isBrowser ? window.location.pathname.split('/') : []
+    currentLocation.pop() //remove last trailing slash
+
+    useEffect(() => {
+        async function getTags() {
+            const fetchTags = await fetch('https://s3-eu-west-1.amazonaws.com/daggerdoc.humans-it.com/tags.json').then(result => result.json());
+            setTagsList(fetchTags);
+        }
+
+        getTags()
+    }, [])
+
+    return (
+        <SelectStyled value={currentLocation[currentLocation.length - 1]} onChange={(e) => isBrowser ? window.location.pathname = `/${e.currentTarget.value}/index.html` : null}>
+            {tagsList.map(t => (
+                <option>{t.tag}</option>
+            ))}
+        </SelectStyled>
+    );
+};
+
+export default Select;

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Sidebar/index.js

@@ -0,0 +1,95 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useStaticQuery, graphql, Link } from 'gatsby';
+import { useSidebar } from '@rocketseat/gatsby-theme-docs-core';
+
+import {
+  Container,
+  LogoContainer,
+  List,
+  Heading,
+  Item,
+  SubItem,
+} from './styles';
+import Select from './Select'
+import { isExternalUrl } from '../../util/url';
+import ExternalLink from './ExternalLink';
+import InternalLink from './InternalLink';
+import Logo from '../Logos';
+
+function ListWithSubItems({ children, text }) {
+  return (
+    <>
+      <Heading>{text}</Heading>
+      <SubItem>{children}</SubItem>
+    </>
+  );
+}
+
+export default function Sidebar({ isMenuOpen }) {
+  const {
+    site: {
+      siteMetadata: { basePath },
+    },
+  } = useStaticQuery(graphql`
+    {
+      site {
+        siteMetadata {
+          basePath
+        }
+      }
+    }
+  `);
+
+  const data = useSidebar();
+
+  function renderLink(link, label) {
+    return isExternalUrl(link) ? (
+      <ExternalLink link={link} label={label} />
+    ) : (
+      <InternalLink link={link} label={label} />
+    );
+  }
+
+  return (
+    <Container isMenuOpen={isMenuOpen}>
+      <LogoContainer>
+        <Link to={basePath} aria-label="Go to home page">
+          <Logo aria-hidden="true" />
+        </Link>
+      </LogoContainer>
+      <Select />
+      <nav>
+        <List>
+          {data.map(({ node: { label, link, items, id } }) => {
+            if (Array.isArray(items)) {
+              const subitems = items.map((item) => (
+                <Item key={item.link}>{renderLink(item.link, item.label)}</Item>
+              ));
+
+              return (
+                <ListWithSubItems key={id} text={label}>
+                  {subitems}
+                </ListWithSubItems>
+              );
+            }
+
+            return <Item key={id}>{renderLink(link, label)}</Item>;
+          })}
+        </List>
+      </nav>
+    </Container>
+  );
+}
+
+ListWithSubItems.propTypes = {
+  children: PropTypes.oneOfType([
+    PropTypes.arrayOf(PropTypes.element),
+    PropTypes.node,
+  ]).isRequired,
+  text: PropTypes.string.isRequired,
+};
+
+Sidebar.propTypes = {
+  isMenuOpen: PropTypes.bool.isRequired,
+};

tools/gendocs/src/@rocketseat/gatsby-theme-docs/components/Sidebar/styles.js

@@ -0,0 +1,139 @@
+import styled from '@emotion/styled';
+
+export const Container = styled.aside`
+  width: 100%;
+  overflow-y: auto;
+
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-direction: column;
+
+  position: sticky;
+  top: 0;
+  padding-top: 36px;
+  transition: transform 0.5s;
+  height: calc(100vh - 1px);
+
+  nav {
+    width: 100%;
+    padding-top: 24px;
+    align-self: flex-start;
+    flex: 1;
+  }
+
+  @media (max-width: 780px) {
+    max-width: 75%;
+    min-width: auto;
+    z-index: 1001;
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    padding-top: 32px;
+    background: ${({ theme }) => theme.colors.background};
+    transform: translate3d(
+      ${({ isMenuOpen }) => (isMenuOpen ? '0' : '-100%')},
+      0,
+      0
+    );
+  }
+`;
+
+export const LogoContainer = styled.div`
+  width: 70%;
+
+  a {
+    width: 100%;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+`;
+
+export const List = styled.ul`
+  list-style: none;
+  width: 100%;
+  padding-left: 0;
+
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  flex-direction: column;
+`;
+
+export const Heading = styled.li`
+  padding-left: 30px;
+  width: 100%;
+  text-transform: uppercase;
+  font-size: 14px;
+  font-weight: bold;
+  margin-top: 20px;
+  color: ${({ theme }) => theme.colors.title};
+  letter-spacing: 0.142em;
+`;
+
+export const Item = styled.li`
+  font-size: 15px;
+  width: 100%;
+  transition: all 200ms ease-in-out;
+  padding: 0 20px;
+  cursor: pointer;
+
+  a,
+  span {
+    display: block;
+    font-size: 15px;
+    color: ${({ theme }) => theme.colors.text};
+    background-color: ${({ theme }) => theme.colors.background};
+    padding: 4px 10px;
+    margin: 4px 0;
+    border-radius: 4px;
+    font-weight: normal;
+
+    text-decoration: none;
+    width: 100%;
+    height: 100%;
+
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+
+    cursor: pointer;
+    margin: 0 auto;
+
+    transition: all 0.2s ease;
+
+    svg {
+      width: 20px;
+      height: 20px;
+      margin-right: 10px;
+    }
+
+    &:not(.active-link):hover {
+      color: ${({ theme }) => theme.colors.primary};
+    }
+
+    &.active-link {
+      color: ${({ theme }) => theme.colors.primary};
+      background-color: ${({ theme }) => theme.colors.shape};
+    }
+
+    @media (max-width: 780px) {
+      &.active-link {
+        background: ${({ theme }) => theme.colors.shape};
+      }
+    }
+  }
+`;
+
+export const SubItem = styled(List)`
+  margin: 5px 0 0 0;
+`;
+
+export const Select = styled.select`
+  border: 1px solid #6C6C808C;
+  padding: 0.5rem;
+  margin: 2rem 0 1rem;
+  width: 100%;
+`;

tools/gendocs/src/@rocketseat/gatsby-theme-docs/styles/theme.js

@@ -0,0 +1,15 @@
+export default {
+    colors: {
+        primary: '#1890FF',
+        background: '#FFFFFF',
+        shape: `#F2F2FA`,
+        title: `#3D3D4D`,
+        text: `#6C6C80`,
+        components: {
+            blockquote: {
+                background: `#332616`,
+                text: `#E1E1E6`,
+            },
+        },
+    },
+};

tools/gendocs/src/@rocketseat/gatsby-theme-docs/util/copy-to-clipboard.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+export const copyToClipboard = (str) => {
+  const { clipboard } = window.navigator;
+
+  if (!clipboard || typeof clipboard.writeText !== `function`) {
+    const textarea = document.createElement(`textarea`);
+    textarea.value = str;
+    textarea.setAttribute(`readonly`, true);
+    textarea.setAttribute(`contenteditable`, true);
+    textarea.style.position = `absolute`;
+    textarea.style.left = `-9999px`;
+    document.body.appendChild(textarea);
+    textarea.select();
+    const range = document.createRange();
+    const sel = window.getSelection();
+    sel.removeAllRanges();
+    sel.addRange(range);
+    textarea.setSelectionRange(0, textarea.value.length);
+    document.execCommand(`copy`);
+    document.body.removeChild(textarea);
+
+    return Promise.resolve(true);
+  }
+
+  return clipboard.writeText(str);
+};

tools/gendocs/src/@rocketseat/gatsby-theme-docs/util/slug.js

@@ -0,0 +1,11 @@
+export default function slugify(string) {
+  return string
+    .toString() // Cast to string
+    .toLowerCase() // Convert the string to lowercase letters
+    .trim() // Remove whitespace from both sides of a string
+    .replace(/\s/g, '-') // Replace each space with -
+    .replace(
+      /[^\w\-\u00b4\u00C0-\u00C3\u00c7\u00C9-\u00CA\u00CD\u00D3-\u00D5\u00DA\u00E0-\u00E3\u00E7\u00E9-\u00EA\u00ED\u00F3-\u00F5\u00FA]+/g,
+      '',
+    ); // Removes all chars that aren't words, -, ´ or some latin characters (À Á Â Ã Ç É Ê Í Ó Ô Õ Ú à á â ã ç é ê í ó ô õ ú)
+}

tools/gendocs/src/@rocketseat/gatsby-theme-docs/util/url.js

@@ -0,0 +1,5 @@
+function isExternalUrl(url) {
+  return new RegExp('^((https?:)?//)', 'i').test(url);
+}
+
+module.exports = { isExternalUrl };