rename REPL to Playground

apps/svelte.dev/src/routes/(authed)/apps/+page.svelte

@@ -102,7 +102,7 @@
 			<ul class:selecting>
 				{#each data.gists as gist}
 					<li class:selected={selected.includes(gist.id)}>
-						<a href={selecting ? undefined : `/repl/${gist.id}`}>
+						<a href={selecting ? undefined : `/playground/${gist.id}`}>
 							<h2>{gist.name}</h2>
 							<span>updated {format(gist.updated_at || gist.created_at)}</span>
 						</a>
@@ -130,7 +130,7 @@
 				{/if}
 			</div>
 		{:else}
-			<p>No apps here. <a href="/repl">Go make one!</a></p>
+			<p>No apps here. <a href="/playground">Go make one!</a></p>
 		{/if}
 	{:else}
 		<p>

apps/svelte.dev/src/routes/(authed)/repl/+page.js → apps/svelte.dev/src/routes/(authed)/playground/+page.js

@@ -17,5 +17,5 @@ export function load({ url }) {
 	const q = new URLSearchParams();
 	if (version) q.set('version', version);
 	if (vim) q.set('vim', vim);
-	redirect(301, `/repl/${id}?${q}`);
+	redirect(301, `/playground/${id}?${q}`);
 }

apps/svelte.dev/src/routes/(authed)/repl/[id]/+page.server.js → apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.server.js

@@ -1,7 +1,7 @@
 import { error } from '@sveltejs/kit';
 
 export async function load({ fetch, params, url }) {
-	const res = await fetch(`/repl/api/${params.id}.json`);
+	const res = await fetch(`/playground/api/${params.id}.json`);
 
 	if (!res.ok) {
 		error(/** @type {import('@sveltejs/kit').NumericRange<400, 599>}  */ (res.status));

apps/svelte.dev/src/routes/(authed)/repl/[id]/+page.svelte → apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.svelte

@@ -23,7 +23,9 @@
 		}
 
 		const url =
-			params.length > 0 ? `/repl/${data.gist.id}?${params.join('&')}` : `/repl/${data.gist.id}`;
+			params.length > 0
+				? `/playground/${data.gist.id}?${params.join('&')}`
+				: `/playground/${data.gist.id}`;
 
 		history.replaceState({}, 'x', url);
 	});
