diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-04-29 12:13:34 +0200 | 
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-04-29 18:30:05 +0200 | 
| commit | 7e16f500cb7bc0cfd8bafbf6bb1555704f771231 (patch) | |
| tree | bfc2b4a475cb06a787e2c4bdf284165644e82952 /src/components/MDX/CodeBlock | |
| parent | 5324664e87bedfaa01ba62c0c847ef5b861e69b3 (diff) | |
chore: remove old pages, components, helpers and types
Since I'm using new components, I will also rewrite the GraphQL queries
so it is easier to start from scratch.
Diffstat (limited to 'src/components/MDX/CodeBlock')
| -rw-r--r-- | src/components/MDX/CodeBlock/CodeBlock.tsx | 115 | 
1 files changed, 0 insertions, 115 deletions
| diff --git a/src/components/MDX/CodeBlock/CodeBlock.tsx b/src/components/MDX/CodeBlock/CodeBlock.tsx deleted file mode 100644 index c330063..0000000 --- a/src/components/MDX/CodeBlock/CodeBlock.tsx +++ /dev/null @@ -1,115 +0,0 @@ -import { -  PrismDefaultPlugins, -  PrismLanguages, -  PrismPlugins, -} from '@ts/types/prism'; -import { usePrismTheme } from '@utils/providers/prism-theme'; -import { useRouter } from 'next/router'; -import Prism from 'prismjs'; -import { useCallback, useEffect, useMemo } from 'react'; -import { useIntl } from 'react-intl'; - -const CodeBlock = ({ -  code, -  language, -  plugins, -}: { -  code: string; -  language: PrismLanguages; -  plugins: PrismPlugins[]; -}) => { -  const intl = useIntl(); -  const router = useRouter(); -  const { setCodeBlocks } = usePrismTheme(); - -  useEffect(() => { -    const allPre: NodeListOf<HTMLPreElement> = document.querySelectorAll( -      'pre[data-prismjs-color-scheme-current]' -    ); -    setCodeBlocks(allPre); -  }, [setCodeBlocks, router.asPath]); - -  const defaultPlugins: PrismDefaultPlugins[] = useMemo( -    () => [ -      'autoloader', -      'toolbar', -      'show-language', -      'copy-to-clipboard', -      'color-scheme', -      'match-braces', -      'normalize-whitespace', -    ], -    [] -  ); - -  const loadPrismPlugins = useCallback( -    async (prismPlugins: (PrismDefaultPlugins | PrismPlugins)[]) => { -      for (const plugin of prismPlugins) { -        try { -          if (plugin === 'color-scheme') { -            await import(`@utils/plugins/prism-${plugin}`); -          } else { -            await import(`prismjs/plugins/${plugin}/prism-${plugin}.min.js`); - -            if (plugin === 'autoloader') -              Prism.plugins.autoloader.languages_path = '/prism/'; -          } -        } catch (error) { -          console.error('CodeBlock: an error occurred with Prism.'); -          console.error(error); -        } -      } -    }, -    [] -  ); - -  useEffect(() => { -    loadPrismPlugins([...defaultPlugins, ...plugins]).then(() => { -      Prism.highlightAll(); -    }); -  }, [loadPrismPlugins, defaultPlugins, plugins]); - -  const copyText = intl.formatMessage({ -    defaultMessage: 'Copy', -    description: 'Prism: copy button text (no clicked)', -    id: '/ly3AC', -  }); -  const copiedText = intl.formatMessage({ -    defaultMessage: 'Copied!', -    description: 'Prism: copy button text (clicked)', -    id: 'OV9r1K', -  }); -  const errorText = intl.formatMessage({ -    defaultMessage: 'Use Ctrl+c to copy', -    description: 'Prism: error text', -    id: 'z9qkcQ', -  }); -  const darkTheme = intl.formatMessage({ -    defaultMessage: 'Dark Theme 🌙', -    description: 'Prism: toggle dark theme button text', -    id: 'nFMdWI', -  }); -  const lightTheme = intl.formatMessage({ -    defaultMessage: 'Light Theme 🌞', -    description: 'Prism: toggle light theme button text', -    id: 'Ua2g2p', -  }); - -  const defaultPluginsClasses = 'match-braces'; -  const pluginsClasses = plugins.join(' '); - -  return ( -    <pre -      className={`language-${language} ${defaultPluginsClasses} ${pluginsClasses}`} -      data-prismjs-copy={copyText} -      data-prismjs-copy-success={copiedText} -      data-prismjs-copy-error={errorText} -      data-prismjs-color-scheme-dark={darkTheme} -      data-prismjs-color-scheme-light={lightTheme} -    > -      <code className={`language-${language}`}>{code}</code> -    </pre> -  ); -}; - -export default CodeBlock; | 
