Allow custom strategy name in passportAdapter (#3754)

Co-authored-by: Aleksandra <[email protected]>

.changeset/config.json

@@ -2,10 +2,21 @@
   "$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
   "changelog": "@changesets/cli/changelog",
   "commit": false,
-  "fixed": [["blitz"], ["@blitzjs/*"]],
+  "fixed": [
+    [
+      "blitz"
+    ],
+    [
+      "@blitzjs/*"
+    ]
+  ],
   "linked": [],
   "access": "restricted",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["web", "test-*", "toolkit-app"]
+  "ignore": [
+    "web",
+    "test-*",
+    "toolkit-*"
+  ]
 }

.changeset/pre.json

@@ -15,6 +15,7 @@
     "@blitzjs/codemod": "2.0.0-beta.0",
     "template": "0.0.0",
     "toolkit-app": "1.0.0",
+    "toolkit-app-passportjs": "1.0.0",
     "test-qm": "0.0.0",
     "test-no-suspense": "0.0.0",
     "test-trailing-slash": "0.0.0",

.changeset/young-birds-talk.md

@@ -0,0 +1,5 @@
+---
+"@blitzjs/auth": patch
+---
+
+Allow specifying custom strategy name in Blitz's passport adapter

apps/toolkit-app-passportjs/.editorconfig

@@ -0,0 +1,11 @@
+# https://EditorConfig.org
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

apps/toolkit-app-passportjs/.env

@@ -0,0 +1,3 @@
+# This env file should be checked into source control
+# This is the place for default values for all environments
+# Values in `.env.local` and `.env.production` will override these values

apps/toolkit-app-passportjs/.eslintrc.js

@@ -0,0 +1 @@
+module.exports = require("@blitzjs/next/eslint")

apps/toolkit-app-passportjs/.gitignore

@@ -0,0 +1,56 @@
+# dependencies
+node_modules
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+.pnp.*
+.npm
+web_modules/
+
+# blitz
+/.blitz/
+/.next/
+*.sqlite
+*.sqlite-journal
+.now
+.blitz**
+blitz-log.log
+
+# misc
+.DS_Store
+
+# local env files
+.env.local
+.env.*.local
+.envrc
+
+# Logs
+logs
+*.log
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Testing
+.coverage
+*.lcov
+.nyc_output
+lib-cov
+
+# Caches
+*.tsbuildinfo
+.eslintcache
+.node_repl_history
+.yarn-integrity
+
+# Serverless directories
+.serverless/
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test

apps/toolkit-app-passportjs/.npmrc

