chore(website): add initial website (#1117)

.eslintignore

@@ -6,4 +6,5 @@ src/generators/template
 test/generators/template
 examples/integrate-with-react
 src/processors/TemplateInputProcessor.ts
-test/processors/TemplateInputProcessor.spec.ts
+test/processors/TemplateInputProcessor.spec.ts
+modelina-website

.github/workflows/lighthouserc.json

@@ -0,0 +1,26 @@
+{
+  "ci": {
+    "assert": {
+      "assertions": {
+        "categories:accessibility": [
+          "error",
+          {
+            "minScore": 0.70
+          }
+        ]
+      }
+    },
+    "collect": {
+      "settings": {
+        "skipAudits": [
+          "robots-txt",
+          "canonical",
+          "tap-targets",
+          "is-crawlable",
+          "works-offline",
+          "offline-start-url"
+        ]
+      }
+    }
+  }
+}

.github/workflows/website-deploy.yml

@@ -0,0 +1,17 @@
+
+name: Deploy to Netlify
+on:
+  issues:
+    types: [opened, deleted, closed, reopened, labeled, unlabeled]
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Trigger deploy on Netlify
+      run: |
+        curl -X POST "https://api.netlify.com/api/v1/sites/$NETLIFY_SITE_ID/builds" -H "Authorization: Bearer $NETLIFY_AUTH_TOKEN"
+      env:
+        NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+        NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}

.github/workflows/website-pr-testing.yml

@@ -0,0 +1,108 @@
+name: Test website
+
+on:
+  pull_request_target:
+    paths:
+      - 'modelina-website'
+      - 'netlify.toml'
+    branches:
+      - master
+    types: [opened, reopened, synchronize, ready_for_review]
+
+jobs:
+  lighthouse-ci:
+    name: Lighthouse CI
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 14
+          cache: 'npm'
+          cache-dependency-path: '**/package-lock.json'
+
+      - name: Modelina Core Install dependencies
+        id: first-installation-core
+        run: npm install --loglevel verbose
+        continue-on-error: true
+
+      - if: steps.first-installation-core.outputs.status == 'failure'
+        name: Modelina Core Clear NPM cache and install deps again
+        run: | 
+          npm cache clean --force
+          npm install --loglevel verbose
+
+      - name: Build Modelina
+        run: npm run build:prod
+
+      - name: Modelina Website Install dependencies
+        id: first-installation-website
+        run: cd modelina-website && npm install --loglevel verbose
+        continue-on-error: true
+
+      - if: steps.first-installation-website.outputs.status == 'failure'
+        name: Modelina Website Clear NPM cache and install deps again
+        run: | 
+          cd modelina-website && npm cache clean --force
+          cd modelina-website && npm install --loglevel verbose
+
+      - name: Lint Modelina website
+        run: cd modelina-website && npm run lint
+
+      - name: Build Modelina website
+        run: cd modelina-website && npm run build
+
+      - name: Await Netlify Preview
+        uses: jakepartusch/wait-for-netlify-action@v1
+        id: netlify
+        with:
+          site_name: modelina
+          max_timeout: 600
+
+      - name: Lighthouse Audit
+        id: lighthouse_audit
+        uses: treosh/[email protected]
+        with:
+          urls: |
+            https://deploy-preview-$PR_NUMBER--modelina.netlify.app/
+          configPath: ./.github/workflows/lighthouserc.json
+          uploadArtifacts: true
+          temporaryPublicStorage: true
+        env:
+          PR_NUMBER: ${{ github.event.pull_request.number}}
+
+      - name: Lighthouse Score Report
+        id: lighthouse_score_report
+        uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const result = ${{ steps.lighthouse_audit.outputs.manifest }}[0].summary
+            const links = ${{ steps.lighthouse_audit.outputs.links }}
+            const formatResult = (res) => Math.round((res * 100))
+            Object.keys(result).forEach(key => result[key] = formatResult(result[key]))
+            const score = res => res >= 90 ? '🟢' : res >= 50 ? '🟠' : '🔴'
+            const comment = [
+                `⚡️ [Lighthouse report](${Object.values(links)[0]}) for the changes in this PR:`,
+                '| Category | Score |',
+                '| --- | --- |',
+                `| ${score(result.performance)} Performance | ${result.performance} |`,
+                `| ${score(result.accessibility)} Accessibility | ${result.accessibility} |`,
+                `| ${score(result['best-practices'])} Best practices | ${result['best-practices']} |`,
+                `| ${score(result.seo)} SEO | ${result.seo} |`,
+                `| ${score(result.pwa)} PWA | ${result.pwa} |`,
+                ' ',
+                `*Lighthouse ran on [${Object.keys(links)[0]}](${Object.keys(links)[0]})*`
+            ].join('\n')
+             core.setOutput("comment", comment);
+      - name: LightHouse Statistic Comment
+        id: lighthouse_statistic_comment
+        uses: marocchino/[email protected]
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          number: ${{ github.event.pull_request.number }}
+          header: lighthouse
+          message: ${{ steps.lighthouse_score_report.outputs.comment }}

