breaking(components): Removed the Emblem, Navbar, and Ogol components

config/changelog.yaml

@@ -12,9 +12,16 @@ Unreleased:
   Fixed:
     components:
       - Include basic themeing in Example component
+      - Updated the note and tip icons
     shin:
       - Removed unused lengthBonus option
 
+  Removed:
+    components:
+      - Removed the Emblem component
+      - Removed the Navbar component
+      - Removed the Ogol component
+
 2.10.7:
   date: 2020-11-18
   Fixed:

packages/components/src/Emblem/index.js

@@ -1,10 +0,0 @@
-import React from 'react'
-
-const Emblem = (props) => (
-  <React.Fragment>
-    <span className="emb">{props.t1 || 'Free'}</span>
-    <span className="lem">{props.t2 || 'Sewing'}</span>
-  </React.Fragment>
-)
-
-export default Emblem

packages/components/src/Emblem/stories.js

@@ -1,7 +0,0 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import Emblem from ".";
-
-storiesOf("Emblem", module).add("FreeSewing", () => (
-  <Emblem t1="Free" t2="Sewing" />
-));

packages/components/src/Navbar/index.js

@@ -1,86 +0,0 @@
-import React from 'react'
-import Logo from '../Logo'
-import Emblem from '../Emblem'
-import { FormattedMessage } from 'react-intl'
-import useMediaQuery from '@material-ui/core/useMediaQuery'
-
-const Navbar = ({
-  home = 'https://freesewing.org/',
-  navs = { left: [], right: [], mleft: {}, mright: {} },
-  logo = <Logo embed color="#e9ecef" />,
-  emblem = <Emblem />
-}) => {
-  const mobile = useMediaQuery('(max-width:599px)')
-
-  if (mobile) return null
-
-  const renderNav = (key, nav) => {
-    let title = nav.title || nav.text
-    let text =
-      typeof nav.text === 'string' ? (
-        <FormattedMessage id={nav.text} data-test={'navbar-' + key} />
-      ) : (
-        nav.text
-      )
-    if (nav.type === 'component') return nav.component
-    else if (nav.type === 'button')
-      return (
-        <button
-          title={title}
-          onClick={nav.onClick}
-          key={key}
-          className={nav.active ? 'active' : ''}
-          data-test={'navbar-' + key}
-        >
-          {text}
-        </button>
-      )
-    return (
-      <a
-        href={nav.href}
-        className={nav.active ? 'nav active' : 'nav'}
-        title={title}
-        key={key}
-        data-test={'navbar-' + key}
-      >
-        {text}
-      </a>
-    )
-  }
-
-  let homeProps = {
-    href: '#home'
-  }
-  if (typeof home === 'function') homeProps.onClick = home
-  else homeProps.href = home
-
-  let logoDiv = (
-    <div className="logo">
-      <a id="home" {...homeProps} data-test="navbar-home">
-        {logo}
-      </a>
-    </div>
-  )
-  let emblemDiv = (
-    <div className="emblem">
-      <a {...homeProps}>{emblem}</a>
-    </div>
-  )
-  return (
-    <header className="navbar">
-      <div>
-        <div style={{ display: 'flex' }}>
-          {logoDiv}
-          {emblemDiv}
-          {Object.keys(navs.left).map((key) => renderNav(key, navs.left[key]))}
-        </div>
-        <div className="spread" />
-        <div style={{ display: 'flex' }}>
-          {Object.keys(navs.right).map((key) => renderNav(key, navs.right[key]))}
-        </div>
-      </div>
-    </header>
-  )
-}
-
-export default Navbar

packages/components/src/Navbar/stories.js

@@ -1,46 +0,0 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import Navbar from ".";
-import LanguageIcon from "@material-ui/icons/Translate";
-import DarkModeIcon from "@material-ui/icons/Brightness3";
-
-const navs = {
-  left: [
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: "app.patterns"
-    },
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: "app.docs"
-    },
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: "app.community"
-    }
-  ],
-  right: [
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: "app.account"
-    },
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: <LanguageIcon className="nav-icon" />,
-      title: "Languages"
-    },
-    {
-      type: "link",
-      href: "https://freesewing.org/",
-      text: <DarkModeIcon className="nav-icon moon" />,
-      title: "Dark mode"
-    }
-  ]
-};
-
-storiesOf("Navbar", module).add("Basic", () => <Navbar navs={navs} />);

packages/components/src/Ogol/stories.js

@@ -1,9 +0,0 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import Ogol from ".";
-import { dark as backgrounds } from "../../.storybook/backgrounds";
-
-storiesOf("Ogol", module)
-  .add("Default", () => <Ogol />, { backgrounds })
-  .add("Custom color", () => <Ogol color="yellow" />, { backgrounds })
-  .add("Custom size", () => <Ogol size={200} />, { backgrounds });

packages/components/src/index.js

@@ -2,14 +2,11 @@ export default [
   'Blockquote',
   'Draft',
   'DraftConfigurator',
-  'Emblem',
   'Example',
   'Icon',
   'Legend',
   'LineDrawing',
   'Logo',
-  'Navbar',
-  'Ogol',
   'Robot',
   'Spinner',
   'SampleConfigurator',