diff options
| -rw-r--r-- | components/BreadCrumbs/breadcrumbs.module.scss (renamed from components/Breadcrumbs/breadcrumbs.module.scss) | 0 | ||||
| -rw-r--r-- | components/BreadCrumbs/index.tsx (renamed from components/Breadcrumbs/index.tsx) | 6 | ||||
| -rw-r--r-- | components/PathCrumbs/index.tsx | 60 | ||||
| -rw-r--r-- | next.config.js | 5 | ||||
| -rw-r--r-- | pages/wg2nd/index.tsx | 10 | ||||
| -rw-r--r-- | public/robots.txt | 2 | ||||
| -rw-r--r-- | templates/Default/index.tsx | 36 | ||||
| -rw-r--r-- | utils/assert.tsx | 3 | ||||
| -rw-r--r-- | utils/env.tsx | 9 | 
9 files changed, 88 insertions, 43 deletions
| diff --git a/components/Breadcrumbs/breadcrumbs.module.scss b/components/BreadCrumbs/breadcrumbs.module.scss index 6facea4..6facea4 100644 --- a/components/Breadcrumbs/breadcrumbs.module.scss +++ b/components/BreadCrumbs/breadcrumbs.module.scss diff --git a/components/Breadcrumbs/index.tsx b/components/BreadCrumbs/index.tsx index d773b33..693a9d0 100644 --- a/components/Breadcrumbs/index.tsx +++ b/components/BreadCrumbs/index.tsx @@ -3,13 +3,13 @@ import Link from "next/link";  import styles from './breadcrumbs.module.scss';  import clsx from 'clsx'; -export type BreadcrumbsProps = { +export type BreadCrumbsProps = {      className?: string;      style?: object;      children: React.ReactNode;  }; -const Breadcrumbs : FC<BreadcrumbsProps> = ({children, className, ...props}) => ( +const BreadCrumbs : FC<BreadCrumbsProps> = ({children, className, ...props}) => (      <span className={clsx(styles.breadcrumbs, className)} {...props}>          {Children.map(children, (child, index) => {              return ( @@ -51,6 +51,6 @@ const LinkCrumb : FC<LinkCrumbProps> = ({children, href, ...props}) => (  export {      Crumb, -    Breadcrumbs, +    BreadCrumbs,      LinkCrumb  }; diff --git a/components/PathCrumbs/index.tsx b/components/PathCrumbs/index.tsx new file mode 100644 index 0000000..1c87344 --- /dev/null +++ b/components/PathCrumbs/index.tsx @@ -0,0 +1,60 @@ +import React, { FC } from 'react'; + +import assert from '../../utils/assert'; +import { DISPLAY_DOMAIN } from '../../utils/env'; + +const urlPathComponents = (path : string): string[] => { +  assert(path.length > 0, "empty path"); + +  let canonicalizedPath = path[path.length - 1] === '/' ? +    path.substr(0, path.length - 1) : path; + +  if(canonicalizedPath.length === 0) { +    return []; +  } else { +    canonicalizedPath = canonicalizedPath[0] == '/' ? +      path.substr(1, path.length - 1) : path; +  } + +  return canonicalizedPath.split('/') +} + +const urlPathComponentsToFullPath = (urlPathComponents : string[]): string[] => { +  const fullPaths = new Array<string>(urlPathComponents.length + 1); + +  fullPaths[0] = ''; + +  for(let i = 0; i < urlPathComponents.length; i++) { +    fullPaths[i + 1] = fullPaths[i] + '/' + urlPathComponents[i]; +  } + +  fullPaths[0] = '/'; + +  return fullPaths; +}; + +export type PathCrumbsProps = { +  path: string +}; + +import { BreadCrumbs , LinkCrumb } from '../../components/BreadCrumbs'; + +const PathCrumbs: FC<PathCrumbsProps> = ({ path }) => { + +  const pathComponents = urlPathComponents(path); +  const fullPaths = urlPathComponentsToFullPath(pathComponents); + +  const linksComponents = fullPaths.map((fullPath, i) => ( +    <LinkCrumb href={fullPath} key={fullPath}> +      { i === 0 ? DISPLAY_DOMAIN : pathComponents[i - 1] } +    </LinkCrumb> +  )); + +  return ( +    <BreadCrumbs> +      {linksComponents} +    </BreadCrumbs> +  ); +}; + +export default PathCrumbs; diff --git a/next.config.js b/next.config.js index 023ecb8..2fa75e0 100644 --- a/next.config.js +++ b/next.config.js @@ -14,6 +14,9 @@ module.exports = () => {          ...webpackConfig,          sassOptions: {              includePaths: [path.join(__dirname, 'styles')] +        }, +        env: { +          DISPLAY_DOMAIN: process.env.DISPLAY_DOMAIN || 'flu0r1ne.net',          }      }; -}
\ No newline at end of file +} diff --git a/pages/wg2nd/index.tsx b/pages/wg2nd/index.tsx index 45125d5..3f38a12 100644 --- a/pages/wg2nd/index.tsx +++ b/pages/wg2nd/index.tsx @@ -9,6 +9,8 @@ import Button from '../../components/Button';  import Markdown from '../../components/Markdown';  import Typography from '../../components/Typography'; +import PathCrumbs from "../../components/PathCrumbs"; +  import Script from 'next/script';  // @ts-ignore @@ -91,8 +93,6 @@ const Panel: React.FC<PanelProps> = ({ children, customStyle }) => (      </section>  ); -import { Breadcrumbs, LinkCrumb } from "../../components/Breadcrumbs"; -  const Wg2nd = () => {    const intfNameRef = useRef<HTMLInputElement>(null);    const intfConfigRef = useRef<HTMLTextAreaElement>(null); @@ -136,11 +136,7 @@ const Wg2nd = () => {      >        {/* Description */}        <Panel> -        <Breadcrumbs> -          <LinkCrumb href="/">flu0r1ne.net</LinkCrumb> -          <LinkCrumb href="/wg2nd">wg2nd</LinkCrumb> -        </Breadcrumbs> - +        <PathCrumbs path="/wg2nd" />          <Markdown md={desc} />        </Panel> diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..c2a49f4 --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Allow: / diff --git a/templates/Default/index.tsx b/templates/Default/index.tsx index 6a307ab..ccfde4a 100644 --- a/templates/Default/index.tsx +++ b/templates/Default/index.tsx @@ -1,8 +1,8 @@ -import clsx from "clsx"; -import React, { FC } from "react"; -import { Breadcrumbs, LinkCrumb } from "../../components/Breadcrumbs"; +import React, { FC } from 'react'; +import PathCrumbs from "../../components/PathCrumbs";  import Viewport from "../../components/ViewPort";  import styles from './default.module.scss'; +import clsx from 'clsx';  export type DefaultPageProps = {      className?: string; @@ -11,34 +11,6 @@ export type DefaultPageProps = {      children?: React.ReactChild;  }; -export type RelPathProps = { -    path: string; -}; - -const RelPath : FC<RelPathProps> = ({path, ...props}) => { -    const _path = path[path.length - 1] === '/' ? path.substr(0, path.length - 1) : path; - -    const parts = _path.split('/'); -    const rels = ['']; - -    for(let i = 1; i < parts.length; i++) { -        rels.push([rels[i - 1], parts[i]].join('/')); -    } - -    rels[0] = '/'; -    parts[0] = 'flu0r1ne.net'; - -    return ( -        <Breadcrumbs> -            {rels.map((relHref, i) => ( -                <LinkCrumb key={relHref} href={relHref}> -                    {parts[i]}  -                </LinkCrumb> -            ))} -        </Breadcrumbs> -    ); -} -  const LastUpdatedDate : FC<{ children: React.ReactNode }> = ({children}) => (      <span className={styles.date}><b>Last Updated: </b>{children}</span>  ) @@ -47,7 +19,7 @@ const DefaultPage : FC<DefaultPageProps> = ({className, lastUpdated, children, p      <Viewport          className={clsx(styles.viewportOverrides, className)}      > -        {path !== undefined ? <RelPath path={path!} /> : undefined} +        {path !== undefined ? <PathCrumbs path={path!} /> : undefined}          {lastUpdated ? <LastUpdatedDate>{lastUpdated}</LastUpdatedDate> : undefined}          {children}      </Viewport> diff --git a/utils/assert.tsx b/utils/assert.tsx new file mode 100644 index 0000000..0ee51a0 --- /dev/null +++ b/utils/assert.tsx @@ -0,0 +1,3 @@ +export default function assert(cond : boolean, message?: string) { +  if(!cond) { throw Error(message); } +}; diff --git a/utils/env.tsx b/utils/env.tsx new file mode 100644 index 0000000..1894c1b --- /dev/null +++ b/utils/env.tsx @@ -0,0 +1,9 @@ +import assert from './assert'; + +const DISPLAY_DOMAIN = process.env.DISPLAY_DOMAIN; + +assert(DISPLAY_DOMAIN !== undefined, 'Please set DISPLAY_DOMAIN'); + +export { +  DISPLAY_DOMAIN +}; | 