.prettierignore

@@ -0,0 +1,3 @@
+lib
+node_modules
+modelina-website

.sonarcloud.properties

@@ -1,2 +1,3 @@
 # Disable specific duplicate code since it would introduce more complexity to reduce it.
 sonar.cpd.exclusions=src/generators/**/*.ts
+sonar.exclusions=modelina-website/next.config.js

README.md

@@ -1,4 +1,4 @@
-[![AsyncAPI Modelina](./docs/img/readme-banner.png)](https://www.asyncapi.com/tools/modelina)
+[![AsyncAPI Modelina](./docs/img/readme-banner.png)](https://www.modelina.org)
 [![blackbox pipeline status](<https://img.shields.io/github/actions/workflow/status/asyncapi/modelina/blackbox-testing.yml?label=blackbox%20testing>)](https://github.com/asyncapi/modelina/actions/workflows/blackbox-testing.yml?query=branch%3Amaster++)
 [![Coverage Status](https://coveralls.io/repos/github/asyncapi/modelina/badge.svg?branch=master)](https://coveralls.io/github/asyncapi/modelina?branch=master)
 [![Project Status: Active – The project has reached a stable, usable state and is being actively developed.](https://www.repostatus.org/badges/latest/active.svg)](https://www.repostatus.org/#active)
@@ -7,7 +7,8 @@
 [![License](https://img.shields.io/github/license/asyncapi/modelina)](https://github.com/asyncapi/modelina/blob/master/LICENSE)
 [![last commit](https://img.shields.io/github/last-commit/asyncapi/modelina)](https://github.com/asyncapi/modelina/commits/master)
 [![Discussions](https://img.shields.io/github/discussions/asyncapi/modelina)](https://github.com/asyncapi/modelina/discussions)
-[![Playground](https://img.shields.io/website?label=playground&url=https%3A%2F%2Fwww.asyncapi.com%2Ftools%2Fmodelina)](https://www.asyncapi.com/tools/modelina) <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
+[![Website](https://img.shields.io/website?label=website&url=https%3A%2F%2Fwww.modelina.org)](https://www.modelina.org)
+[![Playground](https://img.shields.io/website?label=playground&url=https%3A%2F%2Fwww.modelina.org%2Fplayground)](https://www.modelina.org/playground) <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
 [![All Contributors](https://img.shields.io/badge/all_contributors-43-orange.svg?style=flat-square)](#contributors-)
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 

modelina-website/.env.local

@@ -0,0 +1 @@
+NEXT_PUBLIC_API_PATH=/api

modelina-website/.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+.next

modelina-website/.eslintrc

@@ -0,0 +1,12 @@
+{
+  "extends": [
+    "../.eslintrc",
+    "next"
+  ],
+  "rules": {
+    "@typescript-eslint/no-empty-interface": "off",
+    "no-console": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-empty-function": "off"
+  }
+}

modelina-website/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

modelina-website/.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*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+!.env.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

modelina-website/README.md

@@ -0,0 +1,19 @@
+# Modelina Website
+
+This website is a `Next` + TypeScript website.
+
+The website is being deployed to Netlify along side serverless functions.
+
+## How to run it
+It uses the local version of Modelina, which means that before you run the website, make sure you build Modelina through `npm run build:modelina`.
+
+## Playground
+
+Here is a quick overview of where some of the functions for rendering the playground work:
+
+- `/src/helpers/GeneratorCode` contains all the functions for creating the generator code, shown instead of the options.
+- `/src/pages/api/functions` contain all the individual generators that when the frontend calls the API `/api/generate` will perform the code generation with Modelina.
+- `src/components/playground/PlaygroundOptions.tsx` is the main component that renders the options based on which output is selected.
+- `src/components/playground/options` contain all the individual react components for showing the output options.
+- `src/components/playground/Playground.tsx` is the main playground component, and is the one rendered by the playground page.
+- `src/components/playground/GeneratedModels.tsx` is the playground component responsible for rendering the generated models.

modelina-website/next.config.js

@@ -0,0 +1,18 @@
+const isGithubActions = process.env.GITHUB_ACTIONS || false;
+
+let assetPrefix = '/';
+let basePath = '';
+
+if (isGithubActions) {
+  const repo = process.env.GITHUB_REPOSITORY.replace(/.*?\//, '');
+  assetPrefix = `/${repo}/`;
+  basePath = `/${repo}`;
+}
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  assetPrefix: assetPrefix,
+  basePath: basePath
+}
+
+module.exports = nextConfig