[site][xl]: move site folder to root

apps/site/.eslintrc.json

@@ -1,31 +0,0 @@
-{
-  "extends": [
-    "plugin:@nrwl/nx/react-typescript",
-    "next",
-    "next/core-web-vitals",
-    "../../.eslintrc.json"
-  ],
-  "ignorePatterns": ["!**/*", ".next/**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {
-        "@next/next/no-html-link-for-pages": ["error", "apps/site/pages"]
-      }
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ],
-  "rules": {
-    "@next/next/no-html-link-for-pages": "off"
-  },
-  "env": {
-    "jest": true
-  }
-}

apps/site/components/DataLiterate.js

@@ -1,47 +0,0 @@
-import Layout from '../components/Layout'
-
-import { MDXRemote } from 'next-mdx-remote'
-import dynamic from 'next/dynamic'
-import Head from 'next/head'
-import Link from 'next/link'
-
-import CustomLink from '../components/CustomLink'
-import { Vega, VegaLite } from 'react-vega'
-
-// Custom components/renderers to pass to MDX.
-// Since the MDX files aren't loaded by webpack, they have no knowledge of how
-// to handle import statements. Instead, you must include components in scope
-// here.
-const components = {
-  a: CustomLink,
-  Table: dynamic(() => import('../components/Table')),
-  Excel: dynamic(() => import('../components/Excel')),
-  // TODO: try and make these dynamic ...
-  Vega: Vega,
-  VegaLite: VegaLite,
-  LineChart: dynamic(() => import('../components/LineChart')),
-  Head,
-}
-
-export default function DataLiterate({ children, source, frontMatter }) {
-  return (
-    <Layout title={frontMatter.title}>
-      <div className="prose mx-auto">
-        <header>
-          <div className="mb-6">
-            <h1>{frontMatter.title}</h1>
-            {frontMatter.author && (
-              <div className="-mt-6"><p className="opacity-60 pl-1">{frontMatter.author}</p></div>
-            )}
-            {frontMatter.description && (
-              <p className="description">{frontMatter.description}</p>
-            )}
-          </div>
-        </header>
-        <main>
-          <MDXRemote {...source} components={components} />
-        </main>
-      </div>
-    </Layout>
-  )
-}

apps/site/components/Excel.js

@@ -1,74 +0,0 @@
-import axios from 'axios'
-import * as XLSX from 'xlsx'
-import React, { useEffect, useState } from 'react'
-
-import Table from './Table'
-
-export default function Excel ({ src='' }) {
-	const [data, setData] = React.useState([])
-	const [cols, setCols] = React.useState([])
-	const [workbook, setWorkbook] = React.useState(null)
-	const [error, setError] = React.useState('')
-  const [hasMounted, setHasMounted] = React.useState(0)
-
-  // so this is here so we re-render this in the browser
-  // and not just when we build the page statically in nextjs
-  useEffect(() => {
-    if (hasMounted==0) {
-      handleUrl(src)
-    }
-    setHasMounted(1)
-  })
-  
-  function handleUrl(url) {
-    // if url is external may have CORS issue so we proxy it ...
-    if (url.startsWith('http')) {
-      const PROXY_URL = window.location.origin + '/api/proxy'
-      url = PROXY_URL + '?url=' + encodeURIComponent(url)
-    }
-    axios.get(url, {
-      responseType: 'arraybuffer'
-    }).then((res) => {
-      let out = new Uint8Array(res.data)
-      let workbook = XLSX.read(out, {type: "array"})
-      // Get first worksheet
-      const wsname = workbook.SheetNames[0]
-      const ws = workbook.Sheets[wsname]
-      // Convert array of arrays
-      const datatmp = XLSX.utils.sheet_to_json(ws, {header:1})
-      const colstmp = make_cols(ws['!ref'])
-      setData(datatmp)
-      setCols(colstmp)
-      setWorkbook(workbook)
-    }).catch((e) => {
-      setError(e.message)
-    })
-  }
-
-  return (
-    <>
-      {error &&
-        <div>
-          There was an error loading the excel file at {src}:
-          <p>{error}</p>
-        </div>
-      }
-      {workbook &&
-        <ul>
-           {workbook.SheetNames.map((value, index) => {
-            return <li key={index}>{value}</li>
-        })}
-        </ul>
-      }
-      <Table data={data} cols={cols} />
-    </>
-  )
-}
-
-/* generate an array of column objects */
-const make_cols = refstr => {
-	let o = [], C = XLSX.utils.decode_range(refstr).e.c + 1
-	for(var i = 0; i < C; ++i) o[i] = {name:XLSX.utils.encode_col(i), key:i}
-	return o
-}
-

