fix: Resolve repeating Joyride tour on mobile and release v0.21.11

Author: drumnation

.brain/1-agent-smith/b-features/12-thank-you-job/12-thank-you-job.md

@@ -0,0 +1,61 @@
+✅ What to Do Next
+1. Create a “Post-Booking Thank You” Page
+URL Example:
+/thank-you-job
+/thank-you-consulting
+
+2. Suggested Content for /thank-you-job
+Headline:
+
+👋 Thanks for booking a time to chat!
+
+Subheadline:
+
+While you’re here, here are a few resources that’ll give you a deeper sense of my work and what I bring to a team.
+
+Content Blocks (3-card layout):
+
+💡 Portfolio Homepage – davidmieloch.com
+
+🎨 Photoshop in the Browser – Shows frontend depth and system design
+
+🧠 Brain Garden – If the role touches AI or internal tools
+
+Brilliant question — and this is where your **content marketing instincts** and **AI-native positioning** intersect.
+
+---
+
+## 🧠 Should You Repeat Content? Yes — Strategically.
+
+| Concern | Reality |
+|--------|---------|
+| "I don't want to burn my best stuff early." | Repetition is fine. Most people only click one thing — the rest is reinforcement. |
+| "What if I want to send this blog later?" | You still can. **Context + timing** make repeat content feel fresh. |
+| "Won’t they see it twice?" | If they do, it reinforces credibility and consistency, not fatigue. |
+| "Should I link my site or a blog post?" | Depends on the event intent (job lead vs. consulting vs. press).
+
+---
+
+## 🔥 Best Practice for You
+
+### 🔹 **Job Booking → Redirect to “Start Here” page on your site**
+Let this act like a “curated landing zone” — not a blog post, not just your homepage. It should say:
+
+> ✅ “Thanks for booking”  
+> ✅ “Here’s how to get the most out of our call”  
+> ✅ “Here’s a quick tour of my work” (with 1–3 hand-picked links)
+
+Those links **can include** your blog posts, but you’re not “burning” them — you’re surfacing them **contextually** as pre-call prep.
+
+You can still drip those same posts later in email follow-ups with new framing:
+- "Since we discussed internal tooling, here’s a post about how I approached it at Scala"
+- "We touched on AI systems briefly — here's a deeper dive on my Brain Garden approach"
+
+---
+
+## ✅ Recommendation:
+
+- Build a dedicated **`/thank-you-job` page** now (I’ll help write it)
+- Redirect Calendly there
+- Include **3 assets max** (site, 1 blog, 1 project/case study)
+- Leave room to drip them again later — with story-driven framing

.vscode/settings.json

@@ -19,5 +19,6 @@
         "ignorePattern": [".brain/**/*.md", ".cursorrules"]
     },
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "dotenv.enableAutocloaking": false
 }

CHANGELOG.md

@@ -8,6 +8,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [Unreleased]
 
 ### Added
