expose claims to hooks and access control

examples/with-website/src/collections/Auth/Admin/Users.ts

@@ -2,7 +2,8 @@ import { authenticated } from '@/access/authenticated'
 import type { CollectionConfig } from 'payload'
 import { deleteLinkedAccounts } from 'payload-auth-plugin/collection/hooks'
 import { AdminAccounts } from './Accounts'
-export const AdminUsers: CollectionConfig = {
+import { withUsersCollection } from 'payload-auth-plugin/collection'
+export const AdminUsers: CollectionConfig = withUsersCollection({
   slug: 'users',
   access: {
     admin: authenticated,
@@ -30,4 +31,4 @@ export const AdminUsers: CollectionConfig = {
   hooks: {
     afterDelete: [deleteLinkedAccounts(AdminAccounts.slug)],
   },
-}
+})

examples/with-website/src/components/AfterLogin/index.tsx

@@ -1,18 +1,18 @@
 'use client'
+
+import './styles.scss'
 import React from 'react'
+
 import { Button } from '@payloadcms/ui'
-import './styles.scss'
 import { adminAuthClient } from '@/lib/auth'
 
 export const AdminLogin = () => {
   const { oauth } = adminAuthClient.signin()
 
-  const handleGoogleSignin = async () => {
-    oauth('google')
-  }
-  const handleAuth0Signin = async () => {
-    oauth('auth0')
-  }
+  const handleGoogleSignin = async () => oauth('google')
+  const handleAuth0Signin = async () => oauth('auth0')
+  const handleMicrosoftSignin = async () => oauth('msft-entra')
+
   return (
     <div className="oauth-container">
       <Button type="button" onClick={handleGoogleSignin} className="oauth-btn">
@@ -21,6 +21,9 @@ export const AdminLogin = () => {
       <Button type="button" onClick={handleAuth0Signin} className="oauth-btn">
         Signin with Auth0
       </Button>
+      <Button type="button" onClick={handleMicrosoftSignin} className="oauth-btn">
+        Signin with Microsoft
+      </Button>
     </div>
   )
 }