apps/site/components/Layout.js

@@ -1,32 +0,0 @@
-import Link from 'next/link'
-import Head from 'next/head'
-
-import Nav from '../components/Nav'
-
-export default function Layout({ children, title = 'Home' }) {
-  return (
-    <>
-      <Head>
-        <title>Portal.JS - {title}</title>
-        <link rel="icon" href="/favicon.ico" />
-        <meta charSet="utf-8" />
-        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
-      </Head>
-      <Nav />
-      <div className="mx-auto p-6">
-        {children}
-      </div>
-      <footer className="flex items-center justify-center w-full h-24 border-t">
-        <a
-          className="flex items-center justify-center"
-          href="https://datopian.com/"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Built by{' '}
-          <img src="/datopian-logo.png" alt="Datopian Logo" className="h-6 ml-2" />
-        </a>
-      </footer>
-    </>
-  )
-}

apps/site/components/data-literate/LineChart.js

@@ -1,33 +0,0 @@
-import { Vega, VegaLite } from 'react-vega'
-
-export default function LineChart( { data=[] }) {
-  var tmp = data
-  if (Array.isArray(data)) {
-    tmp = data.map((r,i) => {
-      return { x: r[0], y: r[1] }
-    })
-  }
-  const vegaData = { "table": tmp }
-  const spec = {
-    "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
-    "mark": "line",
-    "data": {
-      "name": "table"
-    },
-    "encoding": {
-      "x": {
-        "field": "x",
-        "timeUnit": "year",
-        "type": "temporal"
-      },
-      "y": {
-        "field": "y",
-       "type": "quantitative"
-      }
-    }
-  }
-
-  return (
-    <VegaLite data={ vegaData } spec={ spec } />
-  )
-}

apps/site/components/data-literate/Table.js

@@ -1,83 +0,0 @@
-import axios from 'axios'
-import React, { useEffect, useState } from 'react'
-
-const papa = require("papaparse")
-
-/*
-  Simple HTML Table
-  usage: <OutTable data={data} cols={cols} />
-    data:Array<Array<any> >;
-    cols:Array<{name:string, key:number|string}>;
-*/
-export default function Table({ data=[], cols=[], csv='', url='' }) {
-  if (csv) {
-    const out = parseCsv(csv)
-    data = out.rows
-    cols = out.cols
-  }
-
-	const [ourdata, setData] = React.useState(data)
-	const [ourcols, setCols] = React.useState(cols)
-	const [error, setError] = React.useState('')
-
-  useEffect(() => {
-    if (url) {
-      loadUrl(url)
-    }
-  }, [url])
-
-  function loadUrl(path) {
-    // HACK: duplicate of Excel code - maybe refactor
-    // if url is external may have CORS issue so we proxy it ...
-    if (url.startsWith('http')) {
-      const PROXY_URL = window.location.origin + '/api/proxy'
-      url = PROXY_URL + '?url=' + encodeURIComponent(url)
-    }
-    axios.get(url).then((res) => {
-      const { rows, fields } = parseCsv(res.data)      
-      setData(rows)
-      setCols(fields)
-    })
-  }
-
-	return (
-    <>
-      <SimpleTable data={ourdata} cols={ourcols} />
-    </>
-	)
-}
-
-/*
-  Simple HTML Table
-  usage: <OutTable data={data} cols={cols} />
-    data:Array<Array<any> >;
-    cols:Array<{name:string, key:number|string}>;
-*/
-function SimpleTable({ data=[], cols=[] }) {
-	return (
-		<div className="table-responsive">
-			<table className="table table-striped">
-				<thead>
-					<tr>{cols.map((c) => <th key={c.key}>{c.name}</th>)}</tr>
-				</thead>
-				<tbody>
-					{data.map((r,i) => <tr key={i}>
-						{cols.map(c => <td key={c.key}>{ r[c.key] }</td>)}
-					</tr>)}
-				</tbody>
-			</table>
-		</div>
-	)
-}
-
-function parseCsv(csv) {
-  csv = csv.trim()
-  const rawdata = papa.parse(csv, {header: true})
-  const cols = rawdata.meta.fields.map((r,i) => {
-    return { key: r, name: r }
-  })
-  return {
-    rows: rawdata.data,
-    fields: cols
-  }
-}

apps/site/index.d.ts

@@ -1,6 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-declare module '*.svg' {
-  const content: any;
-  export const ReactComponent: any;
-  export default content;
-}

