Merge branch 'main' into fix/tanstack-start-package

Author: farisaziz12

app/components/Header/AuthModal.client.vue

@@ -50,6 +50,14 @@ watch(handleInput, newHandleInput => {
     handleInput.value = normalized
   }
 })
+
+watch(user, async newUser => {
+  if (newUser?.relogin) {
+    await authRedirect(newUser.did, {
+      redirectTo: route.fullPath,
+    })
+  }
+})
 </script>
 
 <template>

app/components/Package/Playgrounds.vue

@@ -16,6 +16,10 @@ const providerIcons: Record<string, string> = {
   'nuxt-new': 'i-simple-icons:nuxtdotjs',
   'vite-new': 'i-simple-icons:vite',
   'jsfiddle': 'i-lucide:code',
+  'typescript-playground': 'i-simple-icons:typescript',
+  'solid-playground': 'i-simple-icons:solid',
+  'svelte-playground': 'i-simple-icons:svelte',
+  'tailwind-playground': 'i-simple-icons:tailwindcss',
 }
 
 // Map provider id to color class
@@ -29,6 +33,10 @@ const providerColors: Record<string, string> = {
   'nuxt-new': 'text-provider-nuxt',
   'vite-new': 'text-provider-vite',
   'jsfiddle': 'text-provider-jsfiddle',
+  'typescript-playground': 'text-provider-typescript',
+  'solid-playground': 'text-provider-solid',
+  'svelte-playground': 'text-provider-svelte',
+  'tailwind-playground': 'text-provider-tailwind',
 }
 
 function getIcon(provider: string): string {

i18n/locales/de-DE.json

@@ -364,7 +364,9 @@
         "downloads": "Downloads",
         "likes": "Likes",
         "contributors": "Mitwirkende"
-      }
+      },
+      "play_animation": "Animation abspielen",
+      "pause_animation": "Animation pausieren"
     },
     "downloads": {
       "title": "Wöchentliche Downloads",

lunaria/files/de-DE.json

@@ -363,7 +363,9 @@
         "downloads": "Downloads",
         "likes": "Likes",
         "contributors": "Mitwirkende"
-      }
+      },
+      "play_animation": "Animation abspielen",
+      "pause_animation": "Animation pausieren"
     },
     "downloads": {
       "title": "Wöchentliche Downloads",

nuxt.config.ts

@@ -37,6 +37,7 @@ export default defineNuxtConfig({
     github: {
       orgToken: '',
     },
+    oauthJwkOne: process.env.OAUTH_JWK_ONE || undefined,
     // Upstash Redis for distributed OAuth token refresh locking in production
     upstash: {
       redisRestUrl: process.env.UPSTASH_KV_REST_API_URL || process.env.KV_REST_API_URL || '',
@@ -122,6 +123,7 @@ export default defineNuxtConfig({
     '/_avatar/**': { isr: 3600, proxy: 'https://www.gravatar.com/avatar/**' },
     '/opensearch.xml': { isr: true },
     '/oauth-client-metadata.json': { prerender: true },
+    '/.well-known/jwks.json': { prerender: true },
     // never cache
     '/api/auth/**': { isr: false, cache: false },
     '/api/social/**': { isr: false, cache: false },

package.json

@@ -34,6 +34,7 @@
     "generate:sprite": "node scripts/generate-file-tree-sprite.ts",
     "generate:fixtures": "node scripts/generate-fixtures.ts",
     "generate:lexicons": "lex build --lexicons lexicons --out shared/types/lexicons --clear",
+    "generate:jwk": "node scripts/gen-jwk.ts",
     "test": "vite test",
     "test:a11y": "pnpm build:test && LIGHTHOUSE_COLOR_MODE=dark pnpm test:a11y:prebuilt && LIGHTHOUSE_COLOR_MODE=light pnpm test:a11y:prebuilt",
     "test:a11y:prebuilt": "./scripts/lighthouse.sh",

scripts/gen-jwk.ts

@@ -0,0 +1,11 @@
+import { JoseKey } from '@atproto/oauth-client-node'
+
+async function run() {
+  const kid = Date.now().toString()
+  const key = await JoseKey.generate(['ES256'], kid)
+  const jwk = key.privateJwk
+
+  console.log(JSON.stringify(jwk))
+}
+
+await run()

server/api/auth/atproto.get.ts

@@ -1,19 +1,16 @@
 import type { OAuthSession } from '@atproto/oauth-client-node'
-import { NodeOAuthClient, OAuthCallbackError } from '@atproto/oauth-client-node'
+import { OAuthCallbackError } from '@atproto/oauth-client-node'
 import { createError, getQuery, sendRedirect, setCookie, getCookie, deleteCookie } from 'h3'
 import type { H3Event } from 'h3'
-import { getOAuthLock } from '#server/utils/atproto/lock'
-import { useOAuthStorage } from '#server/utils/atproto/storage'
 import { SLINGSHOT_HOST } from '#shared/utils/constants'
 import { useServerSession } from '#server/utils/server-session'
-import { handleResolver } from '#server/utils/atproto/oauth'
 import { handleApiError } from '#server/utils/error-handler'
 import type { DidString } from '@atproto/lex'
 import { Client } from '@atproto/lex'
 import * as com from '#shared/types/lexicons/com'
 import * as app from '#shared/types/lexicons/app'
 import { isAtIdentifierString } from '@atproto/lex'
-import { scope, getOauthClientMetadata } from '#server/utils/atproto/oauth'
+import { scope } from '#server/utils/atproto/oauth'
 import { UNSET_NUXT_SESSION_PASSWORD } from '#shared/utils/constants'
 // @ts-expect-error virtual file from oauth module
 import { clientUri } from '#oauth/config'
@@ -28,17 +25,7 @@ export default defineEventHandler(async event => {
   }
 
   const query = getQuery(event)
-  const clientMetadata = getOauthClientMetadata()
   const session = await useServerSession(event)
-  const { stateStore, sessionStore } = useOAuthStorage(session)
-
-  const atclient = new NodeOAuthClient({
-    stateStore,
-    sessionStore,
-    clientMetadata,
-    requestLock: getOAuthLock(),
-    handleResolver,
-  })
 
   if (query.handle) {
     // Initiate auth flow
@@ -66,10 +53,13 @@ export default defineEventHandler(async event => {
     }
 
     try {
-      const redirectUrl = await atclient.authorize(query.handle, {
+      const redirectUrl = await event.context.oauthClient.authorize(query.handle, {
         scope,
         prompt: query.create ? 'create' : undefined,
-        ui_locales: query.locale?.toString(),
+        // TODO: I do not beleive this is working as expected on
+        // a unsupported locale on the PDS. Gives Invalid at body.ui_locales
+        // Commenting out for now
+        // ui_locales: query.locale?.toString(),
         state: encodeOAuthState(event, { redirectPath }),
       })
 
@@ -87,7 +77,7 @@ export default defineEventHandler(async event => {
     // Handle callback
     try {
       const params = new URLSearchParams(query as Record<string, string>)
-      const result = await atclient.callback(params)
+      const result = await event.context.oauthClient.callback(params)
       try {
         const state = decodeOAuthState(event, result.state)
         const profile = await getMiniProfile(result.session)

server/api/auth/session.get.ts

@@ -1,12 +1,23 @@
 import { PublicUserSessionSchema } from '#shared/schemas/publicUserSession'
 import { safeParse } from 'valibot'
 
-export default defineEventHandler(async event => {
-  const serverSession = await useServerSession(event)
+export default eventHandlerWithOAuthSession(async (event, _, serverSession) => {
   const result = safeParse(PublicUserSessionSchema, serverSession.data.public)
   if (!result.success) {
     return null
   }
 
+  // A one time redirect to upgrade the previous sessions.
+  // Can remove in 2 weeks from merge if we'd like
+  if (serverSession.data.oauthSession && serverSession.data?.public?.did) {
+    await serverSession.update({
+      oauthSession: undefined,
+    })
+    return {
+      ...result.output,
+      relogin: true,
+    }
+  }
+
   return result.output
 })

server/plugins/oauth-client.ts

@@ -0,0 +1,20 @@
+import type { NodeOAuthClient } from '@atproto/oauth-client-node'
+
+/**
+ * Creates a long living instance of the NodeOAuthClient.
+ */
+export default defineNitroPlugin(async nitroApp => {
+  const oauthClient = await getNodeOAuthClient()
+
+  // Attach to event context for access in composables via useRequestEvent()
+  nitroApp.hooks.hook('request', event => {
+    event.context.oauthClient = oauthClient
+  })
+})
+
+// Extend the H3EventContext type
+declare module 'h3' {
+  interface H3EventContext {
+    oauthClient: NodeOAuthClient
+  }
+}