Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for remix auth oauth2 v2 #27

Open
wants to merge 14 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 0 additions & 21 deletions .eslintrc.js

This file was deleted.

23 changes: 17 additions & 6 deletions .github/workflows/bump.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,22 +13,33 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Check out source
uses: actions/checkout@v2
uses: actions/checkout@v4
with:
ssh-key: ${{ secrets.DEPLOY_KEY }}

- uses: pnpm/action-setup@v4
name: Install pnpm
id: pnpm-install
with:
version: 9
run_install: false

- name: Setup Node.js
uses: actions/setup-node@v2
uses: actions/setup-node@v4
with:
node-version: '18'
cache: 'yarn'
node-version: '20'
cache: 'pnpm'

- name: Install dependencies
uses: bahmutov/npm-install@v1
run: pnpm install

- name: Setup Git
run: |
git config user.name '${{ secrets.GIT_USER_NAME }}'
git config user.email '${{ secrets.GIT_USER_EMAIL }}'

- name: bump version
run: yarn version --${{ github.event.inputs.version }}
run: pnpm version --${{ github.event.inputs.version }}

- name: Push latest version
run: git push origin main --follow-tags
62 changes: 43 additions & 19 deletions .github/workflows/main.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,54 +8,78 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout repo
uses: actions/checkout@v2
uses: actions/checkout@v4

- name: Use Node 18
uses: actions/setup-node@v1
- uses: pnpm/action-setup@v4
name: Install pnpm
id: pnpm-install
with:
node-version: 18
version: 9
run_install: false

- name: Use Node 20
uses: actions/setup-node@v4
with:
node-version: 20
cache: 'pnpm'

- name: Install dependencies
uses: bahmutov/npm-install@v1
run: pnpm install

- name: Build
run: yarn build
run: pnpm build

typecheck:
name: Typechecker
runs-on: ubuntu-latest
steps:
- name: Checkout repo
uses: actions/checkout@v2
uses: actions/checkout@v4

- uses: pnpm/action-setup@v4
name: Install pnpm
id: pnpm-install
with:
version: 9
run_install: false

- name: Use Node 18
uses: actions/setup-node@v1
- name: Use Node 20
uses: actions/setup-node@v4
with:
node-version: 18
node-version: 20
cache: 'pnpm'

- name: Install dependencies
uses: bahmutov/npm-install@v1
run: pnpm install

- name: Typecheck
run: yarn typecheck
run: pnpm typecheck

lint:
name: Linter
runs-on: ubuntu-latest
steps:
- name: Checkout repo
uses: actions/checkout@v2
uses: actions/checkout@v4

- uses: pnpm/action-setup@v4
name: Install pnpm
id: pnpm-install
with:
version: 9
run_install: false

- name: Use Node 18
uses: actions/setup-node@v1
- name: Use Node 20
uses: actions/setup-node@v4
with:
node-version: 18
node-version: 20
cache: 'pnpm'

- name: Install dependencies
uses: bahmutov/npm-install@v1
run: pnpm install

- name: Build
run: yarn build
run: pnpm build

- name: Lint
run: yarn lint
run: pnpm lint
21 changes: 15 additions & 6 deletions .github/workflows/publish.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,22 @@ jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- uses: actions/setup-node@v1
- uses: actions/checkout@v4

- uses: pnpm/action-setup@v4
name: Install pnpm
id: pnpm-install
with:
version: 9
run_install: false

- uses: actions/setup-node@v4
with:
node-version: 18
node-version: 20
registry-url: https://registry.npmjs.org/
- run: yarn install
- run: yarn build
- run: npm publish --access public
cache: 'pnpm'
- run: pnpm install
- run: pnpm build
- run: pnpm publish --access public
env:
NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
2 changes: 1 addition & 1 deletion .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx lint-staged
pnpm dlx lint-staged
1 change: 1 addition & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
pnpm-lock.yaml
8 changes: 4 additions & 4 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@

## Setup

Run `npm install` to install the dependencies.
Run `pnpm install` to install the dependencies.

Run the tests with `npm run test`.
Run the tests with `pnpm run test`.

