alexwilson · alexwilson · Aug 5, 2020 · Aug 6, 2020 · alexwilson · Mar 26, 2021
@@ -0,0 +1,27 @@
+{
+  "name": "@alexwilson/worker-activity-page",
+  "private": true,
+  "version": "0.0.1",
+  "description": "Activity statistics",
+  "main": "index.js",
+  "author": "Alex Wilson <[email protected]>",
+  "license": "ISC",
+  "scripts": {
+    "deploy": "wrangler publish"
+  },
+  "devDependencies": {
+    "@cloudflare/workers-types": "^2.0.0",
+    "@cloudflare/wrangler": "^1.9.1",
+    "@types/react": "^16.9.44",
+    "@types/react-dom": "^16.9.8",
+    "jest": "^26.2.2",
+    "ts-jest": "^26.1.4",
+    "ts-loader": "^8.0.2",
+    "ts-node": "^8.10.2",
+    "typescript": "^3.9.7"
+  },
+  "dependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
+  }
+}
@@ -0,0 +1,18 @@
+import React from "react"
+
+import Layout from "./layout"
+
+export const ActivityPage = ({activities}: any) => {
+    return <Layout title="Activity">
+        {activities.map((activity: any) => (
+            <React.Fragment key={activity.attribute}>
+                <h2>{activity.label}</h2>
+                <ul>{activity.values.map((value: any) => (
+                    <li key={value.date}>{`${value.date}: ${value.value}`}</li>
+                ))}</ul>
+            </React.Fragment>
+        ))}
+    </Layout>
+}
+
+export default ActivityPage
@@ -0,0 +1,11 @@
+import React from "react"
+
+import Layout from "./layout"
+
+export const ErrorPage = () => {
+    return <Layout title="Error!">
+        <h1>An error occurred!</h1>
+    </Layout>
+}
+
+export default ErrorPage
@@ -0,0 +1,12 @@
+import React from "react"
+
+export const Layout = (props: any) => {
+    return <html>
+        <head>
+            <title>{props.title}</title>
+        </head>
+        <body>{props.children}</body>
+    </html>
+}
+
+export default Layout
@@ -0,0 +1,40 @@
+import {ActivityPage} from "../components/activity-page" 
-import {ActivityPage} from "../components/activity-page" 
+import {ActivityPage} from "../components/activity-page"; 
-import {ActivityPage} from "../components/activity-page" 
+import {ActivityPage} from "../components/activity-page"; 
+import {ErrorPage} from "../components/error-page"
+
+export default class Activity {
+
+    private _existToken: string;
+
+    constructor(existToken: string) {
+        this._existToken = existToken;
+    }
+
+
+    async getActivity() {
+        const query = [
+            'attributes=events,commits,tweets',
+            'limit=31'
+        ]
+
+        try {
+            const activities = await fetch(`https://exist.io/api/1/users/$self/attributes/?${query.join('&')}`, {
+                method: "GET",
+                headers: {
+                    "Authorization": `Token ${this._existToken}`,
+                    "Content-Type": "application/json"
+                }
+            }).then(res => res.json())
-            }).then(res => res.json())
+            }).then((res) => res.json())
-            }).then(res => res.json())
+            }).then((res) => res.json())
+
+            return {
+                status: 200,
+                view: ActivityPage({ activities })
+            }
+        } catch(e) {
+            return {
+                status: 503,
+                view: ErrorPage()
+            }
+        }
+
+    }
+}
@@ -0,0 +1,23 @@
+import {renderToString} from "react-dom/server"
+import ActivityController from "./controllers/activity"
+
+const renderToDocument = (component: React.ReactElement): string => `<!DOCTYPE html>${renderToString(component)}`
+
+
+//@ts-ignore
+const activityController = new ActivityController(EXISTIO_TOKEN)
+self.addEventListener("fetch", (event) => {
+  event.respondWith(new Promise(async (resolve) => {
+
+    const result = await activityController.getActivity()
+    resolve(new Response(renderToDocument(result.view), {
+      status: result.status,
+      statusText: "OK",
+      headers: {
+        'content-type': 'text/html'
-        'content-type': 'text/html'
+        "content-type": 'text/html'
-        'content-type': 'text/html'
+        "content-type": 'text/html'
+      }
+    }))
+
+  }));
+});
+
@@ -0,0 +1,17 @@
+import React from "react"
+
+export const Layout = (props: any) => {
+    return <html>
+        <head>
+            <title>{props.title}</title>
+        </head>
+        <body>{props.children}</body>
+    </html>
+}
+
+export const TestPage = () => {
+    return <Layout title="test">
+        <div>Activity</div>
+    </Layout>
+}
+
@@ -0,0 +1,25 @@
+{
+    "compilerOptions": {
+      "outDir": "./dist",
+      "module": "commonjs",
+      "target": "esnext",
+      "lib": ["esnext", "webworker"],
+      "jsx": "react",
+      "alwaysStrict": true,
+      "strict": true,
+      "preserveConstEnums": true,
+      "moduleResolution": "node",
+      "sourceMap": true,
+      "esModuleInterop": true,
+      "types": ["@cloudflare/workers-types"]
+    },
+    "include": [
+      "./src/*.ts",
+      "./test/*.ts",
+      "./src/**/*.ts",
+      "./test/**/*.ts",
+      "./node_modules/@cloudflare/workers-types/index.d.ts"
+    ],
+    "exclude": ["node_modules/", "dist/"]
+  }
+
@@ -0,0 +1,16 @@
+module.exports = {
+    target: "webworker",
+    resolve: {
+        extensions: ['.ts', '.tsx', '.js', '.json']
-        extensions: ['.ts', '.tsx', '.js', '.json']
+        extensions: [".ts", '.tsx', '.js', '.json']
-        extensions: ['.ts', '.tsx', '.js', '.json']
+        extensions: [".ts", '.tsx', '.js', '.json']
+    },
+    entry: {
+        main: "./src/index.ts"
+    },
+    module: {
+        rules: [{
+            test: /\.tsx?$/,
+            use: 'ts-loader',
+            exclude: /node_modules/,
+        }]
+    }
+}
@@ -0,0 +1,4 @@
+name = "activity"
+type = "webpack"
+routes = ["https://alexwilson.tech/activity"]
+webpack_config = "webpack.config.js"