fix: affix avatar fileName with UID to invalidate next image cache (#117)

The `/social-providers` endpoint should return a list of the provider ids, not their names.
This was found when trying to use the microsoft endpoint and the endpoint was returning `"microsoft entraid"`, when the `AuthForm` expects it to just be `"microsoft"`.

.vscode/launch.json

@@ -6,7 +6,7 @@
       "type": "node-terminal",
       "request": "launch",
       "command": "pnpm dev",
-      "cwd": "${workspaceFolder}/apps/nextjs",
+      "cwd": "${workspaceFolder}/apps/web",
       "skipFiles": ["<node_internals>/**"],
       "sourceMaps": true,
       "sourceMapPathOverrides": {

CHANGELOG.md

@@ -5,7 +5,23 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [Unreleased](https://github.com/kanbn/kan/compare/v0.2.3...HEAD)
+## [Unreleased](https://github.com/kanbn/kan/compare/v0.2.4...HEAD)
+
+## [0.2.4](https://github.com/kanbn/kan/compare/v0.2.3...v0.2.4) - 2025-01-14
+
+### Added
+
+- Button to view and update board public URL directly from board page
+- Redirect from root to login page for self-hosted instances
+
+### Changed
+
+- Updated all label router endpoints to return consistent structure
+- Added verbose error logging to magic link invitation process
+
+### Fixed
+
+- Updated tRPC dependencies and added OpenAPI meta to providers endpoint
 
 ## [0.2.3](https://github.com/kanbn/kan/compare/v0.2.2...v0.2.3) - 2025-07-07
 

apps/web/src/components/AuthForm.tsx

@@ -259,6 +259,7 @@ export function Auth({ setIsMagicLinkSent, isSignUp }: AuthProps) {
             }
             return (
               <Button
+                key={key}
                 onClick={() => handleLoginWithProvider(key as SocialProvider)}
                 isLoading={isLoginWithProviderPending === key}
                 iconLeft={<provider.icon />}

apps/web/src/views/settings/components/Avatar.tsx

@@ -3,6 +3,8 @@ import { t } from "@lingui/core/macro";
 import { env } from "next-runtime-env";
 import { useState } from "react";
 
+import { generateUID } from "@kan/shared/utils";
+
 import { usePopup } from "~/providers/popup";
 import { api } from "~/utils/api";
 import { getAvatarUrl } from "~/utils/helpers";
@@ -58,7 +60,7 @@ export default function Avatar({
       }
 
       const fileExt = file.name.split(".").pop();
-      const fileName = `${userId}/avatar.${fileExt}`;
+      const fileName = `${userId}/avatar-${generateUID()}.${fileExt}`;
 
       setUploading(true);
 

packages/api/src/routers/member.ts

@@ -1,7 +1,6 @@
 import { TRPCError } from "@trpc/server";
 import { z } from "zod";
 
-import { authClient } from "@kan/auth/client";
 import * as memberRepo from "@kan/db/repository/member.repo";
 import * as userRepo from "@kan/db/repository/user.repo";
 import * as workspaceRepo from "@kan/db/repository/workspace.repo";
@@ -78,16 +77,15 @@ export const memberRouter = createTRPCRouter({
           code: "INTERNAL_SERVER_ERROR",
         });
 
-      const { error } = await authClient.signIn.magicLink({
+      const { status } = await ctx.auth.api.signInMagicLink({
         email: input.email,
         callbackURL: `/boards?type=invite&memberPublicId=${invite.publicId}`,
       });
 
-      if (error) {
+      if (!status) {
         console.error("Failed to send magic link invitation:", {
           email: input.email,
           callbackURL: `/boards?type=invite&memberPublicId=${invite.publicId}`,
-          error,
         });
 
         throw new TRPCError({

packages/api/src/trpc.ts

@@ -20,58 +20,73 @@ export interface User {
   stripeCustomerId?: string | null | undefined;
 }
 
+const createAuthWithHeaders = (
+  auth: ReturnType<typeof initAuth>,
+  headers: Headers,
+) => {
+  return {
+    api: {
+      getSession: () => auth.api.getSession({ headers }),
+      signInMagicLink: (input: { email: string; callbackURL: string }) =>
+        auth.api.signInMagicLink({
+          headers,
+          body: { email: input.email, callbackURL: input.callbackURL },
+        }),
+    },
+  };
+};
+
 interface CreateContextOptions {
   user: User | null | undefined;
   db: dbClient;
+  auth: ReturnType<typeof createAuthWithHeaders>;
 }
 
 export const createInnerTRPCContext = (opts: CreateContextOptions) => {
   return {
     user: opts.user,
     db: opts.db,
+    auth: opts.auth,
   };
 };
 
 export const createTRPCContext = async ({ req }: CreateNextContextOptions) => {
   const db = createDrizzleClient();
-  const auth = initAuth(db);
+  const baseAuth = initAuth(db);
+  const headers = new Headers(req.headers as Record<string, string>);
+  const auth = createAuthWithHeaders(baseAuth, headers);
 
-  const session = await auth.api.getSession({
+  const session = await auth.api.getSession();
-    // @ts-expect-error
-    headers: new Headers(req.headers),
-  });
 
-  return createInnerTRPCContext({ db, user: session?.user });
+  return createInnerTRPCContext({ db, user: session?.user, auth });
 };
 
 export const createNextApiContext = async (req: NextApiRequest) => {
   const db = createDrizzleClient();
-  const auth = initAuth(db);
+  const baseAuth = initAuth(db);
+  const headers = new Headers(req.headers as Record<string, string>);
+  const auth = createAuthWithHeaders(baseAuth, headers);
 
-  const session = await auth.api.getSession({
+  const session = await auth.api.getSession();
-    // @ts-expect-error
-    headers: new Headers(req.headers),
-  });
 
-  return createInnerTRPCContext({ db, user: session?.user });
+  return createInnerTRPCContext({ db, user: session?.user, auth });
 };
 
 export const createRESTContext = async ({ req }: CreateNextContextOptions) => {
   const db = createDrizzleClient();
-  const auth = initAuth(db);
+  const baseAuth = initAuth(db);
+  const headers = new Headers(req.headers as Record<string, string>);
+  const auth = createAuthWithHeaders(baseAuth, headers);
 
   let session;
   try {
-    session = await auth.api.getSession({
+    session = await auth.api.getSession();
-      // @ts-expect-error
-      headers: new Headers(req.headers),
-    });
   } catch (error) {
     console.error("Error getting session, ", error);
     throw error;
   }
 
-  return createInnerTRPCContext({ db, user: session?.user });
+  return createInnerTRPCContext({ db, user: session?.user, auth });
 };
 
 const t = initTRPC

packages/auth/src/auth.ts

@@ -84,7 +84,7 @@ export const socialProvidersPlugin = () => ({
         method: "GET",
       },
       async (ctx) =>
-        ctx.json(ctx.context.socialProviders.map((p) => p.name.toLowerCase())),
+        ctx.json(ctx.context.socialProviders.map((p) => p.id.toLowerCase())),
     ),
   },
 });