Adding a "visitor" button

[Limezy]

Hi ! First of all thanks for this great project.
I'm not dev but still tried to help, mainly with French translation.

For my very small self-hosted project, I would need to add a "visitor" button.
The idea is that on login page, one of the button would be telling "visitor access". When clicking on it, the user would be automatically logged-in with a hard-coded visitor@url.com profile (pre-set on my user base), having a read-only access to public collections.

Would some experts mind providing a little bit of guidance here ? I'm a beginner in Typescript and a little bit lost in the /server/routes/auth/providers codebase... Shall I use a passport.js strategy ? If yes, which one should I use as a basis ? If no, how and where could I build my little code ?

Many thanks in advance for your kind help !

[Limezy]

I have found that there is a passport-req strategy, that seems to be quite in line with my need.
I have try making a new provider, mocking the google auth model :

import passport from "@outlinewiki/koa-passport";
import Router from "koa-router";
import { capitalize } from "lodash";
// @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module 'pass... Remove this comment to see the full error message
import { Strategy as ReqStrategy } from "passport-req";
import accountProvisioner from "@server/commands/accountProvisioner";
import env from "@server/env";
import passportMiddleware from "@server/middlewares/passport";
import { getAllowedDomains } from "@server/utils/authentication";
import { StateStore } from "@server/utils/passport";

const router = new Router();
const providerName = "visitor";
const allowedDomains = getAllowedDomains();

export const config = {
  name: "Visitor",
  enabled: true, 
};

if (true) { // To be changed to VISITOR_ACCESS
  passport.use(
    new ReqStrategy(
      {
        passReqToCallback: true,
        store: new StateStore(),
      },
      // @ts-expect-error ts-migrate(7006) FIXME: Parameter 'req' implicitly has an 'any' type.
      async function (req, done) {
        try {
	  const domain = "domain.tld";
          const subdomain = domain.split(".")[0];
          const teamName = capitalize(subdomain);
          const result = await accountProvisioner({
            ip: req.ip,
            team: {
              name: teamName,
              domain,
              subdomain,
            },
            user: {
              name: "username",
              email: "email@domain.tld",
              avatarUrl: null,
            },
            authenticationProvider: {
              name: providerName,
              providerId: domain,
            },
            authentication: {
              providerId: "1234",
              accessToken: null,
              refreshToken: null,
              scopes: [],
            },
          });
          return done(null, result.user, result);
        } catch (err) {
          return done(err, null);
        }
      }
    )
  );

  router.get("visitor", passport.authenticate(providerName));

  router.get("visitor.callback", passportMiddleware(providerName));
}

export default router;

I can build the app without any problem. But for some reason I get an error when running :

yarn run v1.22.17
$ node ./build/server/index.js
info: [lifecycle] Starting collaboration service
info: [lifecycle] Starting websockets service
info: [lifecycle] Starting worker service
info: [lifecycle] Starting web service
(node:28923) UnhandledPromiseRejectionWarning: Error: Cannot find module 'koa-webpack-dev-middleware'
Require stack:
- /opt/yunohost/outline/build/server/services/web.js
- /opt/yunohost/outline/build/server/services/index.js
- /opt/yunohost/outline/build/server/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
    at Function.Module._load (internal/modules/cjs/loader.js:746:27)
    at Module.require (internal/modules/cjs/loader.js:974:19)
    at require (internal/modules/cjs/helpers.js:101:18)
    at init (/opt/yunohost/outline/build/server/services/web.js:65:27)
    at start (/opt/yunohost/outline/build/server/index.js:101:11)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async throng (/opt/yunohost/outline/node_modules/throng/lib/throng.js:24:12)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:28923) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:28923) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Can an expert here give me some tips or an idea of where I should check for my mistake ?
Thanks !

[Limezy]

For those who could be interested, here is a patch that is perfectly working for the need expressed above :
Patch to be applied on top of the v0.62.0 release tag.