Run the linter with `npm run lint`.
Run the linter with `pnpm run lint`.

Run the typechecker with `npm run typecheck`.
Run the typechecker with `pnpm run typecheck`.
78 changes: 59 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,20 +23,62 @@ Follow the steps on [the Google documentation](https://developers.google.com/ide

```ts
// app/services/auth.server.ts
import { Authenticator } from 'remix-auth'
import { GoogleStrategy } from 'remix-auth-google'
import { createCookieSessionStorage, redirect } from 'react-router'

let googleStrategy = new GoogleStrategy(
export type SessionUser = {
id: string
email: string
displayName: string
pictureUrl: string
}

let SESSION_KEY = 'user'
export const sessionStorage = createCookieSessionStorage<{
[SESSION_KEY]: SessionUser
}>({
cookie: {
name: '__session',
httpOnly: true,
path: '/',
sameSite: 'lax',
secrets: [process.env.SESSION_SECRET],
secure: process.env.NODE_ENV === 'production',
},
})

export const getSession = async (request: Request) => {
return await sessionStorage.getSession(request.headers.get('Cookie'))
}

export const getSessionUser = async (request: Request) => {
const session = await getSession(request)
return session?.get(SESSION_KEY)
}

export const saveSession = async (request: Request, user: SessionUser) => {
const session = await getSession(request)
session.set(SESSION_KEY, user)
return new Headers({
'Set-Cookie': await sessionStorage.commitSession(session),
})
}

const googleStrategy = new GoogleStrategy(
{
clientID: 'YOUR_CLIENT_ID',
clientId: 'YOUR_CLIENT_ID',
clientSecret: 'YOUR_CLIENT_SECRET',
callbackURL: 'https://example.com/auth/google/callback',
redirectURI: 'https://example.com/auth/google/callback',
},
async ({ accessToken, refreshToken, extraParams, profile }) => {
async ({ accessToken, tokens }) => {
// Get the user data from your DB or API using the tokens and profile
const profile = await GoogleStrategy.userProfile(tokens)
return User.findOrCreate({ email: profile.emails[0].value })
}
},
)

export const authenticator = new Authenticator<SessionUser>()
authenticator.use(googleStrategy)
```

Expand All @@ -46,7 +88,7 @@ authenticator.use(googleStrategy)
// app/routes/login.tsx
export default function Login() {
return (
<Form action="/auth/google" method="post">
<Form action="/auth/google" method="GET">
<button>Login with Google</button>
</Form>
)
Expand All @@ -55,25 +97,23 @@ export default function Login() {

```tsx
// app/routes/auth.google.tsx
import { redirect, type ActionFunctionArgs } from '@remix-run/node'
import { authenticator } from '~/services/auth.server'
import type { Route } from './+types/auth.google'

export let loader = () => redirect('/login')

export let action = ({ request }: ActionFunctionArgs) => {
return authenticator.authenticate('google', request)
export const loader = async ({ request }: Route.LoaderArgs) => {
return await authenticator.authenticate('google', request)
}
```

```tsx
// app/routes/auth.google.callback.tsx
import type { LoaderFunctionArgs } from '@remix-run/node'
import { authenticator } from '~/services/auth.server'

export let loader = ({ request }: LoaderFunctionArgs) => {
return authenticator.authenticate('google', request, {
successRedirect: '/dashboard',
failureRedirect: '/login',
})
import { redirect } from 'react-router'
import { authenticator, saveSession } from '~/services/auth.server'
import type { Route } from './+types/auth.google.callback'

export let loader = ({ request }: Route.LoaderArgs) => {
const user = authenticator.authenticate('google', request)
const headers = await saveSession(user)
return redirect('/dashboard', { headers })
}
```
20 changes: 20 additions & 0 deletions biome.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
"organizeImports": {
"enabled": false
},
"vcs": {
"enabled": true,
"clientKind": "git",
"useIgnoreFile": true
},
"linter": {
"enabled": true,
"rules": {
"recommended": true,
"suspicious": {
"useAwait": "error"
}
}
}
}
Loading