Update Supabase dependency, delete cookie handling, create logger

Updated Supabase dependency across multiple packages from "^2.41.1" to "^2.42.0". Removed files handling sidebar state and theme cookies. Created a new Logger interface for managing log messages in the shared package. Enhanced the middleware to track accounts membership webhook payload. Minor adjustments were also made in multiple package.json files.

apps/web/app/(dashboard)/home/[account]/layout.tsx

@@ -1,13 +1,12 @@
 import { use } from 'react';
 
-import { parseSidebarStateCookie } from '@kit/shared/cookies/sidebar-state.cookie';
-import { parseThemeCookie } from '@kit/shared/cookies/theme.cookie';
 import { Page } from '@kit/ui/page';
 
-import { AccountLayoutSidebar } from '~/(dashboard)/home/[account]/_components/account-layout-sidebar';
-import { loadTeamWorkspace } from '~/(dashboard)/home/[account]/_lib/load-team-account-workspace';
 import { withI18n } from '~/lib/i18n/with-i18n';
 
+import { AccountLayoutSidebar } from './_components/account-layout-sidebar';
+import { loadTeamWorkspace } from './_lib/load-team-account-workspace';
+
 interface Params {
   account: string;
 }
@@ -19,8 +18,6 @@ function TeamWorkspaceLayout({
   params: Params;
 }>) {
   const data = use(loadTeamWorkspace(params.account));
-  const ui = getUIStateCookies();
-  const sidebarCollapsed = ui.sidebarState === 'collapsed';
 
   const accounts = data.accounts.map(({ name, slug, picture_url }) => ({
     label: name,
@@ -32,7 +29,7 @@ function TeamWorkspaceLayout({
     <Page
       sidebar={
         <AccountLayoutSidebar
-          collapsed={sidebarCollapsed}
+          collapsed={false}
           account={params.account}
           accounts={accounts}
         />
@@ -44,10 +41,3 @@ function TeamWorkspaceLayout({
 }
 
 export default withI18n(TeamWorkspaceLayout);
-
-function getUIStateCookies() {
-  return {
-    theme: parseThemeCookie(),
-    sidebarState: parseSidebarStateCookie(),
-  };
-}

apps/web/middleware.ts

@@ -3,6 +3,7 @@ import { NextResponse, URLPattern } from 'next/server';
 
 import csrf from 'edge-csrf';
 
+import { Logger } from '@kit/shared/logger';
 import { checkRequiresMultiFactorAuthentication } from '@kit/supabase/check-requires-mfa';
 import { createMiddlewareClient } from '@kit/supabase/middleware-client';
 
@@ -21,6 +22,8 @@ export const config = {
 export async function middleware(request: NextRequest) {
   const response = NextResponse.next();
 
+  Logger.info({ name: `middleware`, message: `middleware` });
+
   // apply CSRF and session middleware
   const csrfResponse = await withCsrfMiddleware(request, response);
 

apps/web/package.json

@@ -33,7 +33,7 @@
     "@kit/ui": "workspace:^",
     "@radix-ui/react-icons": "^1.3.0",
     "@supabase/ssr": "^0.1.0",
-    "@supabase/supabase-js": "^2.41.1",
+    "@supabase/supabase-js": "^2.42.0",
     "@tanstack/react-query": "5.28.6",
     "@tanstack/react-query-next-experimental": "^5.28.14",
     "@tanstack/react-table": "^8.15.3",

packages/billing/gateway/package.json

@@ -19,7 +19,7 @@
     "@kit/stripe": "0.1.0",
     "@kit/supabase": "^0.1.0",
     "@kit/ui": "0.1.0",
-    "@supabase/supabase-js": "^2.40.0",
+    "@supabase/supabase-js": "^2.42.0",
     "lucide-react": "^0.363.0",
     "zod": "^3.22.4"
   },
@@ -34,7 +34,7 @@
     "@kit/tailwind-config": "workspace:*",
     "@kit/tsconfig": "workspace:*",
     "@kit/ui": "workspace:^",
-    "@supabase/supabase-js": "^2.41.1",
+    "@supabase/supabase-js": "^2.42.0",
     "lucide-react": "^0.363.0",
     "zod": "^3.22.4"
   },

packages/billing/lemon-squeezy/src/services/lemon-squeezy-webhook-handler.service.ts

@@ -44,7 +44,7 @@ export class LemonSqueezyWebhookHandlerService
 
     // clone the request so we can read the body twice
     const reqClone = request.clone();
-    const body = await request.json();
+    const body = (await request.json()) as SubscriptionWebhook | OrderWebhook;
     const rawBody = await reqClone.text();
 
     if (!signature) {

packages/billing/lemon-squeezy/src/types/order-webhook.ts

@@ -5,6 +5,7 @@ export type OrderWebhook = {
       account_id: number;
     };
   };
+
   data: {
     type: string;
     id: string;
@@ -30,11 +31,12 @@ export type OrderWebhook = {
       status: string;
       status_formatted: string;
       refunded: boolean;
-      refunded_at: any;
+      refunded_at: string | null;
       subtotal_formatted: string;
       discount_total_formatted: string;
       tax_formatted: string;
       total_formatted: string;
+
       first_order_item: {
         id: number;
         order_id: number;
@@ -45,15 +47,18 @@ export type OrderWebhook = {
         price: number;
         created_at: string;
         updated_at: string;
-        deleted_at: any;
+        deleted_at: string | null;
         test_mode: boolean;
       };
+
       urls: {
         receipt: string;
       };
+
       created_at: string;
       updated_at: string;
     };
+
     relationships: {
       store: {
         links: {

packages/billing/stripe/src/components/stripe-embedded-checkout.tsx

@@ -8,12 +8,7 @@ import {
 } from '@stripe/react-stripe-js';
 import { loadStripe } from '@stripe/stripe-js';
 
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-} from '@kit/ui/dialog';
+import { Dialog, DialogContent } from '@kit/ui/dialog';
 
 import { StripeClientEnvSchema } from '../schema/stripe-client-env.schema';
 

packages/cms/contentlayer/src/client.ts

@@ -126,7 +126,7 @@ export class ContentlayerClient implements CmsClient {
       order: 'order' in post ? post.order : 0,
       image: 'image' in post ? post.image : undefined,
       publishedAt: 'date' in post ? new Date(post.date) : new Date(),
-      parentId: 'parentId' in post ? (post.parentId as string) : undefined,
+      parentId: 'parentId' in post ? post.parentId : undefined,
       url: post.url,
       slug: post.slug,
       author: 'author' in post ? post.author : '',

packages/cms/wordpress/src/wp-client.ts

@@ -77,7 +77,9 @@ export class WordpressClient implements CmsClient {
     const urls = endpoints.map((endpoint) => `${this.apiUrl}${endpoint}`);
 
     const responses = await Promise.all(
-      urls.map((url) => fetch(url).then((value) => value.json())),
+      urls.map((url) =>
+        fetch(url).then((value) => value.json() as Promise<WP_REST_API_Post[]>),
+      ),
     ).then((values) => values.flat().filter(Boolean));
 
     return await Promise.all(
@@ -130,14 +132,16 @@ export class WordpressClient implements CmsClient {
     ];
 
     const promises = endpoints.map((endpoint) =>
-      fetch(this.apiUrl + endpoint).then((res) => res.json()),
+      fetch(this.apiUrl + endpoint).then(
+        (res) => res.json() as Promise<WP_REST_API_Post[]>,
+      ),
     );
 
     const responses = await Promise.all(promises).then((values) =>
       values.filter(Boolean),
     );
 
-    const item = responses[0][0] as WP_REST_API_Post;
+    const item = responses[0] ? responses[0][0] : undefined;
 
     if (!item) {
       return;

packages/database-webhooks/package.json

@@ -16,8 +16,7 @@
     "@kit/billing-gateway": "workspace:^",
     "@kit/shared": "^0.1.0",
     "@kit/supabase": "^0.1.0",
-    "@kit/team-accounts": "workspace:^",
-    "@supabase/supabase-js": "^2.40.0"
+    "@kit/team-accounts": "workspace:^"
   },
   "devDependencies": {
     "@kit/billing": "workspace:^",
@@ -31,7 +30,7 @@
     "@kit/team-accounts": "*",
     "@kit/tsconfig": "workspace:*",
     "@kit/ui": "workspace:^",
-    "@supabase/supabase-js": "^2.41.1",
+    "@supabase/supabase-js": "^2.42.0",
     "lucide-react": "^0.363.0",
     "zod": "^3.22.4"
   },

packages/database-webhooks/src/server/services/database-webhook-router.service.ts

@@ -56,6 +56,7 @@ export class DatabaseWebhookRouterService {
   private handleAccountsMembershipsWebhook(
     payload: RecordChange<'accounts_memberships'>,
   ) {
+    console.log('Accounts Memberships Webhook', payload);
     // no-op
     return Promise.resolve(undefined);
   }

packages/features/accounts/src/components/personal-account-settings/update-account-image-container.tsx

@@ -7,6 +7,7 @@ import type { SupabaseClient } from '@supabase/supabase-js';
 import { useTranslation } from 'react-i18next';
 import { toast } from 'sonner';
 
+import { Database } from '@kit/supabase/database';
 import { useSupabase } from '@kit/supabase/hooks/use-supabase';
 import { ImageUploader } from '@kit/ui/image-uploader';
 import { LoadingOverlay } from '@kit/ui/loading-overlay';
@@ -123,7 +124,7 @@ function UploadProfileAvatarForm(props: {
   );
 }
 
-function deleteProfilePhoto(client: SupabaseClient, url: string) {
+function deleteProfilePhoto(client: SupabaseClient<Database>, url: string) {
   const bucket = client.storage.from(AVATARS_BUCKET);
   const fileName = url.split('/').pop()?.split('?')[0];
 
@@ -135,7 +136,7 @@ function deleteProfilePhoto(client: SupabaseClient, url: string) {
 }
 
 async function uploadUserProfilePhoto(
-  client: SupabaseClient,
+  client: SupabaseClient<Database>,
   photoFile: File,
   userId: string,
 ) {
@@ -158,6 +159,9 @@ async function getAvatarFileName(
   extension: string | undefined,
 ) {
   const { nanoid } = await import('nanoid');
+
+  // we add a version to the URL to ensure
+  // the browser always fetches the latest image
   const uniqueId = nanoid(16);
 
   return `${userId}.${extension}?v=${uniqueId}`;

packages/features/admin/package.json

@@ -19,7 +19,7 @@
     "@kit/tailwind-config": "workspace:*",
     "@kit/tsconfig": "workspace:*",
     "@kit/ui": "workspace:^",
-    "@supabase/supabase-js": "^2.41.1",
+    "@supabase/supabase-js": "^2.42.0",
     "lucide-react": "^0.363.0"
   },
   "exports": {

packages/features/team-accounts/package.json

@@ -25,6 +25,7 @@
     "@kit/tailwind-config": "workspace:*",
     "@kit/tsconfig": "workspace:*",
     "@kit/ui": "workspace:^",
+    "@supabase/supabase-js": "^2.42.0",
     "@tanstack/react-query": "5.28.6",
     "lucide-react": "^0.363.0",
     "react-i18next": "^14.1.0"
@@ -36,6 +37,7 @@
     "@kit/shared": "0.1.0",
     "@kit/supabase": "0.1.0",
     "@kit/ui": "0.1.0",
+    "@supabase/supabase-js": "^2.42.0",
     "lucide-react": "^0.363.0"
   },
   "prettier": "@kit/prettier-config",

packages/features/team-accounts/src/components/settings/team-account-danger-zone.tsx

@@ -53,12 +53,15 @@ export function TeamAccountDangerZone({
     return <LoadingOverlay fullPage={false} />;
   }
 
+  // Only the primary owner can delete the team account
   const userIsPrimaryOwner = user?.id === primaryOwnerUserId;
 
   if (userIsPrimaryOwner) {
-    return <LeaveTeamContainer account={account} />;
+    return <DeleteTeamContainer account={account} />;
   }
 
+  // A primary owner can't leave the team account
+  // but other members can
   return <LeaveTeamContainer account={account} />;
 }
 

packages/shared/package.json

@@ -11,9 +11,6 @@
   "prettier": "@kit/prettier-config",
   "exports": {
     "./logger": "./src/logger/index.ts",
-    "./hooks/*": "./src/hooks/*.ts",
-    "./contexts/*": "./src/contexts/*.ts",
-    "./cookies/*": "./src/cookies/*.ts",
     "./utils": "./src/utils.ts"
   },
   "dependencies": {

packages/shared/src/cookies/sidebar-state.cookie.ts

@@ -1,7 +0,0 @@
-import { cookies } from 'next/headers';
-
-const SIDEBAR_STATE_COOKIE_NAME = 'sidebarState';
-
-export function parseSidebarStateCookie() {
-  return cookies().get(SIDEBAR_STATE_COOKIE_NAME)?.value;
-}

packages/shared/src/cookies/theme.cookie.ts

@@ -1,7 +0,0 @@
-import { cookies } from 'next/headers';
-
-const THEME_COOKIE_NAME = 'theme';
-
-export function parseThemeCookie() {
-  return cookies().get(THEME_COOKIE_NAME)?.value;
-}

packages/shared/src/logger/index.ts

@@ -1,6 +1,23 @@
+import { Logger as LoggerInstance } from './logger';
+
 /*
  * Logger
  * By default, the logger is set to use Pino. To change the logger, update the import statement below.
  * to your desired logger implementation.
  */
-export * from './impl/pino';
+async function getLogger(): Promise<LoggerInstance> {
+  switch (process.env.LOGGER ?? 'pino') {
+    case 'pino': {
+      const { Logger: PinoLogger } = await import('./impl/pino');
+
+      return PinoLogger;
+    }
+
+    default:
+      throw new Error(`Unknown logger: ${process.env.LOGGER}`);
+  }
+}
+
+const Logger = await getLogger();
+
+export { Logger };

packages/shared/src/logger/logger.ts

@@ -0,0 +1,17 @@
+type LogFn = {
+  <T extends object>(obj: T, msg?: string, ...args: unknown[]): void;
+  (obj: unknown, msg?: string, ...args: unknown[]): void;
+  (msg: string, ...args: unknown[]): void;
+};
+
+/**
+ * @name Logger
+ * @description Logger interface for logging messages
+ */
+export interface Logger {
+  info: LogFn;
+  error: LogFn;
+  warn: LogFn;
+  debug: LogFn;
+  fatal: LogFn;
+}

packages/supabase/package.json

@@ -30,13 +30,13 @@
     "@kit/tsconfig": "workspace:*",
     "@supabase/gotrue-js": "2.62.2",
     "@supabase/ssr": "^0.1.0",
-    "@supabase/supabase-js": "^2.41.1",
+    "@supabase/supabase-js": "^2.42.0",
     "@tanstack/react-query": "5.28.6"
   },
   "peerDependencies": {
     "@epic-web/invariant": "^1.0.0",
     "@supabase/ssr": "^0.1.0",
-    "@supabase/supabase-js": "^2.40.0",
+    "@supabase/supabase-js": "^2.42.0",
     "@tanstack/react-query": "^5.28.6"
   },
   "eslintConfig": {

pnpm-lock.yaml

@@ -87,7 +87,7 @@ importers:
         specifier: ^0.1.0
         version: 0.1.0(@supabase/supabase-js@2.42.0)
       '@supabase/supabase-js':
-        specifier: ^2.41.1
+        specifier: ^2.42.0
         version: 2.42.0
       '@tanstack/react-query':
         specifier: 5.28.6
@@ -250,8 +250,8 @@ importers:
         specifier: workspace:^
         version: link:../../ui
       '@supabase/supabase-js':
-        specifier: ^2.41.1
-        version: 2.41.1
+        specifier: ^2.42.0
+        version: 2.42.0
       lucide-react:
         specifier: ^0.363.0
         version: 0.363.0(react@18.2.0)
@@ -427,8 +427,8 @@ importers:
         specifier: workspace:^
         version: link:../ui
       '@supabase/supabase-js':
-        specifier: ^2.41.1
-        version: 2.41.1
+        specifier: ^2.42.0
+        version: 2.42.0
       lucide-react:
         specifier: ^0.363.0
         version: 0.363.0(react@18.2.0)
@@ -536,8 +536,8 @@ importers:
         specifier: workspace:^
         version: link:../../ui
       '@supabase/supabase-js':
-        specifier: ^2.41.1
-        version: 2.41.1
+        specifier: ^2.42.0
+        version: 2.42.0
       lucide-react:
         specifier: ^0.363.0
         version: 0.363.0(react@18.2.0)
@@ -622,6 +622,9 @@ importers:
       '@kit/ui':
         specifier: workspace:^
         version: link:../../ui
+      '@supabase/supabase-js':
+        specifier: ^2.42.0
+        version: 2.42.0
       '@tanstack/react-query':
         specifier: 5.28.6
         version: 5.28.6(react@18.2.0)
@@ -725,10 +728,10 @@ importers:
         version: 2.62.2
       '@supabase/ssr':
         specifier: ^0.1.0
-        version: 0.1.0(@supabase/supabase-js@2.41.1)
+        version: 0.1.0(@supabase/supabase-js@2.42.0)
       '@supabase/supabase-js':
-        specifier: ^2.41.1
-        version: 2.41.1
+        specifier: ^2.42.0
+        version: 2.42.0
       '@tanstack/react-query':
         specifier: 5.28.6
         version: 5.28.6(react@18.2.0)
@@ -4200,13 +4203,6 @@ packages:
     resolution: {integrity: sha512-U4bwBOrhsXWqDjZiYNbVqMBtRGgIIYE0kE5ZNSwsIbeBWfr/UxOMrnkIQUBGIZRhpYW/tw1WnTdRl1AGNyaxcw==}
     dependencies:
       '@supabase/node-fetch': 2.6.15
-    dev: false
-
-  /@supabase/postgrest-js@1.9.2:
-    resolution: {integrity: sha512-I6yHo8CC9cxhOo6DouDMy9uOfW7hjdsnCxZiaJuIVZm1dBGTFiQPgfMa9zXCamEWzNyWRjZvupAUuX+tqcl5Sw==}
-    dependencies:
-      '@supabase/node-fetch': 2.6.15
-    dev: true
 
   /@supabase/realtime-js@2.9.3:
     resolution: {integrity: sha512-lAp50s2n3FhGJFq+wTSXLNIDPw5Y0Wxrgt44eM5nLSA3jZNUUP3Oq2Ccd1CbZdVntPCWLZvJaU//pAd2NE+QnQ==}
@@ -4219,16 +4215,6 @@ packages:
       - bufferutil
       - utf-8-validate
 
-  /@supabase/ssr@0.1.0(@supabase/supabase-js@2.41.1):
-    resolution: {integrity: sha512-bIVrkqjAK5G3KjkIMKYKtAOlCgRRplEWjrlyRyXSOYtgDieiOhk2ZyNAPsEOa1By9OZVxuX5eAW1fitdnuxayw==}
-    peerDependencies:
-      '@supabase/supabase-js': ^2.33.1
-    dependencies:
-      '@supabase/supabase-js': 2.41.1
-      cookie: 0.5.0
-      ramda: 0.29.1
-    dev: true
-
   /@supabase/ssr@0.1.0(@supabase/supabase-js@2.42.0):
     resolution: {integrity: sha512-bIVrkqjAK5G3KjkIMKYKtAOlCgRRplEWjrlyRyXSOYtgDieiOhk2ZyNAPsEOa1By9OZVxuX5eAW1fitdnuxayw==}
     peerDependencies:
@@ -4237,27 +4223,12 @@ packages:
       '@supabase/supabase-js': 2.42.0
       cookie: 0.5.0
       ramda: 0.29.1
-    dev: false
 
   /@supabase/storage-js@2.5.5:
     resolution: {integrity: sha512-OpLoDRjFwClwc2cjTJZG8XviTiQH4Ik8sCiMK5v7et0MDu2QlXjCAW3ljxJB5+z/KazdMOTnySi+hysxWUPu3w==}
     dependencies:
       '@supabase/node-fetch': 2.6.15
 
-  /@supabase/supabase-js@2.41.1:
-    resolution: {integrity: sha512-xmECLhYugMo/6SObpsOhu5xaxVfsk+JK/d4JSh055bpESmgmN3PLpzbfqejKCpaUeeUNF21+lrJp/U9HQzT9mA==}
-    dependencies:
-      '@supabase/auth-js': 2.63.0
-      '@supabase/functions-js': 2.2.2
-      '@supabase/node-fetch': 2.6.15
-      '@supabase/postgrest-js': 1.9.2
-      '@supabase/realtime-js': 2.9.3
-      '@supabase/storage-js': 2.5.5
-    transitivePeerDependencies:
-      - bufferutil
-      - utf-8-validate
-    dev: true
-
   /@supabase/supabase-js@2.42.0:
     resolution: {integrity: sha512-1PDqJiA4iG45w3AAu6xkccJ3wPqlGJUoz9CPhScRLLTStxhewYhz0mjryTpXz1kgtNHdUAsirALreezn8UZMjA==}
     dependencies:
@@ -4270,7 +4241,6 @@ packages:
     transitivePeerDependencies:
       - bufferutil
       - utf-8-validate
-    dev: false
 
   /@swc/core-darwin-arm64@1.3.101:
     resolution: {integrity: sha512-mNFK+uHNPRXSnfTOG34zJOeMl2waM4hF4a2NY7dkMXrPqw9CoJn4MwTXJcyMiSz1/BnNjjTCHF3Yhj0jPxmkzQ==}