apps/site/jest.config.ts

@@ -1,11 +0,0 @@
-/* eslint-disable */
-export default {
-  displayName: 'site',
-  preset: '../../jest.preset.js',
-  transform: {
-    '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': '@nrwl/react/plugins/jest',
-    '^.+\\.[tj]sx?$': ['babel-jest', { presets: ['@nrwl/next/babel'] }],
-  },
-  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
-  coverageDirectory: '../../coverage/apps/site',
-};

apps/site/lib/markdown.js

@@ -1,33 +0,0 @@
-import matter from 'gray-matter'
-import toc from 'remark-toc'
-import slug from 'remark-slug'
-import gfm from 'remark-gfm'
-import footnotes from 'remark-footnotes'
-
-import { serialize } from 'next-mdx-remote/serialize'
-
-/**
- * Parse a markdown or MDX file to an MDX source form + front matter data
- *
- * @source: the contents of a markdown or mdx file
- * @returns: { mdxSource: mdxSource, frontMatter: ...}
- */
-const parse = async function(source) {
-  const { content, data } = matter(source)
-
-  const mdxSource = await serialize(content, {
-    // Optionally pass remark/rehype plugins
-    mdxOptions: {
-      remarkPlugins: [gfm, toc, slug, footnotes],
-      rehypePlugins: [],
-    },
-    scope: data,
-  })
-
-  return {
-    mdxSource: mdxSource,
-    frontMatter: data
-  }
-}
-
-export default parse

apps/site/next.config.js

@@ -1,17 +0,0 @@
-//@ts-check
-
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const { withNx } = require('@nrwl/next/plugins/with-nx');
-
-/**
- * @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
- **/
-const nextConfig = {
-  nx: {
-    // Set this to true if you would like to use SVGR
-    // See: https://github.com/gregberge/svgr
-    svgr: false,
-  },
-};
-
-module.exports = withNx(nextConfig);

apps/site/postcss.config.js

@@ -1,15 +0,0 @@
-const { join } = require('path');
-
-// Note: If you use library-specific PostCSS/Tailwind configuration then you should remove the `postcssConfig` build
-// option from your application's configuration (i.e. project.json).
-//
-// See: https://nx.dev/guides/using-tailwind-css-in-react#step-4:-applying-configuration-to-libraries
-
-module.exports = {
-  plugins: {
-    tailwindcss: {
-      config: join(__dirname, 'tailwind.config.js'),
-    },
-    autoprefixer: {},
-  },
-};

apps/site/project.json

@@ -1,69 +0,0 @@
-{
-  "name": "site",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "apps/site",
-  "projectType": "application",
-  "targets": {
-    "build": {
-      "executor": "@nrwl/next:build",
-      "outputs": ["{options.outputPath}"],
-      "defaultConfiguration": "production",
-      "options": {
-        "root": "apps/site",
-        "outputPath": "dist/apps/site"
-      },
-      "configurations": {
-        "development": {
-          "outputPath": "apps/site"
-        },
-        "production": {}
-      }
-    },
-    "serve": {
-      "executor": "@nrwl/next:server",
-      "defaultConfiguration": "development",
-      "options": {
-        "buildTarget": "site:build",
-        "dev": true
-      },
-      "configurations": {
-        "development": {
-          "buildTarget": "site:build:development",
-          "dev": true
-        },
-        "production": {
-          "buildTarget": "site:build:production",
-          "dev": false
-        }
-      }
-    },
-    "export": {
-      "executor": "@nrwl/next:export",
-      "options": {
-        "buildTarget": "site:build:production"
-      }
-    },
-    "test": {
-      "executor": "@nrwl/jest:jest",
-      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
-      "options": {
-        "jestConfig": "apps/site/jest.config.ts",
-        "passWithNoTests": true
-      },
-      "configurations": {
-        "ci": {
-          "ci": true,
-          "codeCoverage": true
-        }
-      }
-    },
-    "lint": {
-      "executor": "@nrwl/linter:eslint",
-      "outputs": ["{options.outputFile}"],
-      "options": {
-        "lintFilePatterns": ["apps/site/**/*.{ts,tsx,js,jsx}"]
-      }
-    }
-  },
-  "tags": []
-}

apps/site/specs/index.spec.tsx

@@ -1,11 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-
-import Index from '../pages/index';
-
-describe('Index', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Index />);
-    expect(baseElement).toBeTruthy();
-  });
-});

apps/site/tsconfig.spec.json

