Working on kdot-web

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 tmp
 .env
+.next

apps/kdot-web/LICENSE

@@ -0,0 +1,35 @@
+Copyright Ian Walter <[email protected]> (https://ianwalter.dev)
+
+Licensed under the Apache License, Version 2.0 (the "License") modified with
+Commons Clause Restriction; you may not use this file except in compliance with
+the License. You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed
+under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
+CONDITIONS OF ANY KIND, either express or implied. See the License for the
+specific language governing permissions and limitations under the License.
+
+"Commons Clause" License Condition v1.0
+
+The Software is provided to you by the Licensor under the License, as defined
+below, subject to the following condition.
+
+Without limiting other conditions in the License, the grant of rights under the
+License will not include, and the License does not grant to you, the right to
+Sell the Software.
+
+For purposes of the foregoing, "Sell" means practicing any or all of the rights
+granted to you under the License to provide to third parties, for a fee or other
+consideration (including without limitation fees for hosting or
+consulting/support services related to the Software), a product or service whose
+value derives, entirely or substantially, from the functionality of the
+Software. Any license notice or attribution required by the License must also
+include this Commons Clause License Condition notice.
+
+Software: kdot-web
+
+License: Apache 2.0
+
+Licensor: Ian Walter

apps/kdot-web/api/index.mjs

@@ -0,0 +1,10 @@
+import nrg from '@ianwalter/nrg'
+import dashboard from './middleware/dashboard.js'
+
+const app = nrg.createApp({
+  next: { enabled: true }
+})
+
+app.get('/api/dashboard', dashboard)
+
+export default app

apps/kdot-web/api/middleware/dashboard.js

@@ -0,0 +1,6 @@
+import { kc } from '@generates/kdot'
+
+
+export default async function dashboard (ctx) {
+
+}

apps/kdot-web/components/Header.js

@@ -0,0 +1,9 @@
+export default function Header () {
+  return (
+    <header className="my-5">
+      <h1 className="text-2xl font-medium">
+        kdot
+      </h1>
+    </header>
+  )
+}

apps/kdot-web/components/StackedPage.js

@@ -0,0 +1,17 @@
+import Header from './Header.js'
+
+export default function StackedPage (props) {
+  return (
+    <div className={`
+      flex flex-col min-h-screen bg-gray-100 dark:bg-gray-800 dark:text-gray-100
+    `}>
+      <div className="container mx-auto px-5">
+
+        <Header />
+
+        {props.children}
+
+      </div>
+    </div>
+  )
+}

apps/kdot-web/components/Stats.js

@@ -0,0 +1,38 @@
+const stats = [
+  { name: 'Pods', stat: '12' },
+  { name: 'CPU', stat: '58.16%' },
+  { name: 'Memory', stat: '24.57%' }
+]
+
+export default function Stats () {
+  return (
+    <dl className={`
+      mt-5 grid grid-cols-1 rounded-lg bg-white dark:bg-gray-700
+      overflow-hidden shadow divide-y divide-gray-200 dark:divide-gray-800
+      md:grid-cols-3 md:divide-y-0 md:divide-x
+    `}>
+      {stats.map(item => (
+        <div key={item.name} className="px-4 py-5 sm:p-6">
+
+          <dt className={`
+            text-base font-normal text-gray-900 dark:text-gray-300
+          `}>
+            {item.name}
+          </dt>
+
+          <dd className={`
+            mt-1 flex justify-between items-baseline md:block lg:flex
+          `}>
+            <div className={`
+              flex items-baseline text-2xl font-semibold text-indigo-600
+              dark:text-blue-400
+            `}>
+              {item.stat}
+            </div>
+          </dd>
+
+        </div>
+      ))}
+    </dl>
+  )
+}

apps/kdot-web/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "kdot-web",
+  "version": "0.0.0",
+  "license": "SEE LICENSE IN LICENSE",
+  "scripts": {
+    "dev": "next dev --hostname 0.0.0.0 --port ${PORT:-3004}",
+    "build": "next build",
+    "start": "next start --hostname 0.0.0.0 --port ${PORT:-3004}"
+  },
+  "dependencies": {
+    "@generates/kdot": "^0.1.3",
+    "@ianwalter/nrg": "^0.20.5",
+    "autoprefixer": "^10.2.5",
+    "next": "^10.2.0",
+    "postcss": "^8.2.13",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "tailwindcss": "^2.1.2"
+  }
+}

apps/kdot-web/pages/_app.js

@@ -0,0 +1,5 @@
+import 'tailwindcss/tailwind.css'
+
+export default function KdotWeb ({ Component, pageProps }) {
+  return <Component {...pageProps} />
+}

apps/kdot-web/pages/api/[...path].js

@@ -0,0 +1,4 @@
+import api from '../../api/index.mjs'
+
+// Use the app callback as the "handler".
+export default api.callback()

apps/kdot-web/pages/index.js

@@ -0,0 +1,14 @@
+import StackedPage from '../components/StackedPage.js'
+import Stats from '../components/Stats.js'
+
+export default function Dashboard () {
+  return (
+    <StackedPage>
+
+      <div className="mt-8">
+        <Stats />
+      </div>
+
+    </StackedPage>
+  )
+}

apps/kdot-web/postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {}
+  }
+}

apps/kdot-web/tailwind.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  mode: 'jit',
+  purge: [
+    './pages/**/*.js',
+    './components/**/*.js'
+  ],
+  darkMode: 'media',
+  theme: {
+    extend: {}
+  },
+  variants: {
+    extend: {}
+  },
+  plugins: []
+}