feat: add basic white labelling

README.md

@@ -139,7 +139,7 @@ pnpm dev
 ## Environment Variables 🔐
 
 | Variable                                  | Description                                              | Required                 | Example                                       |
-| -------------------------------- | -------------------------------------------------------- | ------------------ | --------------------------------------------- |
+| ----------------------------------------- | -------------------------------------------------------- | ------------------------ | --------------------------------------------- |
 | `POSTGRES_URL`                            | PostgreSQL connection URL                                | To use external database | `postgres://user:pass@localhost:5432/db`      |
 | `EMAIL_FROM`                              | Sender email address                                     | For Email                | `"Kan <hello@mail.kan.bn>"`                   |
 | `SMTP_HOST`                               | SMTP server hostname                                     | For Email                | `smtp.resend.com`                             |
@@ -168,6 +168,7 @@ pnpm dev
 | `NEXT_PUBLIC_AVATAR_BUCKET_NAME`          | S3 bucket name for avatars                               | For file uploads         | `avatars`                                     |
 | `NEXT_PUBLIC_ALLOW_CREDENTIALS`           | Allow email & password login                             | For authentication       | `true`                                        |
 | `NEXT_PUBLIC_DISABLE_SIGN_UP`             | Disable sign up                                          | For authentication       | `false`                                       |
+| `NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY` | Hide “Powered by kan.bn” on public boards (self-host)    | For white labelling      | `true`                                        |
 
 See `.env.example` for a complete list of supported environment variables.
 

apps/web/src/env.ts

@@ -24,7 +24,7 @@ export const env = createEnv({
           s.split(",").every((l) => z.string().url().safeParse(l).success),
       )
       .optional(),
-    POSTGRES_URL: z.string().url().optional().or(z.literal('')),
+    POSTGRES_URL: z.string().url().optional().or(z.literal("")),
     TRELLO_APP_API_KEY: z.string().optional(),
     TRELLO_APP_SECRET: z.string().optional(),
     STRIPE_SECRET_KEY: z.string().optional(),
@@ -101,6 +101,13 @@ export const env = createEnv({
         (s) => !s || s.toLowerCase() === "true" || s.toLowerCase() === "false",
       )
       .optional(),
+    NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY: z
+      .string()
+      .transform((s) => (s === "" ? undefined : s))
+      .refine(
+        (s) => !s || s.toLowerCase() === "true" || s.toLowerCase() === "false",
+      )
+      .optional(),
   },
   /**
    * Destructure all variables from `process.env` to make sure they aren't tree-shaken away.
@@ -119,6 +126,8 @@ export const env = createEnv({
     NEXT_PUBLIC_DISABLE_SIGN_UP: process.env.NEXT_PUBLIC_DISABLE_SIGN_UP,
     NEXT_PUBLIC_USE_STANDALONE_OUTPUT:
       process.env.NEXT_PUBLIC_USE_STANDALONE_OUTPUT,
+    NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY:
+      process.env.NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY,
   },
   skipValidation:
     !!process.env.CI || process.env.npm_lifecycle_event === "lint",

apps/web/src/views/public/board/index.tsx

@@ -2,6 +2,7 @@ import Link from "next/link";
 import { useRouter } from "next/router";
 import { t } from "@lingui/core/macro";
 import { keepPreviousData } from "@tanstack/react-query";
+import { env } from "next-runtime-env";
 import { useEffect, useState } from "react";
 import { HiLink, HiOutlineLockClosed } from "react-icons/hi2";
 
@@ -19,6 +20,10 @@ import Card from "~/views/board/components/Card";
 import Filters from "~/views/board/components/Filters";
 import { CardModal } from "./CardModal";
 
+const IS_CLOUD = env("NEXT_PUBLIC_KAN_ENV") === "cloud";
+const HIDE_POWERED_BY =
+  env("NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY") === "true";
+
 export default function PublicBoardView() {
   const router = useRouter();
   const { showPopup } = usePopup();
@@ -194,12 +199,26 @@ export default function PublicBoardView() {
             <CopyBoardLink />
           </div>
 
+          {IS_CLOUD && (
             <Link
               className="text-lg font-bold tracking-tight text-neutral-900 dark:text-dark-1000"
               href="/"
             >
               kan.bn
             </Link>
+          )}
+
+          {!IS_CLOUD && !HIDE_POWERED_BY && (
+            <a
+              href="https://kan.bn"
+              target="_blank"
+              rel="noreferrer noopener"
+              className="absolute right-[1rem] inline-flex items-center gap-[0.175rem] rounded-full border border-light-300 bg-light-50 px-3 py-1 text-[11px] font-medium text-light-950 shadow-sm transition-colors hover:bg-light-100 dark:border-dark-300 dark:bg-dark-50 dark:text-dark-900 dark:hover:bg-dark-100"
+            >
+              <span>{`Powered by`}</span>
+              <span className="font-semibold">kan.bn</span>
+            </a>
+          )}
         </div>
       </div>
       <Popup />

docker-compose.yml

@@ -35,6 +35,9 @@ services:
       - NEXT_PUBLIC_AVATAR_BUCKET_NAME=${NEXT_PUBLIC_AVATAR_BUCKET_NAME}
       - NEXT_PUBLIC_STORAGE_DOMAIN=${NEXT_PUBLIC_STORAGE_DOMAIN}
 
+      # White label
+      - NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY=${NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY}
+
       # Auth config (optional)
       - NEXT_PUBLIC_ALLOW_CREDENTIALS=${NEXT_PUBLIC_ALLOW_CREDENTIALS}
       - NEXT_PUBLIC_DISABLE_SIGN_UP=${NEXT_PUBLIC_DISABLE_SIGN_UP}

turbo.json

@@ -93,6 +93,7 @@
     "SMTP_PASSWORD",
     "SMTP_SECURE",
     "NEXT_PUBLIC_KAN_ENV",
+    "NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY",
     "STRIPE_SECRET_KEY",
     "STRIPE_WEBHOOK_SECRET",
     "STRIPE_PRO_PLAN_PRICE_ID",