kunthawat/moreminimore-vibe
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add promo link for pro mode selector (#219)

Browse Source
This commit is contained in:
Will Chen
2025-05-21 15:37:29 -07:00
committed by GitHub
parent b520f7d97c
commit 2508673077
1 changed files with 97 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

171
src/components/ProModeSelector.tsx
View File

@@ -13,6 +13,7 @@ import { Switch } from "@/components/ui/switch";
import { Label } from "@/components/ui/label"; import { Label } from "@/components/ui/label";
import { Sparkles, Info } from "lucide-react"; import { Sparkles, Info } from "lucide-react";
import { useSettings } from "@/hooks/useSettings"; import { useSettings } from "@/hooks/useSettings";
import { IpcClient } from "@/ipc/ipc_client";
export function ProModeSelector() { export function ProModeSelector() {
const { settings, updateSettings } = useSettings(); const { settings, updateSettings } = useSettings();
@@ -33,9 +34,7 @@ export function ProModeSelector() {
}); });
}; };
if (!settings?.enableDyadPro) { const proEnabled = Boolean(settings?.enableDyadPro);
return null;
}
return ( return (
<Popover> <Popover>
@@ -63,80 +62,104 @@ export function ProModeSelector() {
</h4> </h4>
<div className="h-px bg-gradient-to-r from-primary/50 via-primary/20 to-transparent" /> <div className="h-px bg-gradient-to-r from-primary/50 via-primary/20 to-transparent" />
</div> </div>
<div className="flex items-center justify-between"> {!proEnabled && (
<div className="space-y-2"> <div className="text-sm text-center text-muted-foreground">
<Label htmlFor="saver-mode">Saver Mode</Label> <a
<div className="flex items-center gap-1"> className="inline-flex items-center justify-center gap-2 rounded-md border border-primary/30 bg-primary/10 px-3 py-2 text-sm font-medium text-primary shadow-sm transition-colors hover:bg-primary/20 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
<Tooltip> onClick={() => {
<TooltipTrigger asChild> IpcClient.getInstance().openExternalUrl(
<Info className="h-4 w-4 text-muted-foreground cursor-help" /> "https://dyad.sh/pro#ai",
</TooltipTrigger> );
<TooltipContent side="right" className="max-w-72"> }}
Note: using the free Gemini API lets Google use your data to >
improve their models. Unlock Pro modes
</TooltipContent> </a>
</Tooltip>
<p className="text-xs text-muted-foreground max-w-55">
Uses your free Gemini API quota before consuming Dyad Pro AI
credits
</p>
</div>
</div> </div>
<Switch )}
id="saver-mode" <SelectorRow
checked={Boolean(settings?.enableProSaverMode)} id="saver-mode"
onCheckedChange={toggleSaverMode} label="Saver Mode"
/> description="Uses your free Gemini API quota before consuming Dyad Pro AI credits"
</div> tooltip="Note: using the free Gemini API lets Google use your data to
<div className="flex items-center justify-between"> improve their models."
<div className="space-y-2"> proEnabled={proEnabled}
<Label htmlFor="lazy-edits">Turbo Edits</Label> settingEnabled={Boolean(settings?.enableProSaverMode)}
<div className="flex items-center gap-1"> toggle={toggleSaverMode}
<Tooltip> />
<TooltipTrigger asChild> <SelectorRow
<Info className="h-4 w-4 text-muted-foreground cursor-help" /> id="lazy-edits"
</TooltipTrigger> label="Turbo Edits"
<TooltipContent side="right" className="max-w-72"> description="Makes editing files faster and cheaper."
Edits files faster. tooltip="Uses a faster, cheaper model to generate full file updates."
</TooltipContent> proEnabled={proEnabled}
</Tooltip> settingEnabled={Boolean(settings?.enableProLazyEditsMode)}
<p className="text-xs text-muted-foreground max-w-55"> toggle={toggleLazyEdits}
Makes editing files faster and cheaper. />
</p> <SelectorRow
</div> id="smart-context"
</div> label="Smart Context"
<Switch description="Automatically detects the most relevant files for your chat"
id="lazy-edits" tooltip="Improve efficiency and save credits working on large codebases."
checked={Boolean(settings?.enableProLazyEditsMode)} proEnabled={proEnabled}
onCheckedChange={toggleLazyEdits} settingEnabled={Boolean(settings?.enableProSmartFilesContextMode)}
/> toggle={toggleSmartContext}
</div> />
<div className="flex items-center justify-between">
<div className="space-y-2">
<Label htmlFor="smart-context">Smart Context</Label>
<div className="flex items-center gap-1">
<Tooltip>
<TooltipTrigger asChild>
<Info className="h-4 w-4 text-muted-foreground cursor-help" />
</TooltipTrigger>
<TooltipContent side="right" className="max-w-72">
Improve efficiency and save credits working on large
codebases.
</TooltipContent>
</Tooltip>
<p className="text-xs text-muted-foreground max-w-55">
Automatically detects the most relevant files for your chat
</p>
</div>
</div>
<Switch
id="smart-context"
checked={Boolean(settings?.enableProSmartFilesContextMode)}
onCheckedChange={toggleSmartContext}
/>
</div>
</div> </div>
</PopoverContent> </PopoverContent>
</Popover> </Popover>
); );
} }
function SelectorRow({
id,
label,
description,
tooltip,
proEnabled,
settingEnabled,
toggle,
}: {
id: string;
label: string;
description: string;
tooltip: string;
proEnabled: boolean;
settingEnabled: boolean;
toggle: () => void;
}) {
return (
<div className="flex items-center justify-between">
<div className="space-y-2">
<Label
htmlFor={id}
className={!proEnabled ? "text-muted-foreground/50" : ""}
>
{label}
</Label>
<div className="flex items-center gap-1">
<Tooltip>
<TooltipTrigger asChild>
<Info
className={`h-4 w-4 cursor-help ${!proEnabled ? "text-muted-foreground/50" : "text-muted-foreground"}`}
/>
</TooltipTrigger>
<TooltipContent side="right" className="max-w-72">
{tooltip}
</TooltipContent>
</Tooltip>
<p
className={`text-xs ${!proEnabled ? "text-muted-foreground/50" : "text-muted-foreground"} max-w-55`}
>
{description}
</p>
</div>
</div>
<Switch
id={id}
checked={proEnabled ? settingEnabled : false}
onCheckedChange={toggle}
disabled={!proEnabled}
/>
</div>
);
}