chore: Remove playground toggle

This commit is contained in:
Sidharth Vinod
2026-01-28 00:25:17 +05:30
parent 739ef6dfe2
commit d9e70427af
3 changed files with 11 additions and 52 deletions
+7 -47
View File
@@ -9,13 +9,9 @@
<script lang="ts">
import MainMenu from '$/components/MainMenu.svelte';
import McWrapper from '$/components/McWrapper.svelte';
import { Button } from '$/components/ui/button';
import { Separator } from '$/components/ui/separator';
import { Switch } from '$/components/ui/switch';
import { dismissPromotion, getActivePromotion } from '$lib/util/promos/promo';
import { urlsStore } from '$lib/util/state';
import { MCBaseURL } from '$lib/util/util';
import type { ComponentProps, Snippet } from 'svelte';
import MermaidIcon from '~icons/custom/mermaid';
import CloseIcon from '~icons/material-symbols/close-rounded';
@@ -29,8 +25,6 @@
let { children, mobileToggle }: Props = $props();
const isReferral = document.referrer.includes(MCBaseURL);
type Links = ComponentProps<typeof DropdownNavMenu>['links'];
const githubLinks: Links = [
@@ -58,7 +52,7 @@
</script>
{#if activePromotion}
<div class="top-bar z-10 flex h-fit w-full bg-primary">
<div class="top-bar bg-primary z-10 flex h-fit w-full">
<div
class="flex flex-grow"
role="button"
@@ -87,46 +81,12 @@
<div class="flex flex-1 items-center gap-2">
<MainMenu />
<MermaidIcon class="size-6" />
<div
id="switcher"
class="flex items-center justify-center gap-4 font-medium"
class:flex-row-reverse={isReferral}>
<a href="/" class="whitespace-nowrap text-accent">
{#if !isReferral && !mobileToggle}
Mermaid
{/if}
Live Editor
</a>
<McWrapper>
<div class="hidden items-center justify-center gap-4 md:flex">
<Separator orientation="vertical" />
<Switch
id="editorMode"
class="data-[state=checked]:bg-secondary"
checked={isReferral}
onclick={() => {
logEvent('playgroundToggle', { isReferred: isReferral });
// Wait for the event to be logged
setTimeout(() => {
window.open(
$urlsStore.mermaidChart({ medium: 'toggle' }).playground,
'_self',
// Do not send referrer header, if the user already came from playground
isReferral ? 'noreferrer' : ''
);
}, 100);
}} />
<a
href={$urlsStore.mermaidChart({ medium: 'toggle' }).playground}
class="whitespace-nowrap">
Playground <span class="hidden text-sm opacity-50 lg:inline"
>- more features, no account required</span>
</a>
</div>
</McWrapper>
</div>
<a href="/" class="text-accent whitespace-nowrap">
{#if !mobileToggle}
Mermaid
{/if}
Live Editor
</a>
</div>
<div
id="menu"
+4 -4
View File
@@ -5,9 +5,9 @@ import type { MermaidConfig } from 'mermaid';
import { derived, get, writable, type Readable } from 'svelte/store';
import { env } from './env';
import {
extractErrorLineText,
findMostRelevantLineNumber,
replaceLineNumberInErrorMessage
extractErrorLineText,
findMostRelevantLineNumber,
replaceLineNumberInErrorMessage
} from './errorHandling';
import { parse } from './mermaid';
import { localStorage, persist } from './persist';
@@ -140,7 +140,7 @@ export const urlsStore = derived([stateStore], ([{ code, serialized }]) => {
mermaidChart: ({
medium
}: {
medium: 'ai_repair' | 'main_menu' | 'save_diagram' | 'share' | 'toggle';
medium: 'ai_repair' | 'main_menu' | 'save_diagram' | 'share';
}) => {
const params = new URLSearchParams({
utm_source: C.utmSource,
-1
View File
@@ -89,7 +89,6 @@ const delaysPerEvent = {
migration: defaultDelay,
mobileViewToggle: defaultDelay,
panZoom: minutesToMilliSeconds(10),
playgroundToggle: 0,
pwaInstalled: defaultDelay,
render: minutesToMilliSeconds(5),
renderDiagram: defaultDelay,