From c29ef762b35dfe989a51786eef87d49a0086d369 Mon Sep 17 00:00:00 2001
From: Puria Nafisi Azizi
Date: Wed, 15 Feb 2023 11:21:20 +0100
Subject: [PATCH] Add a super nice UI to mock the FABACCESS commands
---
fabaccess-mock/.eslintrc.json | 3 +
fabaccess-mock/.gitignore | 36 +
fabaccess-mock/README.md | 38 +
fabaccess-mock/crypto | 1 +
fabaccess-mock/next.config.js | 6 +
fabaccess-mock/package.json | 24 +
fabaccess-mock/pages/_app.tsx | 6 +
fabaccess-mock/pages/_document.tsx | 13 +
fabaccess-mock/pages/api/off.ts | 44 +
fabaccess-mock/pages/api/on.ts | 44 +
fabaccess-mock/pages/index.tsx | 69 +
fabaccess-mock/pnpm-lock.yaml | 2168 +++++++++++++++++++++++++
fabaccess-mock/public/favicon.ico | Bin 0 -> 25931 bytes
fabaccess-mock/public/next.svg | 1 +
fabaccess-mock/public/thirteen.svg | 1 +
fabaccess-mock/public/vercel.svg | 1 +
fabaccess-mock/styles/Home.module.css | 285 ++++
fabaccess-mock/styles/globals.css | 107 ++
fabaccess-mock/tsconfig.json | 24 +
19 files changed, 2871 insertions(+)
create mode 100644 fabaccess-mock/.eslintrc.json
create mode 100644 fabaccess-mock/.gitignore
create mode 100644 fabaccess-mock/README.md
create mode 120000 fabaccess-mock/crypto
create mode 100644 fabaccess-mock/next.config.js
create mode 100644 fabaccess-mock/package.json
create mode 100644 fabaccess-mock/pages/_app.tsx
create mode 100644 fabaccess-mock/pages/_document.tsx
create mode 100644 fabaccess-mock/pages/api/off.ts
create mode 100644 fabaccess-mock/pages/api/on.ts
create mode 100644 fabaccess-mock/pages/index.tsx
create mode 100644 fabaccess-mock/pnpm-lock.yaml
create mode 100644 fabaccess-mock/public/favicon.ico
create mode 100644 fabaccess-mock/public/next.svg
create mode 100644 fabaccess-mock/public/thirteen.svg
create mode 100644 fabaccess-mock/public/vercel.svg
create mode 100644 fabaccess-mock/styles/Home.module.css
create mode 100644 fabaccess-mock/styles/globals.css
create mode 100644 fabaccess-mock/tsconfig.json
diff --git a/fabaccess-mock/.eslintrc.json b/fabaccess-mock/.eslintrc.json
new file mode 100644
index 0000000..bffb357
--- /dev/null
+++ b/fabaccess-mock/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+ "extends": "next/core-web-vitals"
+}
diff --git a/fabaccess-mock/.gitignore b/fabaccess-mock/.gitignore
new file mode 100644
index 0000000..c87c9b3
--- /dev/null
+++ b/fabaccess-mock/.gitignore
@@ -0,0 +1,36 @@
+# 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*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
diff --git a/fabaccess-mock/README.md b/fabaccess-mock/README.md
new file mode 100644
index 0000000..965a122
--- /dev/null
+++ b/fabaccess-mock/README.md
@@ -0,0 +1,38 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+
+[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+
+The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
diff --git a/fabaccess-mock/crypto b/fabaccess-mock/crypto
new file mode 120000
index 0000000..d1570f1
--- /dev/null
+++ b/fabaccess-mock/crypto
@@ -0,0 +1 @@
+../zenflows-crypto/
\ No newline at end of file
diff --git a/fabaccess-mock/next.config.js b/fabaccess-mock/next.config.js
new file mode 100644
index 0000000..a843cbe
--- /dev/null
+++ b/fabaccess-mock/next.config.js
@@ -0,0 +1,6 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+ reactStrictMode: true,
+}
+
+module.exports = nextConfig
diff --git a/fabaccess-mock/package.json b/fabaccess-mock/package.json
new file mode 100644
index 0000000..8a016e5
--- /dev/null
+++ b/fabaccess-mock/package.json
@@ -0,0 +1,24 @@
+{
+ "name": "fabaccess-mock",
+ "version": "0.1.0",
+ "private": true,
+ "scripts": {
+ "dev": "next dev",
+ "build": "next build",
+ "start": "next start",
+ "lint": "next lint"
+ },
+ "dependencies": {
+ "@next/font": "13.1.6",
+ "@types/node": "18.13.0",
+ "@types/react": "18.0.28",
+ "@types/react-dom": "18.0.11",
+ "eslint": "8.34.0",
+ "eslint-config-next": "13.1.6",
+ "next": "13.1.6",
+ "react": "18.2.0",
+ "react-dom": "18.2.0",
+ "typescript": "4.9.5",
+ "zenroom": "^2.16.4"
+ }
+}
diff --git a/fabaccess-mock/pages/_app.tsx b/fabaccess-mock/pages/_app.tsx
new file mode 100644
index 0000000..021681f
--- /dev/null
+++ b/fabaccess-mock/pages/_app.tsx
@@ -0,0 +1,6 @@
+import '@/styles/globals.css'
+import type { AppProps } from 'next/app'
+
+export default function App({ Component, pageProps }: AppProps) {
+ return
+}
diff --git a/fabaccess-mock/pages/_document.tsx b/fabaccess-mock/pages/_document.tsx
new file mode 100644
index 0000000..54e8bf3
--- /dev/null
+++ b/fabaccess-mock/pages/_document.tsx
@@ -0,0 +1,13 @@
+import { Html, Head, Main, NextScript } from 'next/document'
+
+export default function Document() {
+ return (
+
+
+
+
+
+
+
+ )
+}
diff --git a/fabaccess-mock/pages/api/off.ts b/fabaccess-mock/pages/api/off.ts
new file mode 100644
index 0000000..358e7d2
--- /dev/null
+++ b/fabaccess-mock/pages/api/off.ts
@@ -0,0 +1,44 @@
+import type { NextApiRequest, NextApiResponse } from "next";
+import { zencode_exec } from "zenroom";
+import fabaccessCmd from "../../crypto/src/sign_fabaccess_cmd";
+
+type Data = {
+ result: string;
+ query: string;
+};
+
+export default function handler(
+ req: NextApiRequest,
+ res: NextApiResponse
+) {
+ const input = {
+ command: "OFF",
+ service: "urn:fabaccess:resource:Another",
+ timestamp: new Date().getTime().toString().slice(0, -3),
+ token: "bm90LWltcGxlbWVudGVk",
+ keyring: {
+ eddsa: "Cwj9CcqHNoBnXBo8iDfnhFkQeDun4Y4LStd2m3TEAYAg",
+ },
+ };
+ const contract = fabaccessCmd();
+ const pk = zencode_exec(contract, { keys: JSON.stringify(input) }).then(
+ async (r) => {
+ console.log("SENDIND TO FABACCESS", r.result);
+ const resp = await fetch(
+ "https://fabaccess.interfacer.dyne.org/command",
+ {
+ method: "post",
+ headers: {
+ Accept: "application/json",
+ "Content-Type": "application/json",
+ },
+
+ //make sure to serialize your JSON body
+ body: r.result,
+ }
+ );
+ const result = await resp.json();
+ res.status(200).json({ result: result, query: JSON.parse(r.result) });
+ }
+ );
+}
diff --git a/fabaccess-mock/pages/api/on.ts b/fabaccess-mock/pages/api/on.ts
new file mode 100644
index 0000000..413afec
--- /dev/null
+++ b/fabaccess-mock/pages/api/on.ts
@@ -0,0 +1,44 @@
+import type { NextApiRequest, NextApiResponse } from "next";
+import { zencode_exec } from "zenroom";
+import fabaccessCmd from "../../crypto/src/sign_fabaccess_cmd";
+
+type Data = {
+ result: string;
+ query: string;
+};
+
+export default function handler(
+ req: NextApiRequest,
+ res: NextApiResponse
+) {
+ const input = {
+ command: "ON",
+ service: "urn:fabaccess:resource:Another",
+ timestamp: new Date().getTime().toString().slice(0, -3),
+ token: "bm90LWltcGxlbWVudGVk",
+ keyring: {
+ eddsa: "Cwj9CcqHNoBnXBo8iDfnhFkQeDun4Y4LStd2m3TEAYAg",
+ },
+ };
+ const contract = fabaccessCmd();
+ const pk = zencode_exec(contract, { keys: JSON.stringify(input) }).then(
+ async (r) => {
+ console.log("SENDIND TO FABACCESS", r.result);
+ const resp = await fetch(
+ "https://fabaccess.interfacer.dyne.org/command",
+ {
+ method: "post",
+ headers: {
+ Accept: "application/json",
+ "Content-Type": "application/json",
+ },
+
+ //make sure to serialize your JSON body
+ body: r.result,
+ }
+ );
+ const result = await resp.json();
+ res.status(200).json({ result: result, query: JSON.parse(r.result) });
+ }
+ );
+}
diff --git a/fabaccess-mock/pages/index.tsx b/fabaccess-mock/pages/index.tsx
new file mode 100644
index 0000000..d9352f5
--- /dev/null
+++ b/fabaccess-mock/pages/index.tsx
@@ -0,0 +1,69 @@
+import Head from "next/head";
+import { Inter } from "@next/font/google";
+import styles from "@/styles/Home.module.css";
+import { useState } from "react";
+
+const inter = Inter({ subsets: ["latin"] });
+type TS = {
+ timestamp: string;
+ state: string;
+ result: string;
+};
+export default function Home() {
+ const [message, setMessage] = useState("");
+ const [on, setOn] = useState(false);
+ const [logs, setLogs] = useState([]);
+
+ return (
+ <>
+
+ Fabaccess Demo
+
+
+
+
+
+
+ {message}
+
+
LOG
+
+ {logs.map((l) => {
+ return (
+ -
+ {l.state} @{l.timestamp}
RESULT: {l.result}
+
+ );
+ })}
+
+