@@ -0,0 +1,8 @@
+save-exact=true
+legacy-peer-deps=true
+
+public-hoist-pattern[]=@tanstack/react-query
+public-hoist-pattern[]=next
+public-hoist-pattern[]=secure-password
+public-hoist-pattern[]=*jest*
+public-hoist-pattern[]=@testing-library/*

apps/toolkit-app-passportjs/.prettierignore

@@ -0,0 +1,9 @@
+.gitkeep
+.env*
+*.ico
+*.lock
+db/migrations
+.next
+.yarn
+.pnp.*
+node_modules

apps/toolkit-app-passportjs/CHANGELOG.md

@@ -0,0 +1,2 @@
+# toolkit-app-passportjs
+

apps/toolkit-app-passportjs/README.md

@@ -0,0 +1,175 @@
+TODO
+
+[![Blitz.js](https://raw.githubusercontent.com/blitz-js/art/master/github-cover-photo.png)](https://blitzjs.com)
+
+This is a [Blitz.js](https://github.com/blitz-js/blitz) app.
+
+# \***\*name\*\***
+
+## Getting Started
+
+Run your app in the development mode.
+
+```
+blitz dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+## Environment Variables
+
+Ensure the `.env.local` file has required environment variables:
+
+```
+DATABASE_URL=postgresql://<YOUR_DB_USERNAME>@localhost:5432/__name__
+```
+
+Ensure the `.env.test.local` file has required environment variables:
+
+```
+DATABASE_URL=postgresql://<YOUR_DB_USERNAME>@localhost:5432/__name___test
+```
+
+## Tests
+
+Runs your tests using Jest.
+
+```
+yarn test
+```
+
+Blitz comes with a test setup using [Jest](https://jestjs.io/) and [react-testing-library](https://testing-library.com/).
+
+## Commands
+
+Blitz comes with a powerful CLI that is designed to make development easy and fast. You can install it with `npm i -g blitz`
+
+```
+  blitz [COMMAND]
+
+  dev       Start a development server
+  build     Create a production build
+  start     Start a production server
+  export    Export your Blitz app as a static application
+  prisma    Run prisma commands
+  generate  Generate new files for your Blitz project
+  console   Run the Blitz console REPL
+  install   Install a recipe
+  help      Display help for blitz
+  test      Run project tests
+```
+
+You can read more about it on the [CLI Overview](https://blitzjs.com/docs/cli-overview) documentation.
+
+## What's included?
+
+Here is the starting structure of your app.
+
+```
+__name__
+├── app/
+│   ├── api/
+│   ├── auth/
+│   │   ├── components/
+│   │   │   ├── LoginForm.tsx
+│   │   │   └── SignupForm.tsx
+│   │   ├── mutations/
+│   │   │   ├── changePassword.ts
+│   │   │   ├── forgotPassword.test.ts
+│   │   │   ├── forgotPassword.ts
+│   │   │   ├── login.ts
+│   │   │   ├── logout.ts
+│   │   │   ├── resetPassword.test.ts
+│   │   │   ├── resetPassword.ts
+│   │   │   └── signup.ts
+│   │   ├── pages/
+│   │   │   ├── forgot-password.tsx
+│   │   │   ├── login.tsx
+│   │   │   ├── reset-password.tsx
+│   │   │   └── signup.tsx
+│   │   └── validations.ts
+│   ├── core/
+│   │   ├── components/
+│   │   │   ├── Form.tsx
+│   │   │   └── LabeledTextField.tsx
+│   │   ├── hooks/
+│   │   │   └── useCurrentUser.ts
+│   │   └── layouts/
+│   │       └── Layout.tsx
+│   ├── pages/
+│   │   ├── _app.tsx
+│   │   ├── _document.tsx
+│   │   ├── 404.tsx
+│   │   ├── index.test.tsx
+│   │   └── index.tsx
+│   └── users/
+│       └── queries/
+│           └── getCurrentUser.ts
+├── db/
+│   ├── migrations/
+│   ├── index.ts
+│   ├── schema.prisma
+│   └── seeds.ts
+├── integrations/
+├── mailers/
+│   └── forgotPasswordMailer.ts
+├── public/
+│   ├── favicon.ico
+│   └── logo.png
+├── test/
+│   ├── setup.ts
+│   └── utils.tsx
+├── .eslintrc.js
+├── babel.config.js
+├── blitz.config.ts
+├── jest.config.ts
+├── package.json
+├── README.md
+├── tsconfig.json
+└── types.ts
+```
+
+These files are:
+
+- The `app/` folder is a container for most of your project. This is where you’ll put any pages or API routes.
+
+- `db/` is where your database configuration goes. If you’re writing models or checking migrations, this is where to go.
+
+- `public/` is a folder where you will put any static assets. If you have images, files, or videos which you want to use in your app, this is where to put them.
+
+- `integrations/` is a folder to put all third-party integrations like with Stripe, Sentry, etc.
+
+- `test/` is a folder where you can put test utilities and integration tests.
+
+- `package.json` contains information about your dependencies and devDependencies. If you’re using a tool like `npm` or `yarn`, you won’t have to worry about this much.
+
+- `tsconfig.json` is our recommended setup for TypeScript.
+
+- `.babel.config.js`, `.eslintrc.js`, `.env`, etc. ("dotfiles") are configuration files for various bits of JavaScript tooling.
+
+- `blitz.config.ts` is for advanced custom configuration of Blitz. [Here you can learn how to use it](https://blitzjs.com/docs/blitz-config).
+
+- `jest.config.js` contains config for Jest tests. You can [customize it if needed](https://jestjs.io/docs/en/configuration).
+
+You can read more about it in the [File Structure](https://blitzjs.com/docs/file-structure) section of the documentation.
+
+### Tools included
+
+Blitz comes with a set of tools that corrects and formats your code, facilitating its future maintenance. You can modify their options and even uninstall them.
+
+- **ESLint**: It lints your code: searches for bad practices and tell you about it. You can customize it via the `.eslintrc.js`, and you can install (or even write) plugins to have it the way you like it. It already comes with the [`blitz`](https://github.com/blitz-js/blitz/tree/canary/packages/eslint-config) config, but you can remove it safely. [Learn More](https://blitzjs.com/docs/eslint-config).
+- **Husky**: It adds [githooks](https://git-scm.com/docs/githooks), little pieces of code that get executed when certain Git events are triggerd. For example, `pre-commit` is triggered just before a commit is created. You can see the current hooks inside `.husky/`. If are having problems commiting and pushing, check out ther [troubleshooting](https://typicode.github.io/husky/#/?id=troubleshoot) guide. [Learn More](https://blitzjs.com/docs/husky-config).
+- **Prettier**: It formats your code to look the same everywhere. You can configure it via the `.prettierrc` file. The `.prettierignore` contains the files that should be ignored by Prettier; useful when you have large files or when you want to keep a custom formatting. [Learn More](https://blitzjs.com/docs/prettier-config).
+
+## Learn more
+
+Read the [Blitz.js Documentation](https://blitzjs.com/docs/getting-started) to learn more.
+
+The Blitz community is warm, safe, diverse, inclusive, and fun! Feel free to reach out to us in any of our communication channels.
+
+- [Website](https://blitzjs.com)
+- [Discord](https://blitzjs.com/discord)
+- [Report an issue](https://github.com/blitz-js/blitz/issues/new/choose)
+- [Forum discussions](https://github.com/blitz-js/blitz/discussions)
+- [How to Contribute](https://blitzjs.com/docs/contributing)
+- [Sponsor or donate](https://github.com/blitz-js/blitz#sponsors-and-donations)

apps/toolkit-app-passportjs/app/auth/components/LoginForm.tsx

@@ -0,0 +1,59 @@
+import { AuthenticationError, PromiseReturnType } from "blitz"
+import Link from "next/link"
+import { LabeledTextField } from "app/core/components/LabeledTextField"
+import { Form, FORM_ERROR } from "app/core/components/Form"
+import login from "app/auth/mutations/login"
+import { Login } from "app/auth/validations"
+import { useMutation } from "@blitzjs/rpc"
+import { Routes } from "@blitzjs/next"
+
+type LoginFormProps = {
+  onSuccess?: (user: PromiseReturnType<typeof login>) => void
+}
+
+export const LoginForm = (props: LoginFormProps) => {
+  const [loginMutation] = useMutation(login)
+  return (
+    <div>
+      <h1>Login</h1>
+
+      <Form
+        submitText="Login"
+        schema={Login}
+        initialValues={{ email: "", password: "" }}
+        onSubmit={async (values) => {
+          try {
+            const user = await loginMutation(values)
+            props.onSuccess?.(user)
+          } catch (error: any) {
+            if (error instanceof AuthenticationError) {
+              return { [FORM_ERROR]: "Sorry, those credentials are invalid" }
+            } else {
+              return {
+                [FORM_ERROR]:
+                  "Sorry, we had an unexpected error. Please try again. - " + error.toString(),
+              }
+            }
+          }
+        }}
+      >
+        <LabeledTextField name="email" label="Email" placeholder="Email" />
+        <LabeledTextField name="password" label="Password" placeholder="Password" type="password" />
+        <div>
+          <Link href={Routes.ForgotPasswordPage()} passHref>
+            <a>Forgot your password?</a>
+          </Link>
+        </div>
+      </Form>
+
+      <div style={{ marginTop: "1rem" }}>
+        Or{" "}
+        <Link href={Routes.SignupPage()} passHref>
+          <a>Sign Up</a>
+        </Link>
+      </div>
+    </div>
+  )
+}
+
+export default LoginForm