feat(misc): Add GitHub star toast

CHANGELOG.md

@@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add search context to ask sourcebot context selector. [#397](https://github.com/sourcebot-dev/sourcebot/pull/397)
 - Add ability to include/exclude connection in search context. [#399](https://github.com/sourcebot-dev/sourcebot/pull/399)
 - Search context refactor to search scope and demo card UI changes. [#405](https://github.com/sourcebot-dev/sourcebot/pull/405)
+- Add GitHub star toast. [#409](https://github.com/sourcebot-dev/sourcebot/pull/409)
 
 ### Fixed
 - Fixed multiple writes race condition on config file watcher. [#398](https://github.com/sourcebot-dev/sourcebot/pull/398)

packages/web/src/app/[domain]/components/githubStarToast.tsx

@@ -0,0 +1,84 @@
+'use client';
+
+import { useToast } from "@/components/hooks/use-toast";
+import { ToastAction } from "@/components/ui/toast";
+import { useEffect } from "react";
+import { GitHubLogoIcon } from "@radix-ui/react-icons";
+import { captureEvent } from "@/hooks/useCaptureEvent";
+
+const POPUP_SHOWN_COOKIE = "github_popup_shown";
+const POPUP_START_TIME_COOKIE = "github_popup_start_time";
+const POPUP_DELAY_S = 60;
+const SOURCEBOT_GITHUB_URL = "https://github.com/sourcebot-dev/sourcebot";
+
+function getCookie(name: string): string | null {
+ if (typeof document === "undefined") return null;
+
+ const cookies = document.cookie.split(';').map(cookie => cookie.trim());
+ const targetCookie = cookies.find(cookie => cookie.startsWith(`${name}=`));
+
+ if (!targetCookie) return null;
+
+ return targetCookie.substring(`${name}=`.length);
+}
+
+function setCookie(name: string, value: string, days: number = 365) {
+ if (typeof document === "undefined") return;
+
+ try {
+ const expires = new Date();
+ expires.setTime(expires.getTime() + (days * 24 * 60 * 60 * 1000));
+ document.cookie = `${name}=${value}; expires=${expires.toUTCString()}; path=/; SameSite=Lax`;
+ } catch (error) {
+ console.warn('Failed to set GitHub popup cookie:', error);
+ }
+}
+
+export const GitHubStarToast = () => {
+ const { toast } = useToast();
+
+ useEffect(() => {
+ const hasShownPopup = getCookie(POPUP_SHOWN_COOKIE);
+ const startTime = getCookie(POPUP_START_TIME_COOKIE);
+
+ if (hasShownPopup) {
+ return;
+ }
+
+ const currentTime = Date.now();
+ if (!startTime) {
+ setCookie(POPUP_START_TIME_COOKIE, currentTime.toString());
+ return;
+ }
+
+ const elapsed = currentTime - parseInt(startTime, 10);
+ if (elapsed >= (POPUP_DELAY_S * 1000)) {
+ toast({
+ title: "Star us on GitHub ❤️",
+ description: "If you've found Sourcebot useful, please consider starring us on GitHub. Your support means a lot!",
+ duration: 15 * 1000,
+ action: (
+ <div className="flex flex-col gap-1">
+ <ToastAction
+ altText="GitHub Button"
+ onClick={() => {
+ captureEvent('wa_github_star_toast_clicked', {});
+ window.open(SOURCEBOT_GITHUB_URL, "_blank");
+ }}
+ >
+ <div className="flex items-center gap-2">
+ <GitHubLogoIcon className="w-4 h-4" />
+ Sourcebot
+ </div>
+ </ToastAction>
+ </div>
+ )
+ });
+
+ captureEvent('wa_github_star_toast_displayed', {});
+ setCookie(POPUP_SHOWN_COOKIE, "true");
+ }
+ }, [toast]);
+
+ return null;
+} 

packages/web/src/app/[domain]/layout.tsx

@@ -21,6 +21,7 @@ import { GcpIapAuth } from "./components/gcpIapAuth";
 import { getAnonymousAccessStatus, getMemberApprovalRequired } from "@/actions";
 import { JoinOrganizationCard } from "@/app/components/joinOrganizationCard";
 import { LogoutEscapeHatch } from "@/app/components/logoutEscapeHatch";
+import { GitHubStarToast } from "./components/githubStarToast";
 
 interface LayoutProps {
  children: React.ReactNode,
@@ -134,6 +135,7 @@ export default async function Layout({
  <SyntaxGuideProvider>
  {children}
  <SyntaxReferenceGuide />
+ <GitHubStarToast />
  </SyntaxGuideProvider>
  )
 }

packages/web/src/lib/posthogEvents.ts

@@ -293,5 +293,8 @@ export type PosthogEventMap = {
  exampleTitle: string,
  exampleUrl: string,
  },
+ //////////////////////////////////////////////////////////////////
+ wa_github_star_toast_displayed: {},
+ wa_github_star_toast_clicked: {},
 } 
 export type PosthogEvent = keyof PosthogEventMap;