+6 -1

apps/web/src/components/Common/Layout.tsx

··· 16 16 import { useTheme } from "@/hooks/useTheme"; 17 17 import { useAccountStore } from "@/store/persisted/useAccountStore"; 18 18 import { hydrateAuthTokens, signOut } from "@/store/persisted/useAuthStore"; 19 19 + import { useBetaStore } from "@/store/persisted/useBetaStore"; 19 20 import { useProStore } from "@/store/persisted/useProStore"; 20 21 import ReloadTabsWatcher from "./ReloadTabsWatcher"; 21 22 ··· 24 25 const { theme } = useTheme(); 25 26 const { currentAccount, setCurrentAccount } = useAccountStore(); 26 27 const { setProBannerDismissed } = useProStore(); 28 28 + const { setBetaBannerDismissed } = useBetaStore(); 27 29 const isMounted = useIsClient(); 28 30 const { accessToken } = hydrateAuthTokens(); 29 31 ··· 37 39 }, []); 38 40 39 41 const { loading } = useMeQuery({ 40 40 - onCompleted: ({ me, proBanner }) => { 42 42 + onCompleted: ({ me, proBanner, betaBanner }) => { 41 43 setCurrentAccount(me.loggedInAs.account); 42 44 if (proBanner?.__typename === "Post") { 43 45 setProBannerDismissed(proBanner.operations?.dismissed ?? false); 46 46 + } 47 47 + if (betaBanner?.__typename === "Post") { 48 48 + setBetaBannerDismissed(betaBanner.operations?.dismissed ?? false); 44 49 } 45 50 }, 46 51 onError,

+10 -10

apps/web/src/components/Shared/Sidebar/BetaBanner.tsx

··· 13 13 import useTransactionLifecycle from "@/hooks/useTransactionLifecycle"; 14 14 import useWaitForTransactionToComplete from "@/hooks/useWaitForTransactionToComplete"; 15 15 import { useAccountStore } from "@/store/persisted/useAccountStore"; 16 16 - import { useProStore } from "@/store/persisted/useProStore"; 16 16 + import { useBetaStore } from "@/store/persisted/useBetaStore"; 17 17 18 18 const BetaBanner = () => { 19 19 const { currentAccount } = useAccountStore(); 20 20 - const { proBannerDismissed, setProBannerDismissed } = useProStore(); 20 20 + const { betaBannerDismissed, setBetaBannerDismissed } = useBetaStore(); 21 21 const handleTransactionLifecycle = useTransactionLifecycle(); 22 22 const waitForTransactionToComplete = useWaitForTransactionToComplete(); 23 23 const [isSubmitting, setIsSubmitting] = useState(false); ··· 31 31 errorToast(error); 32 32 }, []); 33 33 34 34 - const [dismissProBanner, { loading }] = useAddPostNotInterestedMutation({ 34 34 + const [dismissBetaBanner, { loading }] = useAddPostNotInterestedMutation({ 35 35 onCompleted: () => { 36 36 toast.success("Dismissed"); 37 37 - setProBannerDismissed(true); 38 38 - void logEvent("Dismiss Pro Banner"); 37 37 + setBetaBannerDismissed(true); 38 38 + void logEvent("Dismiss Beta Banner"); 39 39 }, 40 40 onError, 41 41 - variables: { request: { post: BANNER_IDS.PRO } } 41 41 + variables: { request: { post: BANNER_IDS.BETA } } 42 42 }); 43 43 44 44 const [joinGroup] = useJoinGroupMutation({ ··· 56 56 return null; 57 57 } 58 58 59 59 - if (currentAccount?.isBeta || proBannerDismissed) { 59 59 + if (currentAccount?.isBeta || betaBannerDismissed) { 60 60 return null; 61 61 } 62 62 63 63 - const handleDismissProBanner = async () => { 64 64 - return await dismissProBanner(); 63 63 + const handleDismissBetaBanner = async () => { 64 64 + return await dismissBetaBanner(); 65 65 }; 66 66 67 67 const handleJoinBeta = async () => { ··· 77 77 <button 78 78 className="absolute top-3 right-3 cursor-pointer text-gray-400 hover:text-gray-600" 79 79 disabled={loading} 80 80 - onClick={handleDismissProBanner} 80 80 + onClick={handleDismissBetaBanner} 81 81 type="button" 82 82 > 83 83 <XCircleIcon className="size-5" />

+18

apps/web/src/store/persisted/useBetaStore.ts

··· 1 1 + import { Localstorage } from "@hey/data/storage"; 2 2 + import { createPersistedTrackedStore } from "@/store/createTrackedStore"; 3 3 + 4 4 + interface State { 5 5 + betaBannerDismissed: boolean; 6 6 + setBetaBannerDismissed: (betaBannerDismissed: boolean) => void; 7 7 + } 8 8 + 9 9 + const { useStore: useBetaStore } = createPersistedTrackedStore<State>( 10 10 + (set) => ({ 11 11 + betaBannerDismissed: false, 12 12 + setBetaBannerDismissed: (betaBannerDismissed: boolean) => 13 13 + set(() => ({ betaBannerDismissed })) 14 14 + }), 15 15 + { name: Localstorage.BetaStore } 16 16 + ); 17 17 + 18 18 + export { useBetaStore };

+1

packages/data/storage.ts

··· 1 1 export const Localstorage = { 2 2 AccountStore: "account.store", 3 3 AuthStore: "auth.store", 4 4 + BetaStore: "beta.store", 4 5 HomeTabStore: "home-tab.store", 5 6 NotificationStore: "notification.store", 6 7 PreferencesStore: "preferences.store",