@@ -47,7 +49,7 @@
 
 	function handle_fork(event: CustomEvent) {
 		console.log('> handle_fork', event);
-		goto(`/repl/${event.detail.gist.id}?version=${version}`);
+		goto(`/playground/${event.detail.gist.id}?version=${version}`);
 	}
 
 	function handle_change(event: CustomEvent) {
@@ -56,17 +58,17 @@
 
 	const svelteUrl = $derived(
 		browser && version === 'local'
-			? `${location.origin}/repl/local`
+			? `${location.origin}/playground/local`
 			: `https://unpkg.com/svelte@${version}`
 	);
 
 	const relaxed = $derived(data.gist.relaxed || (data.user && data.user.id === data.gist.owner));
 </script>
 
 <svelte:head>
-	<title>{name} • REPL • Svelte</title>
+	<title>{name} • Playground • Svelte</title>
 
-	<meta name="twitter:title" content="{data.gist.name} • REPL • Svelte" />
+	<meta name="twitter:title" content="{data.gist.name} • Playground • Svelte" />
 	<meta name="twitter:description" content="Web development, but fun" />
 	<meta name="Description" content="Interactive Svelte playground" />
 </svelte:head>

apps/svelte.dev/src/routes/(authed)/repl/[id]/AppControls.svelte → apps/svelte.dev/src/routes/(authed)/playground/[id]/AppControls.svelte

@@ -56,7 +56,7 @@
 		const { files } = repl.toJSON() as { files: File[] };
 
 		try {
-			const r = await fetch(`/repl/create.json`, {
+			const r = await fetch(`/playground/create.json`, {
 				method: 'POST',
 				credentials: 'include',
 				headers: {
@@ -121,7 +121,7 @@
 			// ~> Any missing files are considered deleted!
 			const { files } = repl.toJSON() as { files: File[] };
 
-			const r = await fetch(`/repl/save/${gist.id}.json`, {
+			const r = await fetch(`/playground/save/${gist.id}.json`, {
 				method: 'PUT',
 				credentials: 'include',
 				headers: {

apps/svelte.dev/src/routes/(authed)/repl/[id]/embed/+page.server.ts → apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.server.ts

@@ -1,7 +1,7 @@
 import { error } from '@sveltejs/kit';
 
 export async function load({ fetch, params, url }) {
-	const res = await fetch(`/repl/api/${params.id}.json`);
+	const res = await fetch(`/playground/api/${params.id}.json`);
 
 	if (!res.ok) {
 		throw error(res.status);

apps/svelte.dev/src/routes/(authed)/repl/[id]/embed/+page.svelte → apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.svelte

@@ -18,8 +18,8 @@
 
 		const url =
 			params.length > 0
-				? `/repl/${data.gist.id}/embed?${params.join('&')}`
-				: `/repl/${data.gist.id}/embed`;
+				? `/playground/${data.gist.id}/embed?${params.join('&')}`
+				: `/playground/${data.gist.id}/embed`;
 
 		history.replaceState({}, 'x', url);
 	}
@@ -46,17 +46,17 @@
 
 	const svelteUrl = $derived(
 		browser && version === 'local'
-			? `${location.origin}/repl/local`
+			? `${location.origin}/playground/local`
 			: `https://unpkg.com/svelte@${version}`
 	);
 
 	const relaxed = $derived(data.gist.relaxed || (data.user && data.user.id === data.gist.owner));
 </script>
 
 <svelte:head>
-	<title>{data.gist.name} • REPL • Svelte</title>
+	<title>{data.gist.name} • Playground • Svelte</title>
 
-	<meta name="twitter:title" content="{data.gist.name} • REPL • Svelte" />
+	<meta name="twitter:title" content="{data.gist.name} • Playground • Svelte" />
 	<meta name="twitter:description" content="Web development, but fun" />
 	<meta name="Description" content="Interactive Svelte playground" />
 </svelte:head>

apps/svelte.dev/src/routes/(authed)/repl/api/[id].json/+server.js → apps/svelte.dev/src/routes/(authed)/playground/api/[id].json/+server.js

@@ -33,7 +33,7 @@ function munge(files) {
 
 export async function GET({ params }) {
 	// Currently, these pages(that are in examples/) are prerendered. To avoid making any FS requests,
-	// We prerender examples pages during build time. That means, when something like `/repl/hello-world.json`
+	// We prerender examples pages during build time. That means, when something like `/playground/hello-world.json`
 	// is accessed, this function won't be run at all, as it will be served from the filesystem
 
 	const example = get_example(examples_data, params.id);
@@ -50,7 +50,7 @@ export async function GET({ params }) {
 	if (dev && !client) {
 		// in dev with no local Supabase configured, proxy to production
 		// this lets us at least load saved REPLs
-		const res = await fetch(`https://svelte.dev/repl/api/${params.id}.json`);
+		const res = await fetch(`https://svelte.dev/playground/api/${params.id}.json`);
 
 		// returning the response directly results in a bizarre
 		// content encoding error, so we create a new one

apps/svelte.dev/src/routes/(authed)/repl/embed/+page.server.js → apps/svelte.dev/src/routes/(authed)/playground/embed/+page.server.js

@@ -2,13 +2,13 @@ import { redirect } from '@sveltejs/kit';
 
 export function load({ url }) {
 	if (!url.searchParams.has('gist')) {
-		throw redirect(301, '/repl/hello-world/embed');
+		throw redirect(301, '/playground/hello-world/embed');
 	} else {
 		const searchParamsWithoutGist = new URLSearchParams(url.searchParams);
 		searchParamsWithoutGist.delete('gist');
 		throw redirect(
 			301,
-			`/repl/${url.searchParams.get('gist')}/embed?${searchParamsWithoutGist.toString()}`
+			`/playground/${url.searchParams.get('gist')}/embed?${searchParamsWithoutGist.toString()}`
 		);
 	}
 }

apps/svelte.dev/src/routes/+layout.server.js

@@ -17,7 +17,7 @@ export const load = async ({ url, fetch }) => {
 function get_nav_title(url) {
 	const list = new Map([
 		[/^docs/, 'Docs'],
-		[/^repl/, 'REPL'],
+		[/^playground/, 'Playground'],
 		[/^blog/, 'Blog'],
 		[/^faq/, 'FAQ'],
 		[/^tutorial/, 'Tutorial'],

apps/svelte.dev/src/routes/+layout.svelte

@@ -21,7 +21,7 @@
 	{/if}
 </svelte:head>
 
-<Shell nav_visible={$page.route.id !== '/(authed)/repl/[id]/embed'}>
+<Shell nav_visible={$page.route.id !== '/(authed)/playground/[id]/embed'}>
 	{#snippet top_nav()}
 		<Nav title={data.nav_title} links={data.nav_links}>
 			{#snippet search()}

apps/svelte.dev/src/routes/+page.svelte

@@ -84,8 +84,8 @@
 					href: '/tutorial'
 				},
 				{
-					title: 'repl',
-					href: '/repl'
+					title: 'playground',
+					href: '/playground'
 				},
 				{
 					title: 'blog',

apps/svelte.dev/src/routes/nav.json/+server.ts

@@ -48,9 +48,9 @@ async function get_nav_list(): Promise<NavigationLink[]> {
 			sections: tutorial
 		},
 		{
-			title: 'REPL',
-			prefix: 'repl',
-			pathname: '/repl'
+			title: 'Playground',
+			prefix: 'playground',
+			pathname: '/playground'
 		},
 		{
 			title: 'Blog',

apps/svelte.dev/src/routes/repl/[...path]/+page.server.ts

@@ -0,0 +1,5 @@
+import { redirect } from '@sveltejs/kit';
+
+export function load({ url }) {
+	throw redirect(308, url.href.replace('/repl', '/playground'));
+}