feat: prepare supporter self-hosting

apps/start/Dockerfile

@@ -0,0 +1,140 @@
+ARG NODE_VERSION=22.20.0
+
+FROM node:${NODE_VERSION}-slim AS base
+
+# FIX: Bad workaround (https://github.com/nodejs/corepack/issues/612)
+ENV COREPACK_INTEGRITY_KEYS=0
+
+RUN corepack enable && apt-get update && \
+    apt-get install -y --no-install-recommends \
+    ca-certificates \
+    openssl \
+    libssl3 \
+    curl \
+    && apt-get clean && \
+    rm -rf /var/lib/apt/lists/*
+
+ENV NITRO=1
+ENV SELF_HOSTED=1
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+
+WORKDIR /app
+
+# Workspace - Copy package.json files for caching
+COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
+# Apps
+COPY apps/start/package.json ./apps/start/
+# Packages - Only copy what start app needs
+COPY packages/trpc/package.json packages/trpc/
+COPY packages/json/package.json packages/json/
+COPY packages/common/package.json packages/common/
+COPY packages/payments/package.json packages/payments/
+COPY packages/constants/package.json packages/constants/
+COPY packages/validation/package.json packages/validation/
+COPY packages/integrations/package.json packages/integrations/
+COPY packages/sdks/sdk/package.json packages/sdks/sdk/
+COPY packages/sdks/_info/package.json packages/sdks/_info/
+COPY patches ./patches
+
+# BUILD
+FROM base AS build
+
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    python3 \
+    make \
+    g++ && \
+    apt-get clean && \
+    rm -rf /var/lib/apt/lists/*
+
+WORKDIR /app
+
+# Install all dependencies (including dev dependencies for build)
+RUN pnpm install --frozen-lockfile && \
+    pnpm store prune
+
+# Copy source code
+COPY apps/start ./apps/start
+COPY packages ./packages
+COPY tooling ./tooling
+
+# Generate Prisma client and build the app
+RUN pnpm --filter start run build
+
+# PROD - Install only production dependencies
+FROM base AS prod
+
+ENV npm_config_build_from_source=true
+
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    python3 \
+    make \
+    g++ && \
+    apt-get clean && \
+    rm -rf /var/lib/apt/lists/*
+
+WORKDIR /app
+COPY --from=build /app/package.json ./
+COPY --from=build /app/pnpm-lock.yaml ./
+COPY --from=build /app/pnpm-workspace.yaml ./
+
+# Copy package.json files for production install
+COPY --from=build /app/apps/start/package.json ./apps/start/
+COPY --from=build /app/packages/db/package.json ./packages/db/
+COPY --from=build /app/packages/trpc/package.json ./packages/trpc/
+COPY --from=build /app/packages/auth/package.json ./packages/auth/
+COPY --from=build /app/packages/json/package.json ./packages/json/
+COPY --from=build /app/packages/common/package.json ./packages/common/
+COPY --from=build /app/packages/payments/package.json ./packages/payments/
+COPY --from=build /app/packages/constants/package.json ./packages/constants/
+COPY --from=build /app/packages/validation/package.json ./packages/validation/
+COPY --from=build /app/packages/integrations/package.json ./packages/integrations/
+COPY --from=build /app/packages/sdks/sdk/package.json ./packages/sdks/sdk/
+COPY --from=build /app/packages/sdks/_info/package.json ./packages/sdks/_info/
+COPY --from=build /app/patches ./patches
+
+# Install production dependencies only
+RUN pnpm install --frozen-lockfile --prod && \
+    pnpm rebuild && \
+    pnpm store prune
+
+# FINAL - Minimal runtime image
+FROM base AS runner
+
+ENV NODE_ENV=production
+ENV npm_config_build_from_source=true
+
+WORKDIR /app
+
+# Copy workspace files
+COPY --from=build /app/package.json ./
+COPY --from=build /app/pnpm-workspace.yaml ./
+
+# Copy production node_modules
+COPY --from=prod /app/node_modules ./node_modules
+
+# Copy built app with .output directory
+COPY --from=build /app/apps/start/.output ./apps/start/.output
+COPY --from=build /app/apps/start/dist ./apps/start/dist
+COPY --from=build /app/apps/start/package.json ./apps/start/
+
+# Copy necessary packages
+COPY --from=build /app/packages/db ./packages/db
+COPY --from=build /app/packages/trpc ./packages/trpc
+COPY --from=build /app/packages/auth ./packages/auth
+COPY --from=build /app/packages/json ./packages/json
+COPY --from=build /app/packages/common ./packages/common
+COPY --from=build /app/packages/payments ./packages/payments
+COPY --from=build /app/packages/constants ./packages/constants
+COPY --from=build /app/packages/validation ./packages/validation
+COPY --from=build /app/packages/integrations ./packages/integrations
+COPY --from=build /app/packages/sdks/sdk ./packages/sdks/sdk
+COPY --from=build /app/packages/sdks/_info ./packages/sdks/_info
+COPY --from=build /app/tooling/typescript ./tooling/typescript
+
+WORKDIR /app/apps/start
+
+EXPOSE 3000
+
+# Start the Tanstack Start server
+CMD ["node", ".output/server/index.mjs"]

apps/start/package.json

@@ -65,6 +65,7 @@
     "@tailwindcss/typography": "^0.5.15",
     "@tailwindcss/vite": "^4.0.6",
     "@tanstack/match-sorter-utils": "^8.19.4",
+    "@tanstack/nitro-v2-vite-plugin": "^1.133.19",
     "@tanstack/react-devtools": "^0.7.6",
     "@tanstack/react-query": "^5.90.2",
     "@tanstack/react-query-devtools": "^5.90.2",

apps/start/src/components/providers.tsx

@@ -12,21 +12,12 @@ import { ThemeProvider } from './theme-provider';
 export function Providers({ children }: { children: React.ReactNode }) {
   const storeRef = useRef<AppStore>(undefined);
   if (!storeRef.current) {
-    // Create the store instance the first time this renders
     storeRef.current = makeStore();
   }
 
   return (
     <NuqsAdapter>
       <ThemeProvider>
-        {/* {import.meta.env.VITE_OP_CLIENT_ID && (
-          <OpenPanelComponent
-            clientId={import.meta.env.VITE_OP_CLIENT_ID}
-            trackScreenViews
-            trackOutgoingLinks
-            trackAttributes
-          />
-        )} */}
         <ReduxProvider store={storeRef.current}>
           <TooltipProvider delayDuration={200}>
             {children}

