init webapp

webapp/.env.development

@@ -0,0 +1,3 @@
+NODE_ENV=development
+VITE_API_HTTP=http://localhost:3000/graphql
+VITE_API_WS=ws://localhost:3000/graphql

webapp/.eslintrc-auto-import.json

@@ -0,0 +1,71 @@
+{
+  "globals": {
+    "Component": true,
+    "ComponentPublicInstance": true,
+    "ComputedRef": true,
+    "EffectScope": true,
+    "InjectionKey": true,
+    "PropType": true,
+    "Ref": true,
+    "VNode": true,
+    "WritableComputedRef": true,
+    "computed": true,
+    "createApp": true,
+    "customRef": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "effectScope": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "h": true,
+    "inject": true,
+    "isProxy": true,
+    "isReactive": true,
+    "isReadonly": true,
+    "isRef": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "provide": true,
+    "reactive": true,
+    "readonly": true,
+    "ref": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "toRaw": true,
+    "toRef": true,
+    "toRefs": true,
+    "toValue": true,
+    "triggerRef": true,
+    "unref": true,
+    "useAttrs": true,
+    "useCssModule": true,
+    "useCssVars": true,
+    "useDialog": true,
+    "useLoadingBar": true,
+    "useMessage": true,
+    "useNotification": true,
+    "useSlots": true,
+    "watch": true,
+    "watchEffect": true,
+    "watchPostEffect": true,
+    "watchSyncEffect": true,
+    "ExtractDefaultPropTypes": true,
+    "ExtractPropTypes": true,
+    "ExtractPublicPropTypes": true
+  }
+}

webapp/.eslintrc.cjs

@@ -0,0 +1,73 @@
+/* eslint-env node */
+module.exports = {
+  root: true,
+  env: { node: true, es2022: true },
+  plugins: ["prettier"],
+  extends: [
+    "plugin:vue/vue3-strongly-recommended",
+    "eslint:recommended",
+    "./.eslintrc-auto-import.json",
+    "plugin:prettier/recommended"
+  ],
+  parserOptions: { ecmaVersion: "latest" },
+  overrides: [
+    {
+      files: ["*.graphql", "*.gql"],
+      parser: "@graphql-eslint/eslint-plugin",
+      plugins: ["@graphql-eslint"],
+      rules: { "@graphql-eslint/no-duplicate-fields": "error" }
+    }
+  ],
+  rules: {
+    "prettier/prettier": [
+      "warn",
+      { trailingComma: "none", arrowParens: "avoid" }
+    ],
+    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "no-setter-return": "off",
+    "no-empty": ["error", { allowEmptyCatch: true }],
+
+    "vue/multi-word-component-names": "off",
+    "vue/no-reserved-component-names": "off",
+    "vue/max-attributes-per-line": "off",
+    "vue/no-template-shadow": "off",
+    "vue/one-component-per-file": "off",
+    "vue/require-explicit-emits": "off",
+    "vue/singleline-html-element-content-newline": "off",
+    "vue/require-default-prop": "off",
+    "vue/v-on-event-hyphenation": ["error", "never"],
+    "vue/component-tags-order": [
+      "warn",
+      { order: ["template", "script", "style"] }
+    ],
+    "vue/no-lone-template": "warn",
+    "vue/order-in-components": "warn",
+    "vue/this-in-template": "error",
+    "vue/block-tag-newline": "warn",
+    "vue/component-name-in-template-casing": [
+      "warn",
+      "PascalCase",
+      {
+        registeredComponentsOnly: false,
+        ignores: ["component", "transition", "fa"]
+      }
+    ],
+    "vue/component-options-name-casing": "warn",
+    "vue/custom-event-name-casing": "error",
+    "vue/no-empty-component-block": "warn",
+    "vue/no-ref-object-destructure": "error",
+    "vue/no-required-prop-with-default": "warn",
+    "vue/no-template-target-blank": "error",
+    "vue/no-this-in-before-route-enter": "error",
+    "vue/no-unsupported-features": ["error", { version: "^3.2.37" }],
+    "vue/no-unused-properties": "warn",
+    "vue/no-unused-refs": "warn",
+    "vue/no-useless-mustaches": "warn",
+    "vue/no-useless-v-bind": "warn",
+    "vue/padding-line-between-blocks": "warn",
+    "vue/prefer-separate-static-class": "error",
+    "vue/prefer-true-attribute-shorthand": "warn",
+    "vue/v-for-delimiter-style": "warn"
+  }
+};

webapp/.gitignore

@@ -0,0 +1,29 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+dist
+dist-ssr
+coverage
+*.local
+.env.production
+
+/cypress/videos/
+/cypress/screenshots/
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

webapp/README.md

