feat: can hide any category (#14)

Author: ainursharaev

gatsby-theme-woly/src/components/layout.js

@@ -5,7 +5,7 @@ import styled from 'styled-components';
 
 import { ComponentsMenu } from './components-menu';
 import { paths } from '../paths';
-import { mapComponentName } from '../lib/constants';
+import { isHiddenCategory } from '../lib/guards';
 
 export const Layout = ({ children }) => {
   const data = useStaticQuery(graphql`
@@ -53,7 +53,7 @@ function createMapping(data) {
     }
     const prefix = data.pathPrefix || '';
 
-    if (component.meta.category !== mapComponentName) {
+    if (!isHiddenCategory(component.meta.category)) {
       packages[component.meta.package].push({
         ...component.meta,
         path: prefix + paths.componentUsage(component.meta),

gatsby-theme-woly/src/lib/guards.js

@@ -0,0 +1,15 @@
+import { mapComponentName } from './constants';
+
+const hiddenCategories = [mapComponentName, 'hidden'];
+
+const hiddenCategory = new RegExp(
+  `\\b[A-Za-z]+\\-*(${hiddenCategories.join('|')})$`,
+  'g',
+);
+
+export const isHiddenCategory = (category) => {
+  if (typeof category !== 'string') {
+    throw new Error('Category is not a string');
+  }
+  return hiddenCategory.test(category);
+};

gatsby-theme-woly/src/templates/usage.js

@@ -3,7 +3,7 @@ import { graphql } from 'gatsby';
 import { MDXRenderer } from 'gatsby-plugin-mdx';
 import { pascalCase } from 'change-case';
 import { Layout } from '../components/layout';
-import { mapComponentName } from '../lib/constants';
+import { isHiddenCategory } from '../lib/guards';
 
 const installation = ({ package: p }) =>
   `npm install ${p}
@@ -12,7 +12,7 @@ yarn add ${p}`;
 
 const ComponentPage = ({ data, pageContext }) => {
   const { frontmatter, body } = data.usage;
-  if (frontmatter.category === mapComponentName) {
+  if (isHiddenCategory(frontmatter.category)) {
     return <MDXRenderer>{body}</MDXRenderer>;
   }
   return (