apps/start/src/components/sidebar.tsx

@@ -1,13 +1,9 @@
+import { useAppContext } from '@/hooks/use-app-context';
 import { useTRPC } from '@/integrations/trpc/react';
 import { cn } from '@/utils/cn';
 import type { IServiceOrganization } from '@openpanel/db';
 import { useQuery } from '@tanstack/react-query';
-import {
-  Link,
-  useLocation,
-  useParams,
-  useRouteContext,
-} from '@tanstack/react-router';
+import { Link, useLocation, useParams } from '@tanstack/react-router';
 import { MenuIcon, XIcon } from 'lucide-react';
 import { useEffect, useState } from 'react';
 import { FeedbackButton } from './feedback-button';
@@ -81,6 +77,7 @@ export function SidebarContainer({
 }: SidebarContainerProps) {
   const [active, setActive] = useState(false);
   const location = useLocation();
+  const { isSelfHosted } = useAppContext();
 
   useEffect(() => {
     setActive(false);
@@ -135,7 +132,7 @@ export function SidebarContainer({
 
           <div className="mt-auto w-full ">
             <FeedbackButton />
-            {import.meta.env.VITE_SELF_HOSTED === 'true' && (
+            {isSelfHosted && (
               <div className={cn('text-sm w-full text-center')}>
                 Self-hosted instance
               </div>

apps/start/src/hooks/use-app-context.ts

@@ -5,12 +5,13 @@ export function useAppContext() {
     strict: false,
   });
 
-  if (!params.apiUrl || !params.dashboardUrl) {
+  if (!params.apiUrl || !params.dashboardUrl || !params.isSelfHosted) {
     throw new Error('API URL or dashboard URL is not set');
   }
 
   return {
     apiUrl: params.apiUrl,
     dashboardUrl: params.dashboardUrl,
+    isSelfHosted: params.isSelfHosted,
   };
 }

apps/start/src/routeTree.gen.ts

@@ -16,6 +16,8 @@ import { Route as PublicRouteImport } from './routes/_public'
 import { Route as LoginRouteImport } from './routes/_login'
 import { Route as AppRouteImport } from './routes/_app'
 import { Route as IndexRouteImport } from './routes/index'
+import { Route as ApiHealthcheckRouteImport } from './routes/api/healthcheck'
+import { Route as ApiConfigRouteImport } from './routes/api/config'
 import { Route as PublicOnboardingRouteImport } from './routes/_public.onboarding'
 import { Route as LoginResetPasswordRouteImport } from './routes/_login.reset-password'
 import { Route as LoginLoginRouteImport } from './routes/_login.login'
@@ -112,6 +114,16 @@ const IndexRoute = IndexRouteImport.update({
   path: '/',
   getParentRoute: () => rootRouteImport,
 } as any)
+const ApiHealthcheckRoute = ApiHealthcheckRouteImport.update({
+  id: '/api/healthcheck',
+  path: '/api/healthcheck',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const ApiConfigRoute = ApiConfigRouteImport.update({
+  id: '/api/config',
+  path: '/api/config',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const PublicOnboardingRoute = PublicOnboardingRouteImport.update({
   id: '/onboarding',
   path: '/onboarding',
@@ -459,6 +471,8 @@ export interface FileRoutesByFullPath {
   '/login': typeof LoginLoginRoute
   '/reset-password': typeof LoginResetPasswordRoute
   '/onboarding': typeof PublicOnboardingRoute
+  '/api/config': typeof ApiConfigRoute
+  '/api/healthcheck': typeof ApiHealthcheckRoute
   '/$organizationId/$projectId': typeof AppOrganizationIdProjectIdRoute
   '/$organizationId/billing': typeof AppOrganizationIdBillingRoute
   '/$organizationId/settings': typeof AppOrganizationIdSettingsRoute
@@ -513,6 +527,8 @@ export interface FileRoutesByTo {
   '/login': typeof LoginLoginRoute
   '/reset-password': typeof LoginResetPasswordRoute
   '/onboarding': typeof PublicOnboardingRoute
+  '/api/config': typeof ApiConfigRoute
+  '/api/healthcheck': typeof ApiHealthcheckRoute
   '/$organizationId/$projectId': typeof AppOrganizationIdProjectIdRoute
   '/$organizationId/billing': typeof AppOrganizationIdBillingRoute
   '/$organizationId/settings': typeof AppOrganizationIdSettingsRoute
@@ -566,6 +582,8 @@ export interface FileRoutesById {
   '/_login/login': typeof LoginLoginRoute
   '/_login/reset-password': typeof LoginResetPasswordRoute
   '/_public/onboarding': typeof PublicOnboardingRoute
+  '/api/config': typeof ApiConfigRoute
+  '/api/healthcheck': typeof ApiHealthcheckRoute
   '/_app/$organizationId/$projectId': typeof AppOrganizationIdProjectIdRoute
   '/_app/$organizationId/billing': typeof AppOrganizationIdBillingRoute
   '/_app/$organizationId/settings': typeof AppOrganizationIdSettingsRoute
@@ -630,6 +648,8 @@ export interface FileRouteTypes {
     | '/login'
     | '/reset-password'
     | '/onboarding'
+    | '/api/config'
+    | '/api/healthcheck'
     | '/$organizationId/$projectId'
     | '/$organizationId/billing'
     | '/$organizationId/settings'
@@ -684,6 +704,8 @@ export interface FileRouteTypes {
     | '/login'
     | '/reset-password'
     | '/onboarding'
+    | '/api/config'
+    | '/api/healthcheck'
     | '/$organizationId/$projectId'
     | '/$organizationId/billing'
     | '/$organizationId/settings'
@@ -736,6 +758,8 @@ export interface FileRouteTypes {
     | '/_login/login'
     | '/_login/reset-password'
     | '/_public/onboarding'
+    | '/api/config'
+    | '/api/healthcheck'
     | '/_app/$organizationId/$projectId'
     | '/_app/$organizationId/billing'
     | '/_app/$organizationId/settings'
@@ -799,6 +823,8 @@ export interface RootRouteChildren {
   LoginRoute: typeof LoginRouteWithChildren
   PublicRoute: typeof PublicRouteWithChildren
   StepsRoute: typeof StepsRouteWithChildren
+  ApiConfigRoute: typeof ApiConfigRoute
+  ApiHealthcheckRoute: typeof ApiHealthcheckRoute
   ShareOverviewShareIdRoute: typeof ShareOverviewShareIdRoute
 }
 
@@ -839,6 +865,20 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexRouteImport
       parentRoute: typeof rootRouteImport
     }
+    '/api/healthcheck': {
+      id: '/api/healthcheck'
+      path: '/api/healthcheck'
+      fullPath: '/api/healthcheck'
+      preLoaderRoute: typeof ApiHealthcheckRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/api/config': {
+      id: '/api/config'
+      path: '/api/config'
+      fullPath: '/api/config'
+      preLoaderRoute: typeof ApiConfigRouteImport
+      parentRoute: typeof rootRouteImport
+    }
     '/_public/onboarding': {
       id: '/_public/onboarding'
       path: '/onboarding'
@@ -1631,6 +1671,8 @@ const rootRouteChildren: RootRouteChildren = {
   LoginRoute: LoginRouteWithChildren,
   PublicRoute: PublicRouteWithChildren,
   StepsRoute: StepsRouteWithChildren,
+  ApiConfigRoute: ApiConfigRoute,
+  ApiHealthcheckRoute: ApiHealthcheckRoute,
   ShareOverviewShareIdRoute: ShareOverviewShareIdRoute,
 }
 export const routeTree = rootRouteImport

apps/start/src/routes/__root.tsx

@@ -30,6 +30,7 @@ interface MyRouterContext {
   trpc: TRPCOptionsProxy<AppRouter>;
   apiUrl: string;
   dashboardUrl: string;
+  isSelfHosted: boolean;
 }
 
 export const Route = createRootRouteWithContext<MyRouterContext>()({

apps/start/src/routes/api/config.tsx

@@ -0,0 +1,19 @@
+import { Sidebar } from '@/components/sidebar';
+import { getServerEnvs } from '@/server/get-envs';
+import { Outlet, createFileRoute, redirect } from '@tanstack/react-router';
+
+// Nothing sensitive here, its client environment variables which is good for debugging
+export const Route = createFileRoute('/api/config')({
+  server: {
+    handlers: {
+      GET: async () => {
+        const envs = await getServerEnvs();
+        return new Response(JSON.stringify(envs), {
+          headers: {
+            'Content-Type': 'application/json',
+          },
+        });
+      },
+    },
+  },
+});

apps/start/src/routes/api/healthcheck.tsx

@@ -0,0 +1,11 @@
+import { createFileRoute } from '@tanstack/react-router';
+
+export const Route = createFileRoute('/api/healthcheck')({
+  server: {
+    handlers: {
+      GET: async () => {
+        return new Response('OK');
+      },
+    },
+  },
+});

apps/start/src/server/get-envs.ts

@@ -7,6 +7,7 @@ export const getServerEnvs = createServerFn().handler(async () => {
     dashboardUrl: String(
       process.env.DASHBOARD_URL || process.env.NEXT_PUBLIC_DASHBOARD_URL,
     ),
+    isSelfHosted: process.env.SELF_HOSTED !== undefined,
   };
 
   return envs;

apps/start/vite.config.ts

@@ -1,21 +1,34 @@
 import { cloudflare } from '@cloudflare/vite-plugin';
 import { wrapVinxiConfigWithSentry } from '@sentry/tanstackstart-react';
 import tailwindcss from '@tailwindcss/vite';
+import { nitroV2Plugin } from '@tanstack/nitro-v2-vite-plugin';
 import { tanstackStart } from '@tanstack/react-start/plugin/vite';
 import viteReact from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
 import viteTsConfigPaths from 'vite-tsconfig-paths';
 
-const config = defineConfig({
-  plugins: [
-    cloudflare({ viteEnvironment: { name: 'ssr' } }),
-    viteTsConfigPaths({
-      projects: ['./tsconfig.json'],
+const plugins = [
+  viteTsConfigPaths({
+    projects: ['./tsconfig.json'],
+  }),
+  tailwindcss(),
+  tanstackStart(),
+  viteReact(),
+];
+
+if (process.env.NITRO) {
+  plugins.unshift(
+    nitroV2Plugin({
+      preset: 'node-server',
+      compatibilityDate: '2025-10-21',
     }),
-    tailwindcss(),
-    tanstackStart(),
-    viteReact(),
-  ],
+  );
+} else {
+  plugins.unshift(cloudflare({ viteEnvironment: { name: 'ssr' } }));
+}
+
+const config = defineConfig({
+  plugins,
 });
 
 export default wrapVinxiConfigWithSentry(config, {