@@ -0,0 +1,115 @@
+# <img alt="logo" src="./public/url-checker.png" align="left" height="38" /> URL Checker
+
+Webapp for URL Checker, a tool to easily check URLs in a sitemap.
+
+## Configuration
+
+There is a `.env` file per environnement which is used only to define API URL.
+So just copy `.env.development` to `.env.production` and set `VITE_API_*` according to your setup.
+
+For example:
+
+```env
+VITE_API_HTTP=http://url-checker.example.com/graphql
+VITE_API_WS=ws://url-checker.example.com/graphql
+```
+
+## Install dependencies for Production
+
+Once placed in the `webapp` directory:
+```sh
+pnpm i -P
+```
+
+## Compile and Minify for Production
+
+```sh
+pnpm build
+```
+
+This will produce a "build" in the `dist` folder.
+⚠️ Use this `dist` folder as the `DocumentRoot` for the next step.
+
+## Setup with Apache web server
+
+This is a configuration example using a single vhost for API & Webapp:
+
+```apache
+<VirtualHost *:80>
+    DocumentRoot "/srv/http/url-checker.example.com/www"
+    ServerName url-checker.example.com
+
+    <Directory "/srv/http/url-checker.example.com/www">
+        AllowOverride none
+        Require all granted
+
+        RewriteEngine On
+        RewriteBase /
+
+        RewriteRule ^index\.html$ - [L]
+        RewriteCond %{REQUEST_FILENAME} !-f
+        RewriteCond %{REQUEST_FILENAME} !-d
+        RewriteRule . /index.html [L]
+    </Directory>
+
+    <IfModule dir_module>
+        DirectoryIndex index.html
+    </IfModule>
+
+    ProxyPass /graphql http://localhost:3000/graphql
+    ProxyPassReverse /graphql http:/localhost:3000/graphql
+
+    RewriteEngine On
+    RewriteCond %{HTTP:Upgrade} websocket [NC]
+    RewriteCond %{HTTP:Connection} upgrade [NC]
+    RewriteRule ^/graphql "ws://localhost:3000/graphql" [P,L]
+
+    ErrorLog "/srv/http/url-checker.example.com/log/httpd-error.log"
+    CustomLog "/srv/http/url-checker.example.com/log/httpd-access.log" common
+</VirtualHost>
+```
+
+ℹ️ Basically, it's a [regular SPA webapp](https://developer.mozilla.org/en-US/docs/Glossary/SPA) using [Vite bundler](https://vitejs.dev) so you can serve it with any web server of your choice ([Apache](https://httpd.apache.org), [Nginx](https://www.nginx.com)...). Also, you are not forced to use a `vhost` if only URL Checker is served by your web server.
+
+## Upgrade
+
+The simplest way to upgrade the webapp is using the following `git` commands in the monorepo directory (where `.git` stands):
+
+```sh
+git fetch
+git reset --hard origin/master
+```
+
+Then redo the [Install dependencies for Production](#install-dependencies-for-production) and [Compile and Minify for Production](#compile-and-minify-for-production) steps.
+
+ℹ️ Notice that this will upgrade both API and Webapp so don't forget to also follow [API upgrade instructions](../api/README.md#upgrade).
+
+## Special thanks
+
+The awesome design of this webapp was done gracefully by **Jade Mlynarz**, many thanks to her! 😘
+
+## For developers
+
+Following this instructions is needed **only if you want to contribute** to the code of the webapp.
+
+### Customize configuration
+
+See [Vite Configuration Reference](https://vitejs.dev/config/).
+
+### Install dependencies
+
+```sh
+pnpm i
+```
+
+### Compile and Hot-Reload for Development
+
+```sh
+pnpm dev
+```
+
+### Lint with [ESLint](https://eslint.org/)
+
+```sh
+pnpm lint
+```

webapp/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="fr">
+
+<head>
+  <meta charset="UTF-8">
+  <link rel="icon" href="/favicon.png">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>URL Checker</title>
+</head>
+
+<body>
+  <div id="app"></div>
+  <script type="module" src="/src/main.js"></script>
+</body>
+
+</html>

webapp/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "url-checker",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "preinstall": "npx only-allow pnpm",
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
+  },
+  "dependencies": {
+    "@apollo/client": "^3.8.8",
+    "@vue/apollo-option": "4.0.0-beta.12",
+    "@vue/apollo-util": "4.0.0-beta.6",
+    "apexcharts": "^3.45.0",
+    "file-saver": "^2.0.5",
+    "graphql": "^16.8.1",
+    "graphql-tag": "^2.12.6",
+    "graphql-ws": "^5.14.2",
+    "vue": "^3.3.11",
+    "vue-i18n": "^9.8.0",
+    "vue-router": "^4.2.5",
+    "vue3-apexcharts": "^1.4.4"
+  },
+  "devDependencies": {
+    "@graphql-eslint/eslint-plugin": "^3.20.1",
+    "@iconify-json/ri": "^1.1.17",
+    "@rollup/plugin-graphql": "^2.0.4",
+    "@vitejs/plugin-vue": "^4.5.2",
+    "@vue/compiler-sfc": "^3.3.11",
+    "autoprefixer": "^10.4.16",
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.0.1",
+    "eslint-plugin-vue": "^9.19.2",
+    "naive-ui": "^2.35.0",
+    "postcss": "^8.4.32",
+    "prettier": "^3.1.1",
+    "tailwindcss": "^3.3.6",
+    "unplugin-auto-import": "^0.17.2",
+    "unplugin-icons": "^0.18.1",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^5.0.10"
+  }
+}