+
+### Changed
+
+### Deprecated
+
+### Removed
+
+### Fixed
+
+### Security
+
+## [0.21.11] - 2025-04-30
+
+### Added
+- Implemented new landing page design and functionality.
 - Created InputContainer component with tabbed interface to switch between file upload and text input [#Feature] [#UI]
 - Created UI components for Perfect Fit Analyzer following Storybook-First approach (FileDropzone and JobDescriptionTextInput) [#Feature] [#UI]
 - Created OpenAI API integration for Perfect Fit Analyzer with rate limiting and response formatting [#Feature]
@@ -30,6 +45,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fixed infinite render loop in WhitePaper components (AiSkepticToExpert and CoreComponentsSection) by removing console.log statements and optimizing renders [#BugFix] [#Performance]
 - Fixed ducked audio functionality so that music automatically switches to quieter ducked versions when voice narration is playing [#BugFix] [#UX]
 - Fixed TypeScript errors related to null checks for pathname from Next.js usePathname() hook [#BugFix] [#TypeSafety]
+- Fixed Joyride tour repeating on mobile due to incorrect localStorage key usage in `JoyrideProvider`.
 
 ### Improved
 
@@ -179,4 +195,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
   - Created reusable `AnimatedSection` component to reduce duplication
   - Removed debugging console logs
   - Simplified icon processing logic
-  - Improved overall component structure
+  - Improved overall component structure
+
+### Deprecated
+
+### Removed
+
+### Security

app/thank-you-job/page.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import React, { Suspense } from 'react';
+import dynamic from 'next/dynamic';
+import { PageWrapper } from '@shared-components/templates/PageWrapper';
+
+// Dynamic import of BestPractices
+const ThankYouJob = dynamic(
+    () => import('@/shared-components/pages/ThankYouJob').then((mod) => mod.ThankYouJob),
+    {
+        loading: () => null,
+        ssr: false
+    }
+);
+
+// Add a console log to see if this file is being used
+console.log('Loading thank-you-job page');
+
+const ThankYouJobPage = () => {
+    return (
+        <PageWrapper>
+            <Suspense fallback={null}>
+                <ThankYouJob />
+            </Suspense>
+        </PageWrapper>
+    );
+};
+
+export default ThankYouJobPage; 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "david-portfolio",
-  "version": "0.21.10",
+  "version": "0.21.11",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3001",
@@ -45,7 +45,7 @@
     "@mantine/dates": "^7.17.1",
     "@mantine/dropzone": "^7.17.3",
     "@mantine/form": "^7.17.1",
-    "@mantine/hooks": "^7.17.1",
+    "@mantine/hooks": "^7.17.5",
     "@mantine/notifications": "^7.17.5",
     "@microsoft/clarity": "^1.0.0",
     "@react-spring/animated": "9.5.5",

pnpm-lock.yaml

@@ -7,7 +7,7 @@ export type NodeType = 'mainComponent' | 'subComponent' | 'system';
 /**
  * Custom node data interface with index signature
  */
-export interface CustomNodeData extends Record<string, unknown> { 
+export interface CustomNodeData extends Record<string, unknown> {
   label: string;
   icon?: string;
   style?: React.CSSProperties;
@@ -36,25 +36,25 @@ export interface BrainGardenComponentsDiagramProps {
    * Optional CSS class name for styling the container
    */
   className?: string;
-  
+
   /**
    * Optional theme for the diagram
    * @default 'default'
    */
   theme?: 'default' | 'dark' | 'forest' | 'neutral';
-  
+
   /**
    * Optional width for the diagram container
    * @default '100%'
    */
   width?: string | number;
-  
+
   /**
    * Optional height for the diagram container
    * @default '600px'
    */
   height?: string | number;
-  
+
   /**
    * Optional background color for the diagram container
    */
@@ -77,7 +77,7 @@ export interface BrainGardenComponentsDiagramProps {
    * @default 'Brain Garden Core Components Diagram showing Knowledge System, Prompt System, and Structured Documentation'
    */
   accessibilityDescription?: string;
-  
+
   /**
    * Optional title for the diagram
    * @default 'Brain Garden Core Components'
@@ -98,7 +98,7 @@ export interface BrainGardenComponentsDiagramProps {
   /**
    * Custom edges for the diagram
    */
-  customEdges?: Array<{id: string, source: string, target: string, style?: CSSProperties}>;
+  customEdges?: Array<{ id: string, source: string, target: string, style?: CSSProperties }>;
 
   /**
    * Callback function when a node is clicked
@@ -122,7 +122,7 @@ export interface BrainGardenComponentsDiagramProps {
    * @default 'shift'
    */
   selectionKeys?: string[];
-  
+
   /**
    * Whether the diagram is in edge creation mode, allowing nodes to be connected
    * @default false
@@ -133,7 +133,7 @@ export interface BrainGardenComponentsDiagramProps {
 /**
  * Internal props for the DiagramFlow component
  */
-export interface DiagramFlowProps extends BrainGardenComponentsDiagramProps {}
+export interface DiagramFlowProps extends BrainGardenComponentsDiagramProps { }
 
 /**
  * Theme style configuration
@@ -142,3 +142,5 @@ export interface ThemeStyles {
   backgroundColor?: string;
   color?: string;
 }
+
+export interface FlowState extends Record<string, unknown> { }