[Feat] Add Roomote Cloud analytics and support integrations

apps/web/scripts/trigger-task-suggestions.ts

@@ -94,6 +94,7 @@ function buildAuth(user: typeof users.$inferSelect): UserAuthSuccess {
     primaryEmail: email,
     featureFlags: {} as Record<FeatureFlag, boolean>,
     anonymousAnalyticsEnabled: false,
+    cloudEnabled: false,
     resource: {
       username,
       fullName: name,

apps/web/src/app/(onboarding)/onboarding/layout.tsx

@@ -8,7 +8,7 @@ import { useRedirectToSignIn } from '@/hooks/useSignInRedirect';
 import { useUser } from '@/hooks/useUser';
 import { DEFAULT_SETUP_REDIRECT_PATH, requiresSetup } from '@/lib/setup-status';
 import { useTRPC } from '@/trpc/client';
-import { FramedSurface, UserMenu } from '@/components/layout';
+import { FramedSurface, RoomoteWordmark, UserMenu } from '@/components/layout';
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   const router = useRouter();
@@ -86,13 +86,15 @@ export default function Layout({ children }: { children: React.ReactNode }) {
 
   return (
     <div className="light text-foreground relative min-h-viewport w-full overflow-hidden bg-white md:h-viewport">
+      <RoomoteWordmark className="absolute top-8 left-8 h-8 hidden lg:block" />
       <div ref={setUserMenuPortalContainer} className="light text-foreground" />
       <FramedSurface
         variant="bold"
         frameClassName="m-0.5 md:m-2 h-[calc(var(--effective-viewport-height)-0.25rem)] w-[calc(100svw-0.25rem)] scroll-minimal overflow-hidden md:m-4 md:h-[calc(var(--effective-viewport-height)-2rem)] md:w-[calc(100vw-2rem)]"
         surfaceClassName="flex flex-col !overflow-y-auto !overflow-x-hidden md:items-center"
       >
-        <div className="z-50 flex w-full justify-end px-4 pt-4 md:fixed md:right-9 md:top-9 md:w-auto md:px-0 md:pt-0">
+        <div className="z-50 flex w-full gap-2 justify-end px-4 pt-4 md:fixed md:right-9 md:top-9 md:w-auto md:px-0 md:pt-0 ">
+          <RoomoteWordmark className="h-8 hidden sm:block lg:hidden" />
           <UserMenu portalContainer={userMenuPortalContainer} />
         </div>
         <div className="relative flex w-full max-w-3xl flex-col md:min-h-full">

apps/web/src/app/(onboarding)/setup/StepCommunicationConnect.tsx

@@ -127,7 +127,6 @@ export function StepCommunicationConnect({
                 </Button>
                 <Button
                   type="button"
-                  className="w-full sm:w-auto"
                   onClick={onContinue}
                   disabled={!primaryConversationReady}
                 >
@@ -157,7 +156,6 @@ export function StepCommunicationConnect({
       </p>
       <SetupFooter onBack={onBack}>
         <Button
-          className="w-full sm:w-auto"
           onClick={() => connectSlack.mutate()}
           disabled={connectSlack.isPending}
         >

apps/web/src/app/(onboarding)/setup/StepInvoke.tsx

@@ -19,6 +19,7 @@ import {
 } from '@/components/system';
 import { useTRPC } from '@/trpc/client';
 import { useEnvironments } from '@/hooks/environments/useEnvironments';
+import { useUser } from '@/hooks/useUser';
 import { buildInvokeMethods } from '../invokeMethods';
 import { StepTitle } from './StepTitle';
 import { getSetupStepDefinition } from './types';
@@ -48,6 +49,7 @@ export function StepInvoke({
 } = {}) {
   const router = useRouter();
   const trpc = useTRPC();
+  const { user } = useUser();
   const queryClient = useQueryClient();
   const environments = useEnvironments({ enabled: !onboardingTaskId });
   const commsStatus = useQuery(trpc.comms.status.queryOptions());
@@ -194,33 +196,36 @@ export function StepInvoke({
         ))}
       </div>
 
-      <div className="mt-4 flex items-start gap-2 border-t border-foreground/20 pt-4">
-        <Checkbox
-          aria-label="Toggle anonymous analytics"
-          className="mt-0.5"
-          checked={anonymousAnalyticsEnabled}
-          onCheckedChange={(checked) =>
-            setAnonymousAnalyticsEnabled(checked === true)
-          }
-        />
-        <div className="space-y-0.5">
-          <p className="text-sm font-semibold">Anonymous analytics</p>
-          <p className="text-sm text-muted-foreground">
-            Share usage stats with the {PRODUCT_NAME} team for product
-            improvements.
-            <br />
-            No PII, code or conversation content is ever shared. Accrues good
-            karma.
-          </p>
+      {!user?.cloudEnabled && (
+        <div className="mt-4 flex items-start gap-2 border-t border-foreground/20 pt-4">
+          <Checkbox
+            aria-label="Toggle anonymous analytics"
+            className="mt-0.5"
+            checked={anonymousAnalyticsEnabled}
+            onCheckedChange={(checked) =>
+              setAnonymousAnalyticsEnabled(checked === true)
+            }
+          />
+          <div className="space-y-0.5">
+            <p className="text-sm font-semibold">Anonymous analytics</p>
+            <p className="text-sm text-muted-foreground">
+              Share usage stats with the {PRODUCT_NAME} team for product
+              improvements.
+              <br />
+              No PII, code or conversation content is ever shared. Accrues good
+              karma.
+            </p>
+          </div>
         </div>
-      </div>
+      )}
 
       <div className="mt-3 flex">
         <Button
-          className="w-full sm:w-auto"
           onClick={() => {
             onTryItOut?.();
-            completeSetup.mutate({ anonymousAnalyticsEnabled });
+            completeSetup.mutate(
+              user?.cloudEnabled ? {} : { anonymousAnalyticsEnabled },
+            );
           }}
           disabled={completeSetup.isPending}
         >

apps/web/src/app/(onboarding)/setup/StepSetupToken.tsx

@@ -49,11 +49,7 @@ export function StepSetupToken({
           placeholder="Setup token"
           data-1p-ignore
         />
-        <Button
-          type="submit"
-          className="w-full sm:w-auto"
-          disabled={trimmedValue.length === 0}
-        >
+        <Button type="submit" disabled={trimmedValue.length === 0}>
           Continue
           <ArrowRight />
         </Button>

apps/web/src/app/(onboarding)/setup/StepSourceControlConnect.tsx

@@ -337,7 +337,6 @@ export function StepSourceControlConnect({
               </p>
             ) : (
               <Button
-                className="w-full sm:w-auto"
                 onClick={() =>
                   authenticateAdoAccount.mutate(
                     `${window.location.pathname}?step=source-control-connect`,
@@ -360,7 +359,6 @@ export function StepSourceControlConnect({
           <p>{githubCopy}</p>
           <SetupFooter onBack={onBack}>
             <Button
-              className="w-full sm:w-auto"
               onClick={() =>
                 createInstallation.mutate(
                   `${window.location.pathname}?step=source-control-connect`,
@@ -384,7 +382,6 @@ export function StepSourceControlConnect({
           ) : null}
           <SetupFooter onBack={onBack}>
             <Button
-              className="w-full sm:w-auto"
               onClick={() => void handleSyncRepositories()}
               disabled={
                 syncRepositories.isPending || saveAdoLinkedAccount.isPending

apps/web/src/app/(onboarding)/setup/StepWelcome.tsx

@@ -18,7 +18,6 @@ export function StepWelcome({ onContinue }: { onContinue: () => void }) {
       </p>
       <Button
         size="default"
-        className="w-full sm:w-auto"
         onClick={() => {
           markSetupWelcomeSeen();
           onContinue();

apps/web/src/app/(onboarding)/setup/layout.tsx

@@ -38,17 +38,17 @@ export default function Layout({ children }: { children: React.ReactNode }) {
       translate="no"
       className="notranslate light text-foreground relative min-h-viewport w-full overflow-hidden bg-white md:h-viewport"
     >
+      <RoomoteWordmark className="absolute top-8 left-8 h-8 hidden lg:block" />
       <div ref={setUserMenuPortalContainer} className="light text-foreground" />
       <FramedSurface
         variant="bold"
         frameClassName="h-[calc(var(--effective-viewport-height)-0.25rem)] w-[calc(100svw-0.25rem)] scroll-minimal overflow-hidden"
         surfaceClassName="flex flex-col !overflow-y-auto !overflow-x-hidden md:items-center"
       >
-        <RoomoteWordmark className="absolute right-9 bottom-7 h-8 hidden md:block" />
-
         {isSignedIn ? (
           <>
-            <div className="z-50 flex w-full justify-end px-4 pt-4 md:fixed md:right-9 md:top-9 md:w-auto md:px-0 md:pt-0 ">
+            <div className="z-50 flex w-full gap-2 justify-end px-4 pt-4 md:fixed md:right-9 md:top-9 md:w-auto md:px-0 md:pt-0 ">
+              <RoomoteWordmark className="h-8 hidden sm:block lg:hidden" />
               <UserMenu portalContainer={userMenuPortalContainer} />
             </div>
           </>

apps/web/src/app/api/telemetry/route.ts

@@ -11,6 +11,7 @@ import {
 } from '@roomote/telemetry/server';
 
 import { authorize } from '@/lib/server/auth-context';
+import { Env, isRoomoteCloudEnabled } from '@/lib/server/env';
 
 export const runtime = 'nodejs';
 
@@ -54,12 +55,17 @@ export async function POST(request: NextRequest) {
 
   // captureEvent re-checks this per event; checking once up front just
   // avoids pointless id resolution work when analytics is disabled.
-  if (!(await isAnonymousAnalyticsEnabled())) {
+  if (
+    !(await isAnonymousAnalyticsEnabled(
+      isRoomoteCloudEnabled(Env.R_CLOUD_ENABLED),
+    ))
+  ) {
     return NextResponse.json({ accepted: 0 }, { status: 202 });
   }
 
   for (const event of parsed.data.events) {
     void captureEvent(event.event, {
+      cloudEnabled: isRoomoteCloudEnabled(Env.R_CLOUD_ENABLED),
       userId: authResult.userId,
       properties: event.properties,
       timestamp: event.timestamp,

apps/web/src/app/layout.tsx

@@ -8,6 +8,7 @@ import { RootProviders } from '@/components/layout/RootProviders';
 import { RouteTitle } from '@/components/layout/RouteTitle';
 import { getAppIcons } from '@/lib/app-icons';
 import { resolveAppEnv } from '@/lib/app-env';
+import { Env, isRoomoteCloudEnabled } from '@/lib/server/env';
 import { authorize } from '@/lib/server/auth-context';
 import { isSetupBootstrapOpen } from '@/lib/server/setup-bootstrap';
 import { getThemeBootScript } from '@/lib/shared/theme-boot';
@@ -126,6 +127,10 @@ export default async function RootLayout({
         <RootProviders
           authStatus={authStatus}
           authUser={authUser}
+          cloudEnabled={isRoomoteCloudEnabled(Env.R_CLOUD_ENABLED)}
+          intercomAppId={Env.R_INTERCOM_APP_ID}
+          posthogProjectKey={Env.R_POSTHOG_PROJECT_KEY}
+          posthogHost={Env.R_POSTHOG_HOST}
           setupBootstrapOpen={setupBootstrapOpen}
         >
           {children}