Replace Logger with getLogger and update next version

This commit replaces the use of Logger with getLogger in various parts of the code to handle logging. The Logger has been replaced with getLogger, which assists in getting logs in an asynchronous manner. In addition to this, it updates the next version in pnpm-lock.yaml from next@14.2.0-canary.61 to next@14.2.0-canary.62 and various other dependencies. Also made minor annotations and comments to the function 'isBrowser' and 'formatCurrency' in the 'utils.ts' file.

apps/web/app/(dashboard)/home/(user)/billing/_lib/server/user-billing.service.ts

@@ -5,7 +5,7 @@ import { z } from 'zod';
 
 import { getProductPlanPair } from '@kit/billing';
 import { getBillingGatewayProvider } from '@kit/billing-gateway';
-import { Logger } from '@kit/shared/logger';
+import { getLogger } from '@kit/shared/logger';
 import { Database } from '@kit/supabase/database';
 import { requireUser } from '@kit/supabase/require-user';
 import { getSupabaseServerActionClient } from '@kit/supabase/server-actions-client';
@@ -51,8 +51,9 @@ export class UserBillingService {
     }
 
     const { plan } = getProductPlanPair(billingConfig, planId);
+    const logger = await getLogger();
 
-    Logger.info(
+    logger.info(
       {
         name: `billing.personal-account`,
         planId,
@@ -73,7 +74,7 @@ export class UserBillingService {
         variantQuantities: [],
       });
 
-      Logger.info(
+      logger.info(
         {
           userId: user.id,
         },
@@ -86,7 +87,7 @@ export class UserBillingService {
         checkoutToken,
       };
     } catch (error) {
-      Logger.error(
+      logger.error(
         {
           name: `billing.personal-account`,
           planId,
@@ -118,7 +119,9 @@ export class UserBillingService {
       throw new Error('Customer not found');
     }
 
-    Logger.info(
+    const logger = await getLogger();
+
+    logger.info(
       {
         name: `billing.personal-account`,
         customerId,
@@ -137,7 +140,7 @@ export class UserBillingService {
 
       url = session.url;
     } catch (error) {
-      Logger.error(
+      logger.error(
         {
           error,
           customerId,
@@ -151,7 +154,7 @@ export class UserBillingService {
       );
     }
 
-    Logger.info(
+    logger.info(
       {
         name: `billing.personal-account`,
         customerId,
@@ -167,6 +170,14 @@ export class UserBillingService {
 
 async function getCustomerIdFromAccountId(accountId: string) {
   const client = getSupabaseServerActionClient();
+  const logger = await getLogger();
+
+  logger.info(
+    {
+      accountId,
+    },
+    `Getting customer ID for account ${accountId}...`,
+  );
 
   const { data, error } = await client
     .from('billing_customers')
@@ -175,6 +186,14 @@ async function getCustomerIdFromAccountId(accountId: string) {
     .maybeSingle();
 
   if (error) {
+    logger.error(
+      {
+        accountId,
+        error,
+      },
+      `Failed to get customer ID`,
+    );
+
     throw error;
   }
 

apps/web/app/(dashboard)/home/[account]/_lib/server/team-billing.service.ts

@@ -5,7 +5,7 @@ import { z } from 'zod';
 
 import { LineItemSchema } from '@kit/billing';
 import { getBillingGatewayProvider } from '@kit/billing-gateway';
-import { Logger } from '@kit/shared/logger';
+import { getLogger } from '@kit/shared/logger';
 import { Database } from '@kit/supabase/database';
 import { requireUser } from '@kit/supabase/require-user';
 import { getSupabaseServerActionClient } from '@kit/supabase/server-actions-client';
@@ -35,8 +35,9 @@ export class TeamBillingService {
 
     const userId = user.id;
     const accountId = params.accountId;
+    const logger = await getLogger();
 
-    Logger.info(
+    logger.info(
       {
         userId,
         accountId,
@@ -54,7 +55,7 @@ export class TeamBillingService {
     // if the user does not have permission to manage billing for the account
     // then we should not proceed
     if (!hasPermission) {
-      Logger.warn(
+      logger.warn(
         {
           userId,
           accountId,
@@ -90,7 +91,7 @@ export class TeamBillingService {
       accountId,
     );
 
-    Logger.info(
+    logger.info(
       {
         userId,
         accountId,
@@ -117,7 +118,7 @@ export class TeamBillingService {
         checkoutToken,
       };
     } catch (error) {
-      Logger.error(
+      logger.error(
         {
           name: this.namespace,
           error,
@@ -145,8 +146,9 @@ export class TeamBillingService {
     slug: string;
   }) {
     const client = getSupabaseServerActionClient();
+    const logger = await getLogger();
 
-    Logger.info(
+    logger.info(
       {
         accountId,
         name: this.namespace,
@@ -171,7 +173,7 @@ export class TeamBillingService {
     // if the user does not have permission to manage billing for the account
     // then we should not proceed
     if (!hasPermission) {
-      Logger.warn(
+      logger.warn(
         {
           userId,
           accountId,
@@ -190,7 +192,7 @@ export class TeamBillingService {
       throw new Error('Customer not found');
     }
 
-    Logger.info(
+    logger.info(
       {
         userId,
         customerId,
@@ -211,7 +213,7 @@ export class TeamBillingService {
       // redirect the user to the billing portal
       return url;
     } catch (error) {
-      Logger.error(
+      logger.error(
         {
           userId,
           customerId,
@@ -260,7 +262,9 @@ export class TeamBillingService {
       .eq('account_id', accountId);
 
     if (error) {
-      Logger.error(
+      const logger = await getLogger();
+
+      logger.error(
         {
           accountId,
           error,

apps/web/app/(dashboard)/home/[account]/billing/return/page.tsx

@@ -68,7 +68,7 @@ async function ReturnCheckoutSessionPage({ searchParams }: SessionPageProps) {
 
 export default withI18n(ReturnCheckoutSessionPage);
 
-export async function loadCheckoutSession(sessionId: string) {
+async function loadCheckoutSession(sessionId: string) {
   const client = getSupabaseServerComponentClient();
   const { error } = await requireUser(client);
 

apps/web/app/admin/accounts/[account]/page.tsx

@@ -0,0 +1,3 @@
+export default function AccountPage() {
+  return <div></div>;
+}

apps/web/app/api/billing/webhook/route.ts

@@ -1,5 +1,5 @@
 import { getBillingEventHandlerService } from '@kit/billing-gateway';
-import { Logger } from '@kit/shared/logger';
+import { getLogger } from '@kit/shared/logger';
 import { getSupabaseRouteHandlerClient } from '@kit/supabase/route-handler-client';
 
 import billingConfig from '~/config/billing.config';
@@ -9,8 +9,9 @@ import billingConfig from '~/config/billing.config';
  */
 export async function POST(request: Request) {
   const provider = billingConfig.provider;
+  const logger = await getLogger();
 
-  Logger.info(
+  logger.info(
     {
       name: 'billing.webhook',
       provider,
@@ -30,7 +31,7 @@ export async function POST(request: Request) {
   try {
     await service.handleWebhookEvent(request);
 
-    Logger.info(
+    logger.info(
       {
         name: 'billing.webhook',
       },
@@ -39,7 +40,7 @@ export async function POST(request: Request) {
 
     return new Response('OK', { status: 200 });
   } catch (e) {
-    Logger.error(
+    logger.error(
       {
         name: 'billing',
         error: e,

apps/web/app/auth/callback/route.ts

@@ -1,7 +1,7 @@
 import { redirect } from 'next/navigation';
 import type { NextRequest } from 'next/server';
 
-import { Logger } from '@kit/shared/logger';
+import { getLogger } from '@kit/shared/logger';
 import { getSupabaseRouteHandlerClient } from '@kit/supabase/route-handler-client';
 
 import pathsConfig from '~/config/paths.config';
@@ -38,9 +38,12 @@ export async function GET(request: NextRequest) {
         return onError({ error: error.message });
       }
     } catch (error) {
-      Logger.error(
+      const logger = await getLogger();
+
+      logger.error(
         {
           error,
+          name: `auth.callback`,
         },
         `An error occurred while exchanging code for session`,
       );
@@ -58,12 +61,14 @@ export async function GET(request: NextRequest) {
   return redirect(nextUrl);
 }
 
-function onError({ error }: { error: string }) {
+async function onError({ error }: { error: string }) {
   const errorMessage = getAuthErrorMessage(error);
+  const logger = await getLogger();
 
-  Logger.error(
+  logger.error(
     {
       error,
+      name: `auth.callback`,
     },
     `An error occurred while signing user in`,
   );

apps/web/app/join/page.tsx

@@ -63,9 +63,10 @@ async function JoinTeamAccountPage({ searchParams }: Context) {
   );
 
   if (isInAccount) {
-    const { Logger } = await import('@kit/shared/logger');
+    const { getLogger } = await import('@kit/shared/logger');
+    const logger = await getLogger();
 
-    Logger.warn(
+    logger.warn(
       {
         name: 'join-team-account',
         accountId: invitation.account.id,

apps/web/instrumentation.ts

@@ -1,7 +1,12 @@
-import { registerInstrumentation } from '@kit/monitoring';
+/**
+ * This file is used to register monitoring instrumentation
+ * for your Next.js application.
+ */
+export async function register() {
+  // only run in nodejs runtime
+  if (process.env.NEXT_RUNTIME === 'nodejs') {
+    const { registerInstrumentation } = await import('@kit/monitoring');
 
-export function register() {
-  if (process.env.NEXT_RUNTIME !== 'nodejs') {
     // Register monitoring instrumentation based on the
     // MONITORING_INSTRUMENTATION_PROVIDER environment variable.
     return registerInstrumentation();

apps/web/package.json

@@ -45,7 +45,7 @@
     "i18next": "^23.10.1",
     "i18next-resources-to-backend": "^1.2.0",
     "lucide-react": "^0.363.0",
-    "next": "14.2.0-canary.61",
+    "next": "14.2.0-canary.62",
     "next-sitemap": "^4.2.3",
     "next-themes": "0.3.0",
     "react": "18.2.0",