@@ -1,21 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "module": "commonjs",
-    "types": ["jest", "node"],
-    "jsx": "react"
-  },
-  "include": [
-    "jest.config.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.ts",
-    "src/**/*.test.tsx",
-    "src/**/*.spec.tsx",
-    "src/**/*.test.js",
-    "src/**/*.spec.js",
-    "src/**/*.test.jsx",
-    "src/**/*.spec.jsx",
-    "src/**/*.d.ts"
-  ]
-}

site/.gitignore

@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
+
+# markdowndb
+markdown.db

site/components/Nav.js

@@ -1,7 +1,7 @@
 import { Fragment } from "react";
 import { Disclosure, Menu, Transition } from "@headlessui/react";
+import { BellIcon, MenuIcon, XIcon } from "@heroicons/react/outline";
 import { siteConfig } from "config/siteConfig";
-import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
 
 import Link from "next/link";
 import GitHubButton from "react-next-github-btn";
@@ -24,9 +24,9 @@ export default function Nav() {
                 <Disclosure.Button className="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white">
                   <span className="sr-only">Open main menu</span>
                   {open ? (
-                    <Bars3Icon className="block h-6 w-6" aria-hidden="true" />
+                    <XIcon className="block h-6 w-6" aria-hidden="true" />
                   ) : (
-                    <XMarkIcon className="block h-6 w-6" aria-hidden="true" />
+                    <MenuIcon className="block h-6 w-6" aria-hidden="true" />
                   )}
                 </Disclosure.Button>
               </div>

site/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "docs",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "@flowershow/core": "^0.4.9",
+    "@flowershow/markdowndb": "^0.1.0",
+    "@flowershow/remark-callouts": "^1.0.0",
+    "@flowershow/remark-embed": "^1.0.0",
+    "@flowershow/remark-wiki-link": "^1.0.1",
+    "@headlessui/react": "^1.3.0",
+    "@heroicons/react": "^1.0.3",
+    "@mdx-js/loader": "^1.6.22",
+    "@tailwindcss/typography": "^0.4.0",
+    "autoprefixer": "^10.0.4",
+    "frictionless.js": "^0.13.4",
+    "gray-matter": "^4.0.3",
+    "hastscript": "^7.2.0",
+    "next": "^13.2.1",
+    "next-mdx-remote": "^4.4.1",
+    "next-seo": "^5.15.0",
+    "next-themes": "^0.2.1",
+    "papaparse": "^5.3.1",
+    "postcss": "^8.2.10",
+    "prop-types": "^15.7.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-next-github-btn": "^1.2.1",
+    "react-vega": "^7.4.4",
+    "rehype-autolink-headings": "^6.1.1",
+    "rehype-katex": "^6.0.2",
+    "rehype-prism-plus": "^1.5.1",
+    "rehype-slug": "^5.1.0",
+    "remark": "^13.0.0",
+    "remark-footnotes": "^3.0.0",
+    "remark-gfm": "^1.0.0",
+    "remark-html": "^13.0.2",
+    "remark-math": "^5.1.1",
+    "remark-slug": "^6.1.0",
+    "remark-smartypants": "^2.0.0",
+    "remark-toc": "^7.2.0",
+    "tailwindcss": "^2.2.16",
+    "vega": "^5.20.2",
+    "vega-lite": "^5.1.0",
+    "xlsx": "^0.17.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.4"
+  }
+}

site/postcss.config.js

@@ -0,0 +1,8 @@
+// If you want to use other PostCSS plugins, see the following:
+// https://tailwindcss.com/docs/using-with-preprocessors
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

site/tailwind.config.js

@@ -1,15 +1,17 @@
 const defaultTheme = require("tailwindcss/defaultTheme");
-const { createGlobPatternsForDependencies } = require('@nrwl/react/tailwind');
-const { join } = require('path');
 
-/** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: [
+  mode: 'jit',
-    join(
+  // purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
-      __dirname,
+  purge: [
-      '{src,pages,components}/**/*!(*.stories|*.spec).{ts,tsx,html,js,jsx}'
+    "./pages/**/*.js",
-    ),
+    "./pages/**/*.ts",
-    ...createGlobPatternsForDependencies(__dirname),
+    "./pages/**/*.jsx",
+    "./pages/**/*.tsx",
+    "./components/**/*.js",
+    "./components/**/*.ts",
+    "./components/**/*.jsx",
+    "./components/**/*.tsx"
   ],
   darkMode: false, // or 'media' or 'class'
   theme: {
@@ -28,4 +30,4 @@ module.exports = {
   plugins: [
     require('@tailwindcss/typography'),
   ],
-};
+}