From 39de26cdd7671b1d0445ba8b99bb605112068d6d Mon Sep 17 00:00:00 2001 From: Kiet Ho Date: Mon, 1 Dec 2025 07:23:30 -0800 Subject: [PATCH 1/4] refactor download --- .../app/components/CTASection/CTASection.tsx | 2 +- .../DownloadButton/DownloadButton.tsx | 100 ++++++++---------- .../src/app/components/Header/Header.tsx | 15 +-- .../components/HeroSection/HeroSection.tsx | 2 +- apps/website/src/constants.ts | 2 + 5 files changed, 55 insertions(+), 66 deletions(-) diff --git a/apps/website/src/app/components/CTASection/CTASection.tsx b/apps/website/src/app/components/CTASection/CTASection.tsx index cdcedcddaeb..b587c0140b5 100644 --- a/apps/website/src/app/components/CTASection/CTASection.tsx +++ b/apps/website/src/app/components/CTASection/CTASection.tsx @@ -28,7 +28,7 @@ export function CTASection() { transition={{ duration: 0.5, delay: 0.1 }} > - Download for MacOS + Download for Apple Silicon Mac diff --git a/apps/website/src/app/components/DownloadButton/DownloadButton.tsx b/apps/website/src/app/components/DownloadButton/DownloadButton.tsx index 7e26bf65789..21107e97f5d 100644 --- a/apps/website/src/app/components/DownloadButton/DownloadButton.tsx +++ b/apps/website/src/app/components/DownloadButton/DownloadButton.tsx @@ -4,22 +4,21 @@ import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, - DropdownMenuSeparator, DropdownMenuTrigger, } from "@superset/ui/dropdown-menu"; -import { HiMiniArrowDownTray } from "react-icons/hi2"; -import { DOWNLOAD_URL_MAC_ARM64 } from "@/constants"; +import { HiMiniArrowDownTray, HiMiniClock } from "react-icons/hi2"; +import { DOWNLOAD_URL_MAC_ARM64, GITHUB_REPO_URL } from "@/constants"; interface DownloadButtonProps { size?: "sm" | "md"; className?: string; - onJoinWindowsWaitlist?: () => void; + onJoinWaitlist?: () => void; } export function DownloadButton({ size = "md", className = "", - onJoinWindowsWaitlist, + onJoinWaitlist, }: DownloadButtonProps) { const sizeClasses = size === "sm" ? "px-4 py-2 text-sm" : "px-6 py-3 text-base"; @@ -28,9 +27,8 @@ export function DownloadButton({ window.open(DOWNLOAD_URL_MAC_ARM64, "_blank"); }; - const handleIntelDownload = () => { - // TODO: Add actual download link for Intel-based Macs - console.log("Downloading for Intel-based Macs"); + const handleBuildFromSource = () => { + window.open(GITHUB_REPO_URL, "_blank"); }; return ( @@ -38,7 +36,7 @@ export function DownloadButton({ - - {/* Join Windows Waitlist */} - - - - - - - {/* Download for Intel-based Macs */} - -
-

- Mac older than November 2020? -

- + + - Download for Intel-based Macs - + +
-
+ ); diff --git a/apps/website/src/app/components/Header/Header.tsx b/apps/website/src/app/components/Header/Header.tsx index 335f2c2d8fc..dff1290358e 100644 --- a/apps/website/src/app/components/Header/Header.tsx +++ b/apps/website/src/app/components/Header/Header.tsx @@ -47,16 +47,11 @@ export function Header() { animate={{ opacity: 1, x: 0 }} transition={{ duration: 0.3, delay: 0.1 }} > - - setIsWaitlistOpen(true)} - /> - setIsWaitlistOpen(true)} - size="sm" - /> + + setIsWaitlistOpen(true)} + /> diff --git a/apps/website/src/app/components/HeroSection/HeroSection.tsx b/apps/website/src/app/components/HeroSection/HeroSection.tsx index 9fb08d68725..403b4ec3b43 100644 --- a/apps/website/src/app/components/HeroSection/HeroSection.tsx +++ b/apps/website/src/app/components/HeroSection/HeroSection.tsx @@ -105,7 +105,7 @@ function DownloadButton() { className="group inline-flex items-center bg-[#f9f9f5] hover:bg-[#f0efeb] rounded-[5px] pl-4 pr-3 py-2 transition-colors" > - Download for MacOS + Download for Apple Silicon Mac diff --git a/apps/website/src/constants.ts b/apps/website/src/constants.ts index a1870c2ef14..6add04b6f87 100644 --- a/apps/website/src/constants.ts +++ b/apps/website/src/constants.ts @@ -1,2 +1,4 @@ export const DOWNLOAD_URL_MAC_ARM64 = "https://github.com/superset-sh/superset/releases/download/v0.0.1/Superset-0.0.1-arm64-mac.zip"; + +export const GITHUB_REPO_URL = "https://github.com/superset-sh/superset"; From 1866f5e9b5f1d1b2af47399023cb89764a213ccc Mon Sep 17 00:00:00 2001 From: Kiet Ho Date: Mon, 1 Dec 2025 07:30:20 -0800 Subject: [PATCH 2/4] update download link --- .../app/components/CTASection/CTASection.tsx | 62 +++--- .../DownloadButton/DownloadButton.tsx | 160 +++++++-------- .../src/app/components/Header/Header.tsx | 11 +- .../components/HeroSection/HeroSection.tsx | 190 +++++++++--------- .../PlatformDropdown/PlatformDropdown.tsx | 94 +++++++++ .../app/components/PlatformDropdown/index.ts | 2 + 6 files changed, 298 insertions(+), 221 deletions(-) create mode 100644 apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx create mode 100644 apps/website/src/app/components/PlatformDropdown/index.ts diff --git a/apps/website/src/app/components/CTASection/CTASection.tsx b/apps/website/src/app/components/CTASection/CTASection.tsx index b587c0140b5..4ec1964d31c 100644 --- a/apps/website/src/app/components/CTASection/CTASection.tsx +++ b/apps/website/src/app/components/CTASection/CTASection.tsx @@ -1,38 +1,42 @@ "use client"; import { motion } from "framer-motion"; -import { HiMiniArrowDownTray } from "react-icons/hi2"; -import { DOWNLOAD_URL_MAC_ARM64 } from "@/constants"; +import { useState } from "react"; +import { DownloadButton } from "../DownloadButton"; +import { WaitlistModal } from "../WaitlistModal"; export function CTASection() { + const [isWaitlistOpen, setIsWaitlistOpen] = useState(false); + return ( -
-
- - Give us a try - + <> +
+
+ + Give us a try + - - - Download for Apple Silicon Mac - - - -
-
+ + setIsWaitlistOpen(true)} /> + +
+
+ setIsWaitlistOpen(false)} + /> + ); } diff --git a/apps/website/src/app/components/DownloadButton/DownloadButton.tsx b/apps/website/src/app/components/DownloadButton/DownloadButton.tsx index 21107e97f5d..57dd4a1920e 100644 --- a/apps/website/src/app/components/DownloadButton/DownloadButton.tsx +++ b/apps/website/src/app/components/DownloadButton/DownloadButton.tsx @@ -1,13 +1,8 @@ "use client"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@superset/ui/dropdown-menu"; import { HiMiniArrowDownTray, HiMiniClock } from "react-icons/hi2"; import { DOWNLOAD_URL_MAC_ARM64, GITHUB_REPO_URL } from "@/constants"; +import { type DropdownSection, PlatformDropdown } from "../PlatformDropdown"; interface DownloadButtonProps { size?: "sm" | "md"; @@ -31,88 +26,75 @@ export function DownloadButton({ window.open(GITHUB_REPO_URL, "_blank"); }; - return ( - - - - - - {/* Download for Apple Silicon Macs */} - - - - {/* Other platforms */} -
-

