mirror of
https://github.com/AutoMaker-Org/automaker.git
synced 2026-01-30 06:12:03 +00:00
refactor: remove CoursePromoBadge component and related settings
- Deleted the CoursePromoBadge component from the sidebar and its associated logic. - Removed references to the hideMarketingContent setting from the settings view and appearance section. - Cleaned up related tests for marketing content visibility as they are no longer applicable.
This commit is contained in:
@@ -2,7 +2,6 @@ import { useState, useMemo, useEffect, useCallback, useRef } from "react";
|
||||
import { useNavigate, useLocation } from "@tanstack/react-router";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { useAppStore, formatShortcut, type ThemeMode } from "@/store/app-store";
|
||||
import { CoursePromoBadge } from "@/components/ui/course-promo-badge";
|
||||
import {
|
||||
FolderOpen,
|
||||
Plus,
|
||||
@@ -1942,8 +1941,6 @@ export function Sidebar() {
|
||||
"bg-gradient-to-t from-background/10 via-sidebar/50 to-transparent"
|
||||
)}
|
||||
>
|
||||
{/* Course Promo Badge */}
|
||||
<CoursePromoBadge sidebarOpen={sidebarOpen} />
|
||||
{/* Wiki Link */}
|
||||
{!hideWiki && (
|
||||
<div className="p-2 pb-0">
|
||||
|
||||
@@ -1,90 +0,0 @@
|
||||
|
||||
import * as React from "react";
|
||||
import { Sparkles, X } from "lucide-react";
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipContent,
|
||||
TooltipProvider,
|
||||
TooltipTrigger,
|
||||
} from "@/components/ui/tooltip";
|
||||
import { useAppStore } from "@/store/app-store";
|
||||
|
||||
interface CoursePromoBadgeProps {
|
||||
sidebarOpen?: boolean;
|
||||
}
|
||||
|
||||
export function CoursePromoBadge({ sidebarOpen = true }: CoursePromoBadgeProps) {
|
||||
const [dismissed, setDismissed] = React.useState(false);
|
||||
const hideMarketingContent = useAppStore((state) => state.hideMarketingContent);
|
||||
|
||||
// If marketing content is hidden globally or dismissed locally, don't render
|
||||
if (hideMarketingContent || dismissed) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Collapsed state - show only icon with tooltip
|
||||
if (!sidebarOpen) {
|
||||
return (
|
||||
<div className="p-2 pb-0 flex justify-center">
|
||||
<TooltipProvider delayDuration={300}>
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<a
|
||||
href="https://agenticjumpstart.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="group cursor-pointer flex items-center justify-center w-10 h-10 bg-primary/10 text-primary rounded-lg hover:bg-primary/20 transition-all border border-primary/30"
|
||||
data-testid="course-promo-badge-collapsed"
|
||||
>
|
||||
<Sparkles className="size-4 shrink-0" />
|
||||
</a>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="right" className="flex items-center gap-2">
|
||||
<span>Become a 10x Dev</span>
|
||||
<span
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setDismissed(true);
|
||||
}}
|
||||
className="p-0.5 rounded-full hover:bg-primary/30 transition-colors cursor-pointer"
|
||||
aria-label="Dismiss"
|
||||
>
|
||||
<X className="size-3" />
|
||||
</span>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// Expanded state - show full badge
|
||||
return (
|
||||
<div className="p-2 pb-0">
|
||||
<a
|
||||
href="https://agenticjumpstart.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="group cursor-pointer flex items-center justify-between w-full px-2 lg:px-3 py-2.5 bg-primary/10 text-primary rounded-lg font-medium text-sm hover:bg-primary/20 transition-all border border-primary/30"
|
||||
data-testid="course-promo-badge"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<Sparkles className="size-4 shrink-0" />
|
||||
<span className="hidden lg:block">Become a 10x Dev</span>
|
||||
</div>
|
||||
<span
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setDismissed(true);
|
||||
}}
|
||||
className="hidden lg:block p-1 rounded-full hover:bg-primary/30 transition-colors cursor-pointer"
|
||||
aria-label="Dismiss"
|
||||
>
|
||||
<X className="size-3.5" />
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -37,8 +37,6 @@ export function SettingsView() {
|
||||
setShowProfilesOnly,
|
||||
muteDoneSound,
|
||||
setMuteDoneSound,
|
||||
hideMarketingContent,
|
||||
setHideMarketingContent,
|
||||
currentProject,
|
||||
moveProjectToTrash,
|
||||
defaultPlanningMode,
|
||||
@@ -104,9 +102,7 @@ export function SettingsView() {
|
||||
<AppearanceSection
|
||||
effectiveTheme={effectiveTheme}
|
||||
currentProject={settingsProject}
|
||||
hideMarketingContent={hideMarketingContent}
|
||||
onThemeChange={handleSetTheme}
|
||||
onHideMarketingContentChange={setHideMarketingContent}
|
||||
/>
|
||||
);
|
||||
case "keyboard":
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Checkbox } from "@/components/ui/checkbox";
|
||||
import { Palette, Megaphone } from "lucide-react";
|
||||
import { Palette } from "lucide-react";
|
||||
import { themeOptions } from "@/config/theme-options";
|
||||
import { cn } from "@/lib/utils";
|
||||
import type { Theme, Project } from "../shared/types";
|
||||
@@ -8,17 +7,13 @@ import type { Theme, Project } from "../shared/types";
|
||||
interface AppearanceSectionProps {
|
||||
effectiveTheme: Theme;
|
||||
currentProject: Project | null;
|
||||
hideMarketingContent: boolean;
|
||||
onThemeChange: (theme: Theme) => void;
|
||||
onHideMarketingContentChange: (hide: boolean) => void;
|
||||
}
|
||||
|
||||
export function AppearanceSection({
|
||||
effectiveTheme,
|
||||
currentProject,
|
||||
hideMarketingContent,
|
||||
onThemeChange,
|
||||
onHideMarketingContentChange,
|
||||
}: AppearanceSectionProps) {
|
||||
return (
|
||||
<div
|
||||
@@ -85,35 +80,6 @@ export function AppearanceSection({
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Separator */}
|
||||
<div className="border-t border-border/30 my-4" />
|
||||
|
||||
{/* Hide Marketing Content Setting */}
|
||||
<div className="group flex items-start space-x-3 p-3 rounded-xl hover:bg-accent/30 transition-colors duration-200 -mx-3">
|
||||
<Checkbox
|
||||
id="hide-marketing-content"
|
||||
checked={hideMarketingContent}
|
||||
onCheckedChange={(checked) =>
|
||||
onHideMarketingContentChange(checked === true)
|
||||
}
|
||||
className="mt-1"
|
||||
data-testid="hide-marketing-content-checkbox"
|
||||
/>
|
||||
<div className="space-y-1.5">
|
||||
<Label
|
||||
htmlFor="hide-marketing-content"
|
||||
className="text-foreground cursor-pointer font-medium flex items-center gap-2"
|
||||
>
|
||||
<Megaphone className="w-4 h-4 text-brand-500" />
|
||||
Hide marketing content
|
||||
</Label>
|
||||
<p className="text-xs text-muted-foreground/80 leading-relaxed">
|
||||
When enabled, hides promotional content like the "Become a 10x Dev" badge
|
||||
in the sidebar. This setting persists across sessions.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -459,9 +459,6 @@ export interface AppState {
|
||||
// Audio Settings
|
||||
muteDoneSound: boolean; // When true, mute the notification sound when agents complete (default: false)
|
||||
|
||||
// Marketing Settings
|
||||
hideMarketingContent: boolean; // When true, hide marketing content like the "Become a 10x Dev" badge (default: false)
|
||||
|
||||
// Enhancement Model Settings
|
||||
enhancementModel: AgentModel; // Model used for feature enhancement (default: sonnet)
|
||||
|
||||
@@ -673,9 +670,6 @@ export interface AppActions {
|
||||
// Audio Settings actions
|
||||
setMuteDoneSound: (muted: boolean) => void;
|
||||
|
||||
// Marketing Settings actions
|
||||
setHideMarketingContent: (hide: boolean) => void;
|
||||
|
||||
// Enhancement Model actions
|
||||
setEnhancementModel: (model: AgentModel) => void;
|
||||
|
||||
@@ -830,7 +824,6 @@ const initialState: AppState = {
|
||||
showProfilesOnly: false, // Default to showing all options (not profiles only)
|
||||
keyboardShortcuts: DEFAULT_KEYBOARD_SHORTCUTS, // Default keyboard shortcuts
|
||||
muteDoneSound: false, // Default to sound enabled (not muted)
|
||||
hideMarketingContent: false, // Default to showing marketing content
|
||||
enhancementModel: "sonnet", // Default to sonnet for feature enhancement
|
||||
aiProfiles: DEFAULT_AI_PROFILES,
|
||||
projectAnalysis: null,
|
||||
@@ -1494,9 +1487,6 @@ export const useAppStore = create<AppState & AppActions>()(
|
||||
// Audio Settings actions
|
||||
setMuteDoneSound: (muted) => set({ muteDoneSound: muted }),
|
||||
|
||||
// Marketing Settings actions
|
||||
setHideMarketingContent: (hide) => set({ hideMarketingContent: hide }),
|
||||
|
||||
// Enhancement Model actions
|
||||
setEnhancementModel: (model) => set({ enhancementModel: model }),
|
||||
|
||||
@@ -2341,7 +2331,6 @@ export const useAppStore = create<AppState & AppActions>()(
|
||||
showProfilesOnly: state.showProfilesOnly,
|
||||
keyboardShortcuts: state.keyboardShortcuts,
|
||||
muteDoneSound: state.muteDoneSound,
|
||||
hideMarketingContent: state.hideMarketingContent,
|
||||
enhancementModel: state.enhancementModel,
|
||||
// Profiles and sessions
|
||||
aiProfiles: state.aiProfiles,
|
||||
|
||||
@@ -1,184 +0,0 @@
|
||||
/**
|
||||
* Settings Marketing Content Toggle Tests
|
||||
*
|
||||
* Tests for the "Hide marketing content" setting in the Appearance section.
|
||||
*/
|
||||
|
||||
import { test, expect } from "@playwright/test";
|
||||
import * as fs from "fs";
|
||||
|
||||
import {
|
||||
waitForNetworkIdle,
|
||||
createTestGitRepo,
|
||||
cleanupTempDir,
|
||||
createTempDirPath,
|
||||
setupProjectWithPathNoWorktrees,
|
||||
navigateToSettings,
|
||||
} from "./utils";
|
||||
|
||||
// Create unique temp dir for this test run
|
||||
const TEST_TEMP_DIR = createTempDirPath("settings-marketing-tests");
|
||||
|
||||
interface TestRepo {
|
||||
path: string;
|
||||
cleanup: () => Promise<void>;
|
||||
}
|
||||
|
||||
// Configure all tests to run serially
|
||||
test.describe.configure({ mode: "serial" });
|
||||
|
||||
test.describe("Settings Marketing Content Tests", () => {
|
||||
let testRepo: TestRepo;
|
||||
|
||||
test.beforeAll(async () => {
|
||||
// Create test temp directory
|
||||
if (!fs.existsSync(TEST_TEMP_DIR)) {
|
||||
fs.mkdirSync(TEST_TEMP_DIR, { recursive: true });
|
||||
}
|
||||
});
|
||||
|
||||
test.beforeEach(async () => {
|
||||
// Create a fresh test repo for each test
|
||||
testRepo = await createTestGitRepo(TEST_TEMP_DIR);
|
||||
});
|
||||
|
||||
test.afterEach(async () => {
|
||||
// Cleanup test repo after each test
|
||||
if (testRepo) {
|
||||
await testRepo.cleanup();
|
||||
}
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
// Cleanup temp directory
|
||||
cleanupTempDir(TEST_TEMP_DIR);
|
||||
});
|
||||
|
||||
test("should show course promo badge by default", async ({ page }) => {
|
||||
// Setup project without worktrees for simpler testing
|
||||
await setupProjectWithPathNoWorktrees(page, testRepo.path);
|
||||
await page.goto("/");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Wait for sidebar to load
|
||||
await expect(page.locator('[data-testid="sidebar"]')).toBeVisible({
|
||||
timeout: 10000,
|
||||
});
|
||||
|
||||
// Course promo badge should be visible by default
|
||||
const promoBadge = page.locator('[data-testid="course-promo-badge"]');
|
||||
await expect(promoBadge).toBeVisible({ timeout: 5000 });
|
||||
});
|
||||
|
||||
test("should hide course promo badge when setting is enabled", async ({
|
||||
page,
|
||||
}) => {
|
||||
// Setup project
|
||||
await setupProjectWithPathNoWorktrees(page, testRepo.path);
|
||||
await page.goto("/");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Navigate to settings
|
||||
await navigateToSettings(page);
|
||||
|
||||
// Click on Appearance tab in settings navigation
|
||||
const appearanceTab = page.getByRole("button", { name: /appearance/i });
|
||||
await appearanceTab.click();
|
||||
|
||||
// Find and click the hide marketing content checkbox
|
||||
const hideMarketingCheckbox = page.locator(
|
||||
'[data-testid="hide-marketing-content-checkbox"]'
|
||||
);
|
||||
await expect(hideMarketingCheckbox).toBeVisible({ timeout: 5000 });
|
||||
await hideMarketingCheckbox.click();
|
||||
|
||||
// Navigate back to board to see the sidebar
|
||||
await page.goto("/board");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Wait for Zustand store to rehydrate from localStorage
|
||||
await page.waitForFunction(() => {
|
||||
const storage = localStorage.getItem('automaker-storage');
|
||||
if (!storage) return false;
|
||||
const parsed = JSON.parse(storage);
|
||||
return parsed.state?.hideMarketingContent === true;
|
||||
});
|
||||
|
||||
// Course promo badge should now be hidden
|
||||
const promoBadge = page.locator('[data-testid="course-promo-badge"]');
|
||||
await expect(promoBadge).not.toBeVisible({ timeout: 5000 });
|
||||
});
|
||||
|
||||
test("should persist hide marketing setting across page reloads", async ({
|
||||
page,
|
||||
}) => {
|
||||
// Setup project
|
||||
await setupProjectWithPathNoWorktrees(page, testRepo.path);
|
||||
await page.goto("/");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Navigate to settings and enable hide marketing
|
||||
await navigateToSettings(page);
|
||||
|
||||
const appearanceTab = page.getByRole("button", { name: /appearance/i });
|
||||
await appearanceTab.click();
|
||||
|
||||
const hideMarketingCheckbox = page.locator(
|
||||
'[data-testid="hide-marketing-content-checkbox"]'
|
||||
);
|
||||
await hideMarketingCheckbox.click();
|
||||
|
||||
// Reload the page
|
||||
await page.reload();
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Course promo badge should still be hidden after reload
|
||||
const promoBadge = page.locator('[data-testid="course-promo-badge"]');
|
||||
await expect(promoBadge).not.toBeVisible({ timeout: 5000 });
|
||||
});
|
||||
|
||||
test("should show course promo badge again when setting is disabled", async ({
|
||||
page,
|
||||
}) => {
|
||||
// Setup project with hide marketing already enabled via localStorage
|
||||
await page.addInitScript(() => {
|
||||
const state = {
|
||||
state: {
|
||||
hideMarketingContent: true,
|
||||
projects: [],
|
||||
currentProject: null,
|
||||
theme: "dark",
|
||||
sidebarOpen: true,
|
||||
},
|
||||
version: 2,
|
||||
};
|
||||
localStorage.setItem("automaker-storage", JSON.stringify(state));
|
||||
});
|
||||
|
||||
await setupProjectWithPathNoWorktrees(page, testRepo.path);
|
||||
await page.goto("/");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Verify promo is hidden initially
|
||||
const promoBadge = page.locator('[data-testid="course-promo-badge"]');
|
||||
await expect(promoBadge).not.toBeVisible({ timeout: 5000 });
|
||||
|
||||
// Navigate to settings and disable hide marketing
|
||||
await navigateToSettings(page);
|
||||
|
||||
const appearanceTab = page.getByRole("button", { name: /appearance/i });
|
||||
await appearanceTab.click();
|
||||
|
||||
const hideMarketingCheckbox = page.locator(
|
||||
'[data-testid="hide-marketing-content-checkbox"]'
|
||||
);
|
||||
await hideMarketingCheckbox.click(); // Uncheck
|
||||
|
||||
// Navigate back to board
|
||||
await page.goto("/board");
|
||||
await waitForNetworkIdle(page);
|
||||
|
||||
// Course promo badge should now be visible again
|
||||
await expect(promoBadge).toBeVisible({ timeout: 5000 });
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user