Ability to quickly toggle Surprise Me feature

apps/legacy/src/hooks.server.ts

@@ -1,4 +1,4 @@
-import type { HandleServerError } from '@sveltejs/kit';
+import { redirect, type HandleServerError } from '@sveltejs/kit';
 
 type Redirects = { [key: string]: string };
 
@@ -14,6 +14,20 @@ export async function handle({ event, resolve }) {
     return Response.redirect(new URL(legacySitemapRedirects[path], event.url.origin), 301);
   }
 
+  // Handle Surprise Me feature
+  const accessToken = event.url.searchParams.get('access');
+
+  if (accessToken === 'welcome-friend') {
+    event.cookies.set('surprise-me-access', 'granted', {
+      path: '/',
+      maxAge: 60 * 60 * 24 * 30, // 30 days
+    });
+
+    // Redirect to the same page without the query param
+    const redirectTo = event.url.pathname;
+    redirect(302, redirectTo);
+  }
+
   return resolve(event);
 }
 

apps/legacy/src/lib/components/Profile.svelte

@@ -13,9 +13,10 @@
   import { upperFirstLetter } from '@repo/shared/functions/formatters/names';
   interface Props {
     profile: GrantmakersExtractedDataObj;
+    hasSurpriseMeAccess: boolean;
   }
 
-  let { profile }: Props = $props();
+  let { profile, hasSurpriseMeAccess }: Props = $props();
 
   // Mimic Jekyll
   const site = {
@@ -137,8 +138,19 @@
             {/if}
           </div>
           <div class="col m6 l6 xl6 hide-on-med-and-down print-hidden">
+            {#if hasSurpriseMeAccess}
+              <div class="fixed-action-btn">
+                <a
+                  href={'/profiles/random/'}
+                  class="btn-floating btn-large blue-grey tooltipped"
+                  data-position="left"
+                  data-tooltip="Fetch a random profile"
+                >
+                  <i class="large material-icons">cached</i>
+                </a>
+              </div>
+            {/if}
             <ul class="nav-primary right">
-              <li><a href="/profiles/random/">Surprise me</a></li>
               <li><a href="#people" data-ga="People">People</a></li>
               <li><a href="#grants" data-ga="Grants">Grants</a></li>
               <li><a href="#application-info" data-ga="Application Guidelines">Guidelines</a></li>

apps/legacy/src/routes/profiles/v0/[ein]/+layout.server.ts

@@ -0,0 +1,5 @@
+export function load({ cookies }) {
+  return {
+    hasSurpriseMeAccess: cookies.get('surprise-me-access') === 'granted',
+  };
+}

apps/legacy/src/routes/profiles/v0/[ein]/+page.svelte

@@ -7,12 +7,12 @@
   }
 
   let { data }: Props = $props();
-  const { profile } = data;
+  const { profile, hasSurpriseMeAccess } = data;
 </script>
 
 <div class="profile-page" data-sveltekit-preload-data="off">
   {#if profile}
-    <Profile {profile} />
+    <Profile {profile} {hasSurpriseMeAccess} />
   {:else}
     <p>No profile data available</p>
   {/if}