diff --git a/package.json b/package.json
index 462c7c3b..44338454 100644
--- a/package.json
+++ b/package.json
@@ -127,6 +127,7 @@
     "passport": "^0.4.1",
     "passport-google-oauth2": "^0.2.0",
     "passport-oauth2": "^1.6.1",
+    "passport-req": "^0.1.1",
     "passport-slack-oauth2": "^1.1.0",
     "pg": "^8.5.1",
     "pg-hstore": "^2.3.4",
diff --git a/server/routes/auth/providers/req.ts b/server/routes/auth/providers/req.ts
index e69de29b..22beba6e 100644
--- a/server/routes/auth/providers/req.ts
+++ b/server/routes/auth/providers/req.ts
@@ -0,0 +1,64 @@
+import passport from "@outlinewiki/koa-passport";
+import Router from "koa-router";
+import { capitalize } from "lodash";
+import { Strategy as ReqStrategy } from "passport-req";
+import accountProvisioner from "@server/commands/accountProvisioner";
+import env from "@server/env";
+import passportMiddleware from "@server/middlewares/passport";
+import { getAllowedDomains } from "@server/utils/authentication";
+import { StateStore } from "@server/utils/passport";
+
+const router = new Router();
+const providerName = "req";
+const allowedDomains = getAllowedDomains();
+
+export const config = {
+  name: "visiteur",
+  enabled: true,
+};
+
+if (true) {
+  passport.use(
+    new ReqStrategy(
+      async function (req,done) {
+        try {
+          const domain = "domain.tld";
+          const subdomain = domain.split(".")[0];
+          const teamName = capitalize(subdomain);
+          const name = "Visiteur";
+          const email = "visitor@domain.tld";
+          const result = await accountProvisioner({
+            ip: req.ip,
+            team: {
+              name: teamName,
+              domain,
+              subdomain,
+            },
+            user: {
+              name: name,
+              email: email,
+              avatarUrl: null,
+            },
+            authenticationProvider: {
+              name: providerName,
+              providerId: domain,
+            },
+            authentication: {
+              providerId: "1234",
+              accessToken: null,
+              refreshToken: null,
+              scopes: [],
+            },
+          });
+          return done(null, result.user, result);
+        } catch (err) {
+          return done(err, null);
+        }
+      }
+    )
+  );
+
+  router.get("req", passportMiddleware(providerName));
+}
+
+export default router;
diff --git a/yarn.lock b/yarn.lock
index 20154c88..b9674954 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11378,6 +11378,14 @@ passport-oauth@1.0.x:
     passport-oauth1 "1.x.x"
     passport-oauth2 "1.x.x"
 
+passport-req@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/passport-req/-/passport-req-0.1.1.tgz#451bff1500b3d464a768d42f0762328a21236a18"
+  integrity sha1-RRv/FQCz1GSnaNQvB2IyiiEjahg=
+  dependencies:
+    passport "~0.1.1"
+    pkginfo "0.2.x"
+
 passport-slack-oauth2@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/passport-slack-oauth2/-/passport-slack-oauth2-1.1.0.tgz#4a153b3d0d5a9e1a5041b61599d2b41a4b9486f1"

[gekomod]

Add Logo With Login Page Visitor

app/components/AuthLogo/ReqLogo.tsx

import * as React from "react";

type Props = {
  size?: number;
  fill?: string;
  className?: string;
};

function ReqLogo({ size = 24, fill = "none", className }: Props) {
  return (
<svg width={size} height={size} viewBox="0 0 24 24" fill={fill} stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users" xmlns="http://www.w3.org/2000/svg">
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
</svg>
  );
}

export default ReqLogo;

Add to index.tsx

import ReqLogo from "./ReqLogo";

And in function AuthLogo

    case "req":
      return (
        <Logo>
          <ReqLogo size={size} />
        </Logo>
      );