Other platforms

-
- - - - - - -
-
-
-
+ const appleIcon = ( + + Apple logo + + ); + + const githubIcon = ( + + GitHub logo + + + ); + + const sections: DropdownSection[] = [ + { + items: [ + { + id: "mac-download", + label: "Download for Mac", + description: "APPLE SILICON", + icon: appleIcon, + onClick: handleAppleSiliconDownload, + variant: "primary", + }, + ], + }, + { + title: "Other platforms", + items: [ + { + id: "waitlist", + label: "Join waitlist for Windows & Linux", + icon: , + onClick: onJoinWaitlist || (() => {}), + }, + { + id: "build-from-source", + label: "Build from source on GitHub", + icon: githubIcon, + onClick: handleBuildFromSource, + }, + ], + }, + ]; + + const trigger = ( + + ); + + return ; } diff --git a/apps/website/src/app/components/Header/Header.tsx b/apps/website/src/app/components/Header/Header.tsx index dff1290358e..f8f8d285290 100644 --- a/apps/website/src/app/components/Header/Header.tsx +++ b/apps/website/src/app/components/Header/Header.tsx @@ -4,7 +4,6 @@ import { motion } from "framer-motion"; import Image from "next/image"; import { useState } from "react"; import { DownloadButton } from "../DownloadButton"; -import { JoinWaitlistButton } from "../JoinWaitlistButton"; import { SocialLinks } from "../SocialLinks"; import { WaitlistModal } from "../WaitlistModal"; @@ -47,11 +46,11 @@ export function Header() { animate={{ opacity: 1, x: 0 }} transition={{ duration: 0.3, delay: 0.1 }} > - - setIsWaitlistOpen(true)} - /> + + setIsWaitlistOpen(true)} + /> diff --git a/apps/website/src/app/components/HeroSection/HeroSection.tsx b/apps/website/src/app/components/HeroSection/HeroSection.tsx index 403b4ec3b43..f10326f64fe 100644 --- a/apps/website/src/app/components/HeroSection/HeroSection.tsx +++ b/apps/website/src/app/components/HeroSection/HeroSection.tsx @@ -3,112 +3,108 @@ import { motion } from "framer-motion"; import Image from "next/image"; import { useEffect, useState } from "react"; -import { HiMiniArrowDownTray } from "react-icons/hi2"; -import { DOWNLOAD_URL_MAC_ARM64 } from "@/constants"; +import { DownloadButton } from "../DownloadButton"; +import { WaitlistModal } from "../WaitlistModal"; export function HeroSection() { + const [isWaitlistOpen, setIsWaitlistOpen] = useState(false); + return ( -
- {/* Grid background */} - - +
+ {/* Grid background */} + - grid - - - - - - - - - - - - - - - - - -
-
-
-
- {/* Left column - Text content */} - - {/* Heading */} -
-

grid + + - The terminal app for parallel cli agents. -

-

- Run dozens of Claude Code, Codex, or any other cli agents you - love. -

-
+ + + + + + + + + + + + + + + + +
+
+
+ {/* Left column - Text content */} + + {/* Heading */} +
+

+ The terminal app for parallel cli agents. +

+

+ Run dozens of Claude Code, Codex, or any other cli agents you + love. +

+
-
- -
-
+
+ setIsWaitlistOpen(true)} + /> +
+ - {/* Right column - Product Demo */} - - - + {/* Right column - Product Demo */} + + + +
-
-
- ); -} - -function DownloadButton() { - return ( - - - Download for Apple Silicon Mac - - - + + setIsWaitlistOpen(false)} + /> + ); } diff --git a/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx b/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx new file mode 100644 index 00000000000..c0152046cd8 --- /dev/null +++ b/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx @@ -0,0 +1,94 @@ +"use client"; + +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "@superset/ui/dropdown-menu"; +import type { ReactNode } from "react"; + +export interface DropdownItem { + id: string; + label: string; + description?: string; + icon?: ReactNode; + onClick: () => void; + variant?: "primary" | "secondary"; +} + +export interface DropdownSection { + title?: string; + items: DropdownItem[]; +} + +interface PlatformDropdownProps { + trigger: ReactNode; + sections: DropdownSection[]; + align?: "start" | "end" | "center"; + className?: string; +} + +export function PlatformDropdown({ + trigger, + sections, + align = "end", + className = "", +}: PlatformDropdownProps) { + return ( + + {trigger} + + {sections.map((section, sectionIndex) => ( +
+ {sectionIndex > 0 && ( +
+ )} + {section.title && ( +

+ {section.title} +

+ )} +
+ {section.items.map((item) => ( + + {item.variant === "primary" ? ( + + ) : ( + + )} + + ))} +
+
+ ))} + + + ); +} diff --git a/apps/website/src/app/components/PlatformDropdown/index.ts b/apps/website/src/app/components/PlatformDropdown/index.ts new file mode 100644 index 00000000000..536c93b9ef6 --- /dev/null +++ b/apps/website/src/app/components/PlatformDropdown/index.ts @@ -0,0 +1,2 @@ +export type { DropdownItem, DropdownSection } from "./PlatformDropdown"; +export { PlatformDropdown } from "./PlatformDropdown"; From adfbb2b0557a700a437915540eacceab15a18d57 Mon Sep 17 00:00:00 2001 From: Kiet Ho Date: Mon, 1 Dec 2025 07:52:37 -0800 Subject: [PATCH 3/4] save --- .../src/app/components/HeroSection/HeroSection.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/apps/website/src/app/components/HeroSection/HeroSection.tsx b/apps/website/src/app/components/HeroSection/HeroSection.tsx index f10326f64fe..e8219f1a353 100644 --- a/apps/website/src/app/components/HeroSection/HeroSection.tsx +++ b/apps/website/src/app/components/HeroSection/HeroSection.tsx @@ -3,6 +3,8 @@ import { motion } from "framer-motion"; import Image from "next/image"; import { useEffect, useState } from "react"; +import { FaGithub } from "react-icons/fa"; +import { GITHUB_REPO_URL } from "@/constants"; import { DownloadButton } from "../DownloadButton"; import { WaitlistModal } from "../WaitlistModal"; @@ -85,6 +87,15 @@ export function HeroSection() { setIsWaitlistOpen(true)} /> +
From 20696a87097b2ad7c884e3267b8ed58982602c73 Mon Sep 17 00:00:00 2001 From: Kiet Ho Date: Mon, 1 Dec 2025 07:53:48 -0800 Subject: [PATCH 4/4] save --- .../src/app/components/PlatformDropdown/PlatformDropdown.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx b/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx index c0152046cd8..3a95f7f0859 100644 --- a/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx +++ b/apps/website/src/app/components/PlatformDropdown/PlatformDropdown.tsx @@ -43,7 +43,7 @@ export function PlatformDropdown({ className={`w-80 bg-white border border-zinc-200 rounded-[5px] shadow-lg p-2 ${className}`} > {sections.map((section, sectionIndex) => ( -
+
{sectionIndex > 0 && (
)}