feat: add sign-up button; initial signup server api

components/nav/NavUser.vue

@@ -24,8 +24,23 @@ const { busy, oauth, singleInstanceServer } = useSignIn()
       flex="~ row"
       gap-x-1 items-center justify-center btn-solid text-sm px-2 py-1 xl:hidden
       :disabled="busy"
-      @click="oauth()"
+      @click="oauth('signup')"
     >
+      hey
+      <span v-if="busy" aria-hidden="true" block animate animate-spin preserve-3d class="rtl-flip">
+        <span block i-ri:loader-2-fill aria-hidden="true" />
+      </span>
+      <span v-else aria-hidden="true" block i-ri:login-circle-line class="rtl-flip" />
+      {{ $t('action.sign_up') }}
+    </button>
+    <button
+      v-if="singleInstanceServer"
+      flex="~ row"
+      gap-x-1 items-center justify-center btn-solid text-sm px-2 py-1 xl:hidden
+      :disabled="busy"
+      @click="oauth('signin')"
+    >
+      hey
       <span v-if="busy" aria-hidden="true" block animate animate-spin preserve-3d class="rtl-flip">
         <span block i-ri:loader-2-fill aria-hidden="true" />
       </span>

components/user/UserSignInEntry.vue

@@ -9,14 +9,28 @@ const { busy, oauth, singleInstanceServer } = useSignIn()
         <strong>{{ currentServer }}</strong>
       </i18n-t>
     </p>
+
     <p text-sm text-secondary>
       {{ $t(singleInstanceServer ? 'user.single_instance_sign_in_desc' : 'user.sign_in_desc') }}
     </p>
     <button
       v-if="singleInstanceServer"
-      flex="~ row" gap-x-2 items-center justify-center btn-solid text-center rounded-3
+      flex="~ row"
+      gap-x-2 items-center justify-center btn-solid text-center rounded-3
       :disabled="busy"
-      @click="oauth()"
+      @click="oauth('signup')"
+    >
+      <span v-if="busy" aria-hidden="true" block animate animate-spin preserve-3d class="rtl-flip">
+        <span block i-ri:loader-2-fill aria-hidden="true" />
+      </span>
+      <span v-else aria-hidden="true" block i-ri:login-circle-line class="rtl-flip" />
+      {{ $t('action.sign_up') }}
+    </button>
+    <button
+      v-if="singleInstanceServer"
+      flex="~ row" gap-x-2 items-center justify-center btn-outline text-center rounded-3
+      :disabled="busy"
+      @click="oauth('login')"
     >
       <span v-if="busy" aria-hidden="true" block animate animate-spin preserve-3d class="rtl-flip">
         <span block i-ri:loader-2-fill aria-hidden="true" />

composables/sign-in.ts

@@ -11,7 +11,7 @@ export function useSignIn(input?: Ref<HTMLInputElement | undefined>) {
   const server = ref('')
   const displayError = ref(false)
 
-  async function oauth() {
+  async function oauth(authIntent: 'login' | 'signup') {
     if (busy.value)
       return
 
@@ -27,7 +27,7 @@ export function useSignIn(input?: Ref<HTMLInputElement | undefined>) {
     try {
       let href: string
       if (singleInstanceServer) {
-        href = await (globalThis.$fetch as any)(`/api/${publicServer.value}/login`, {
+        href = await (globalThis.$fetch as any)(`/api/${publicServer.value}/${authIntent}`, {
           method: 'POST',
           body: {
             force_login: users.value.length > 0,

locales/en.json

@@ -81,6 +81,7 @@
     "save_changes": "Save changes",
     "sign_in": "Sign in",
     "sign_in_to": "Sign in to {0}",
+    "sign_up": "Sign up",
     "switch_account": "Switch account",
     "vote": "Vote"
   },

nuxt.config.ts

@@ -162,8 +162,8 @@ export default defineNuxtConfig({
       // our default translation server #76
       translateApi: '',
       // Use the instance where Elk has its Mastodon account as the default
-      defaultServer: 'm.webtoo.ls',
+      defaultServer: 'social.ayco.io',
-      singleInstance: false,
+      singleInstance: true,
     },
     storage: {
       fsBase: 'node_modules/.cache/app',

server/api/[server]/signup.ts

@@ -0,0 +1,26 @@
+import { stringifyQuery } from 'ufo'
+
+export default defineEventHandler(async (event) => {
+  let { server } = getRouterParams(event)
+  const { origin, force_login, lang } = await readBody(event)
+  server = server.toLocaleLowerCase().trim()
+  const app = await getApp(origin, server)
+
+  if (!app) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: `App not registered for server: ${server}`,
+    })
+  }
+
+  const query = stringifyQuery({
+    client_id: app.client_id,
+    force_login: force_login === true ? 'true' : 'false',
+    scope: 'read write follow push',
+    response_type: 'code',
+    lang,
+    redirect_uri: getRedirectURI(origin, server),
+  })
+
+  return `https://${server}/oauth/authorize?${query}`
+})