chore: Fixing linter warnings

sites/shared/components/mdx/example/TextOnPath/index.js

@@ -3,7 +3,6 @@ import { useTranslation } from 'next-i18next'
 
 const TextOnPath = (props) => {
   const { t } = useTranslation(['plugin'])
-  const text = []
   // Handle translation
   let translated = ''
   for (let string of props.path.attributes.getAsArray('data-text')) {

sites/shared/components/mdx/prev-next.js

@@ -76,7 +76,7 @@ const renderPrevious = node => node
   ? (
     <div className="flex flex-row gap-2 items-center">
       <LeftIcon className="w-8 h-8"/>
-      <Link href={'/'+node?.__slug}>
+      <Link href={'/'+node.__slug}>
         <a className="text-secondary">{node.__linktitle}</a>
       </Link>
     </div>
@@ -85,7 +85,7 @@ const renderPrevious = node => node
 const renderNext = node => node
   ? (
     <div className="flex flex-row gap-2 items-center">
-      <Link href={'/'+node?.__slug}>
+      <Link href={'/'+node.__slug}>
         <a className="text-right">{node.__linktitle}</a>
       </Link>
       <RightIcon className="w-8 h-8"/>

sites/shared/components/modal.js

@@ -1,22 +1,16 @@
-import { useState } from 'react'
+const Modal = ({ cancel, children }) => (
-
+  <div className={`
-const Modal = ({ cancel, children }) => {
+    fixed top-0 left-0 right-0 w-screen h-screen
-
+    bg-neutral bg-opacity-70 z-30
-
+    hover:cursor-pointer flex flex-col justify-center
-  return (
+    `} onClick={cancel}>
-    <div className={`
+      <div className="m-auto text-neutral-content lightbox" style={{
-      fixed top-0 left-0 right-0 w-screen h-screen
+        maxHeight: "calc(100vh - 6rem)",
-      bg-neutral bg-opacity-70 z-30
+        maxWidth: "calc(100vw - 6rem)",
-      hover:cursor-pointer flex flex-col justify-center
+      }}>
-      `} onClick={cancel}>
+        {children}
-        <div className="m-auto text-neutral-content lightbox" style={{
+      </div>
-          maxHeight: "calc(100vh - 6rem)",
+  </div>
-          maxWidth: "calc(100vw - 6rem)",
+)
-        }}>
-          {children}
-        </div>
-    </div>
-  )
-}
 
 export default Modal

sites/shared/components/navigation/primary.js

@@ -15,13 +15,6 @@ import ShowcaseIcon from 'shared/components/icons/camera.js'
 // Don't show children for blog and showcase posts
 const keepClosed = ['blog', 'showcase', ]
 
-// TODO: For now we force tailwind to pickup these styles
-// At some point this should 'just work' though, but let's not worry about it now
-const force = [
-  <p className="w-6 mr-2"/>,
-  <p className="w-8 mr-3"/>
-]
-
 // List of icons matched to top-level slug
 const icons = {
   accessories: (className='') => <TutorialIcon className={className}/>,

sites/shared/components/popout.js

@@ -12,21 +12,6 @@ const colors = {
   none: '',
 }
 
-let forceTailwind = <p className="border-accent bg-accent" />
-forceTailwind += <p className="text-accent" />
-forceTailwind += <p className="border-secondary bg-secondary" />
-forceTailwind += <p className="text-secondary" />
-forceTailwind += <p className="border-error bg-error" />
-forceTailwind += <p className="text-error" />
-forceTailwind += <p className="border-warning bg-warning" />
-forceTailwind += <p className="text-warning" />
-forceTailwind += <p className="border-info bg-info" />
-forceTailwind += <p className="text-info" />
-forceTailwind += <p className="border-success bg-success" />
-forceTailwind += <p className="text-success" />
-forceTailwind += <p className="border-primary bg-primary" />
-forceTailwind += <p className="text-primary" />
-
 const Popout = (props) => {
 
   const [hide, setHide] = useState(false)
@@ -73,7 +58,7 @@ const Popout = (props) => {
                 {type === 'comment' && <> by <b>{props.by}</b></>}
               </span>
             </div>
-            {props?.hideable && (
+            {props.hideable && (
               <button
                 onClick={() => setHide(true)}
                 className="hover:text-secondary"

sites/shared/components/workbench/draft/index.js

@@ -1,9 +1,8 @@
 import SvgWrapper from './svg-wrapper'
 import Error from './error.js'
-import Robot from 'shared/components/robot/index.js'
 
 const LabDraft = props => {
-  const { app, draft, design, gist, updateGist, unsetGist, showInfo, feedback, hasRequiredMeasurements } = props
+  const { app, draft, gist, updateGist, unsetGist, showInfo, feedback, hasRequiredMeasurements } = props
 
   if (!draft || !hasRequiredMeasurements) return null
 

sites/shared/components/workbench/draft/part/index.js

@@ -6,91 +6,65 @@ import { getProps } from '../utils'
 import { round } from 'shared/utils'
 import { Tr, KeyTd, ValTd, Attributes, pointCoords } from '../path/index'
 
-class ErrorBoundary extends React.Component {
+const partInfo = (props) => (
-  constructor(props) {
+  <div className="p-4 border bg-neutral bg-opacity-40 shadow rounded-lg">
-    super(props);
+    <h5 className="text-neutral-content text-center pb-4">Part info</h5>
-    this.state = { hasError: false };
+    <table className="border-collapse h-fit">
-  }
+      <tbody>
-
+        <Tr>
-  static getDerivedStateFromError(error) {
+          <KeyTd>Name</KeyTd>
-    console.log(error)
+          <ValTd>{props.partName}</ValTd>
-    return { hasError: true }
+        </Tr>
-  }
+        <Tr>
-  componentDidCatch(error, errorInfo) {
+          <KeyTd>Width</KeyTd>
-    console.log(error, errorInfo)
+          <ValTd>{round(props.part.width,2)}mm</ValTd>
-  }
+        </Tr>
-  render() {
+        <Tr>
-    if (this.state.hasError) {
+          <KeyTd>Height</KeyTd>
-      console.log('in error boundary', props)
+          <ValTd>{round(props.part.height,2)}mm</ValTd>
-      return <text>Something went wrong.</text>
+        </Tr>
-    }
+        <Tr>
-
+          <KeyTd>Top Left</KeyTd>
-    return this.props.children
+          <ValTd>{pointCoords(props.part.topLeft)}</ValTd>
-  }
+        </Tr>
-}
+        <Tr>
-
+          <KeyTd>Bottom Right</KeyTd>
-const partInfo = (props) => {
+          <ValTd>{pointCoords(props.part.bottomRight)}</ValTd>
-
+        </Tr>
-  return (
+        <Tr>
-    <div className="p-4 border bg-neutral bg-opacity-40 shadow rounded-lg">
+          <KeyTd>Attributes</KeyTd>
-      <h5 className="text-neutral-content text-center pb-4">Part info</h5>
+          <ValTd><Attributes list={props.part.attributes.list} /></ValTd>
-      <table className="border-collapse h-fit">
+        </Tr>
-        <tbody>
+      </tbody>
-          <Tr>
+    </table>
-            <KeyTd>Name</KeyTd>
+    <div className="flex flex-row flex-wrap gap-2 mt-4">
-            <ValTd>{props.partName}</ValTd>
+    {props.gist?.only && props.gist.only.length > 0
-          </Tr>
+      ? (
-          <Tr>
-            <KeyTd>Width</KeyTd>
-            <ValTd>{round(props.part.width,2)}mm</ValTd>
-          </Tr>
-          <Tr>
-            <KeyTd>Height</KeyTd>
-            <ValTd>{round(props.part.height,2)}mm</ValTd>
-          </Tr>
-          <Tr>
-            <KeyTd>Top Left</KeyTd>
-            <ValTd>{pointCoords(props.part.topLeft)}</ValTd>
-          </Tr>
-          <Tr>
-            <KeyTd>Bottom Right</KeyTd>
-            <ValTd>{pointCoords(props.part.bottomRight)}</ValTd>
-          </Tr>
-          <Tr>
-            <KeyTd>Attributes</KeyTd>
-            <ValTd><Attributes list={props.part.attributes.list} /></ValTd>
-          </Tr>
-        </tbody>
-      </table>
-      <div className="flex flex-row flex-wrap gap-2 mt-4">
-      {props.gist?.only && props.gist.only.length > 0
-        ? (
-          <button
-            className="btn btn-primary"
-            onClick={() => props.unsetGist(['only'])}
-          >Show all parts</button>
-        ) : (
-          <button
-            className="btn btn-primary"
-            onClick={() => props.updateGist(['only'], [props.partName])}
-          >Show only this part</button>
-        )}
         <button
-          className="btn btn-success"
+          className="btn btn-primary"
-          onClick={() => console.log(props.part)}
+          onClick={() => props.unsetGist(['only'])}
-        >console.log(part)</button>
+        >Show all parts</button>
+      ) : (
         <button
-          className="btn btn-success"
+          className="btn btn-primary"
-          onClick={() => console.table(props.part.points)}
+          onClick={() => props.updateGist(['only'], [props.partName])}
-        >console.table(part.points)</button>
+        >Show only this part</button>
-        <button
+      )}
-          className="btn btn-success"
+      <button
-          onClick={() => console.table(props.part.paths)}
+        className="btn btn-success"
-        >console.table(part.paths)</button>
+        onClick={() => console.log(props.part)}
-      </div>
+      >console.log(part)</button>
+      <button
+        className="btn btn-success"
+        onClick={() => console.table(props.part.points)}
+      >console.table(part.points)</button>
+      <button
+        className="btn btn-success"
+        onClick={() => console.table(props.part.paths)}
+      >console.table(part.paths)</button>
     </div>
-  )
+  </div>
-}
+)
 
 const XrayPart = props => {
   const { topLeft, bottomRight } = props.part
@@ -112,7 +86,7 @@ const XrayPart = props => {
 }
 
 export const PartInner = props => {
-  const { partName, part, app, gist } = props
+  const { partName, part, gist } = props
 
   const grid = gist.paperless ? (
     <rect

sites/shared/components/workbench/draft/path/index.js

@@ -1,4 +1,3 @@
-import React, { useState } from 'react'
 import TextOnPath from '../text-on-path'
 import { getProps } from '../utils'
 import { round, formatMm } from 'shared/utils'
@@ -139,7 +138,7 @@ const Curve = (props) => {
   const ops = props.path.ops
   const from = ops[0].to
   const { to, cp1, cp2 } = ops[1]
-  const { topLeft, bottomRight, w, h, size, bbox } = pathDimensions(from, to, cp1, cp2, props.path)
+  const { topLeft, w, h, size, bbox } = pathDimensions(from, to, cp1, cp2, props.path)
   const id = `${props.partName}_${props.pathName}_${props.i}`
 
   const cpProps = {
@@ -189,7 +188,6 @@ const Curve = (props) => {
 }
 
 const MiniPath = props => {
-  const ops = props.path.ops
   const bbox = props.path.boundary()
   const id = `${props.partName}_${props.pathName}_mini}`
   const w = bbox.bottomRight.x - bbox.topLeft.x
@@ -352,7 +350,7 @@ export const Attributes = ({ list }) => list
   ? (
     <ul>
       {Object.keys(list).map(key => (
-        <li><strong>{key}</strong>: {list[key]}</li>
+        <li key={key}><strong>{key}</strong>: {list[key]}</li>
       ))}
     </ul>
   ) : null

sites/shared/components/workbench/draft/point/index.js

@@ -1,6 +1,6 @@
 import Text from '../text'
 import Circle from '../circle'
-import { round, formatMm } from 'shared/utils'
+import { round } from 'shared/utils'
 import { Tr, KeyTd, ValTd, Attributes, pointCoords } from '../path/index'
 
 const RevealPoint = props => {

sites/shared/components/workbench/draft/text-on-path/index.js

@@ -13,7 +13,6 @@ const XrayTextOnPath = props => (
 
 const TextOnPath = (props) => {
   const { t } = useTranslation(['app'])
-  const text = []
   // Handle translation (and spaces)
   let translated = ''
   for (let string of props.path.attributes.getAsArray('data-text')) {

sites/shared/components/workbench/export.js

@@ -1,7 +1,5 @@
 import { useState } from 'react'
 import { SizeMe } from 'react-sizeme'
-import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"
-import svgattrPlugin from '@freesewing/plugin-svgattr'
 import { useTranslation } from 'next-i18next'
 import fileSaver from 'file-saver'
 import yaml from 'js-yaml'

sites/shared/components/workbench/menu/core-settings/core-setting-list.js

@@ -4,7 +4,7 @@ import { useTranslation } from 'next-i18next'
 
 const CoreSettingList = props => {
   const { t } = useTranslation(['settings'])
-  const { dflt, list } = props
+  const { dflt } = props
   const val = props.gist?.[props.setting]
 
   const [value, setValue] = useState(val)

sites/shared/components/workbench/menu/core-settings/core-setting-nr.js

@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import ClearIcon from 'shared/components/icons/clear.js'
-import EditIcon from 'shared/components/icons/edit.js'
 import { useTranslation } from 'next-i18next'
 
 const CoreSettingNr = props => {

sites/shared/components/workbench/menu/core-settings/index.js

@@ -1,5 +1,5 @@
 import SettingsIcon from 'shared/components/icons/settings.js'
-import { linkClasses, Chevron } from 'shared/components/navigation/primary.js'
+import { Chevron } from 'shared/components/navigation/primary.js'
 import Setting from './setting.js'
 import { Ul, Details, TopSummary, TopSumTitle } from '../index.js'
 import { useTranslation } from 'next-i18next'

sites/shared/components/workbench/menu/core-settings/setting.js

@@ -1,5 +1,4 @@
 import { Chevron } from 'shared/components/navigation/primary'
-import PctDegOption from 'shared/components/workbench/inputs/design-option-pct-deg'
 import ListSetting from './core-setting-list'
 import OnlySetting from './core-setting-only'
 import MmSetting from './core-setting-mm'

sites/shared/components/workbench/menu/design-options/option.js

@@ -1,6 +1,6 @@
 import { Chevron } from 'shared/components/navigation/primary'
 import { optionType } from 'shared/utils'
-import { Li, Ul, Details, Summary, SumButton, SumDiv, Deg } from 'shared/components/workbench/menu'
+import { Li, Details, Summary, SumButton, SumDiv, Deg } from 'shared/components/workbench/menu'
 import { useTranslation } from 'next-i18next'
 import {values} from 'shared/components/workbench/menu/design-options/option-value'
 import {inputs} from 'shared/components/workbench/menu/design-options/option-input'

sites/shared/components/workbench/menu/index.js

@@ -1,4 +1,4 @@
-import { linkClasses, Chevron } from 'shared/components/navigation/primary.js'
+import { linkClasses } from 'shared/components/navigation/primary.js'
 import ViewMenu from './view.js'
 import DesignOptions from './design-options'
 import CoreSettings from './core-settings'

sites/shared/components/workbench/menu/xray/attributes.js

@@ -1,6 +1,5 @@
 import { Chevron } from 'shared/components/navigation/primary'
 import { Ul, Li, Details, Summary, SumDiv, NoSumDiv, Deg } from 'shared/components/workbench/menu'
-import { round } from 'shared/utils'
 
 const XrayAttributes = ({ attr=false, t }) => {
   if (!attr || !attr.list || Object.keys(attr.list).length < 1) return null

sites/shared/components/workbench/menu/xray/path-ops.js

@@ -1,6 +1,5 @@
 import { Chevron } from 'shared/components/navigation/primary'
 import { Ul, Li, Details, Summary, SumDiv, NoSumDiv, Deg } from 'shared/components/workbench/menu'
-import { round } from 'shared/utils'
 import Point from './point'
 
 const MoveLine = ({ op }) => <Point point={op.to} />
@@ -18,9 +17,6 @@ const Curve = ({ op }) => ['cp1', 'cp2', 'to'].map(pnt => (
     </Details>
   </Li>
 ))
-const Close = () => (
-  <p>Close</p>
-)
 
 const XrayPathOp = ({ op }) => (
   <Li>

sites/shared/components/workbench/menu/xray/path.js

@@ -1,4 +1,4 @@
-import { Ul, Li, Details, Summary, NoSumDiv, Deg } from 'shared/components/workbench/menu'
+import { Ul, Li, Summary, NoSumDiv, Deg } from 'shared/components/workbench/menu'
 import { formatMm } from 'shared/utils'
 import Attributes from './attributes'
 import Ops from './path-ops'

sites/shared/components/workbench/menu/xray/point.js

@@ -1,4 +1,4 @@
-import { Ul, Li, Details, Summary, NoSumDiv, Deg } from 'shared/components/workbench/menu'
+import { Ul, Li, NoSumDiv, Deg } from 'shared/components/workbench/menu'
 import { round } from 'shared/utils'
 import Attributes from './attributes'
 

sites/shared/components/workbench/sample.js

@@ -1,5 +1,3 @@
-import { SizeMe } from 'react-sizeme'
-import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"
 import svgattrPlugin from '@freesewing/plugin-svgattr'
 import { useTranslation } from 'next-i18next'
 

sites/shared/components/wrappers/mdx.js

@@ -3,7 +3,7 @@
  * method (see shared/mdx/loader.js)
  * It is NOT for wrapping plain markdown/mdx
  */
-import { useState, useEffect, Fragment } from 'react'
+import { useState, useEffect } from 'react'
 
 // See: https://mdxjs.com/guides/mdx-on-demand/
 import { run } from '@mdx-js/mdx'

sites/shared/config/next.mjs

@@ -1,13 +1,7 @@
 import path from 'path'
 import { readdirSync } from 'fs'
 import remarkGfm from 'remark-gfm'
-import { designs, plugins, packages } from '../../../config/software/index.mjs'
+import { designs, plugins } from '../../../config/software/index.mjs'
-
-const getDirectories = source =>
-  readdirSync(source, { withFileTypes: true })
-    .filter(dirent => dirent.isDirectory())
-    .map(dirent => dirent.name)
-const pkgs = getDirectories(path.resolve(`../`))
 
 /*
  * This mehthod will return the NextJS configuration

sites/shared/prebuild/lab.mjs

@@ -87,7 +87,6 @@ export async function getStaticProps({ locale }) {
  * Main method that does what needs doing
  */
 
-const l = 'prebuild'
 export const prebuildLab = async (site) => {
   const promises = []
   const availableVersions = {}
@@ -96,10 +95,6 @@ export const prebuildLab = async (site) => {
     path.resolve('..', 'lab', 'versions.json'),
     'utf-8'
   ))
-  const plugins = JSON.parse(await fs.readFile(
-    path.resolve('..', 'lab', 'plugins.json'),
-    'utf-8'
-  ))
   for (const section in designsByType) {
     // Iterate over sections
     console.log(`Generating pages for ${section} designs`)
@@ -133,7 +128,7 @@ export const prebuildLab = async (site) => {
           const file = path.resolve('..', 'lab', 'lib', version, `${design}.mjs`)
           let cached
           try {
-            const result = await fs.access(file)
+            await fs.access(file)
             cached = true
           }
           catch(err) {

sites/shared/prebuild/strapi.mjs

@@ -70,11 +70,6 @@ export const prebuildStrapi = async (site) => {
   const types = ['blog']
   if (site === 'org') types.push('showcase')
 
-  // Languages
-  const languages = (site === 'dev')
-      ? [ 'en' ]
-      : ['en', 'es', 'de', 'fr', 'nl']
-
   const posts = {}
   const authors = {}
 

sites/shared/themes/lgbtq.js

@@ -1,5 +1,4 @@
 const colors = require('tailwindcss/colors')
-const light = require('./light')
 
 module.exports = {
   'fontFamily': '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif',

sites/shared/utils.mjs

@@ -82,7 +82,7 @@ export const capitalize = string => string.charAt(0).toUpperCase() + string.slic
 
 export const strapiImage = (img, sizes=['thumbnail', 'xlarge', 'large', 'medium', 'small', 'xsmall']) => {
   const image = {
-    caption: img?.caption || '',
+    caption: img.caption || '',
     w: img.width,
     h: img.height,
     url: img.url,